4 Replies Latest reply on Mar 4, 2009 8:02 AM by Manu Osten

    panelMenu isn't working with javascript "jquery.min.js"

    Manu Osten Apprentice

      Hello,

      I want to embed a video player into the page and need a javascript jquery.min.js from google () for using a dynamic element. The dynamic element is working, but then the componente panelMenu isn't working. MayBe is there a conflict between the javascripts from google and richfaces panelMenu.

      error-message from firebugs


      this.tablehider is undefined
      ()(Object undefined=[0], Object, Object myId=j_id_jsp_661261448_1:subview:navi_1, Object type=node onopen=; onclose=; event=click mode=server, Object, ["dr-pmenu-hovered-element", "rich-pmenu-hovered-element"], 0, true, "panelMenuNodeAction", false, "A4J.AJAX.Submit('j_id_jsp_661261448_0','j_id_jsp_661261448_1',event,{'similarityGroupingId':'j_id_jsp_661261448_1:subview:navi_1','parameters':{'j_id_jsp_661261448_1:subview:navi_1':'j_id_jsp_661261448_1:subview:navi_1'} ,'actionUrl':'/PonteWeb/index.jsf'} )", "", "left", "/PonteWeb/a4j/g/3_3_0.GAorg.richfaces.renderkit.html.iconimages.PanelMenuIconChevronDown/DATB/eAH7!!8!AAX9Av4_.jsf", "/PonteWeb/a4j/g/3_3_0.GAorg.richfaces.renderkit.html.iconimages.PanelMenuIconChevronUp/DATB/eAH7!!8!AAX9Av4_.jsf", "/PonteWeb/a4j/g/3_3_0.GAorg.richfaces.renderkit.html.iconimages.PanelMenuIconSpacer/DATB/eAH7!!8!AAX9Av4_.jsf")panelMenu.js.jsf (line 11)
      klass()3_3_0.GA...cript.jsf (line 4)
      (?)()index.jsf (line 189)
      [Break on this error] this.clientId=ids.myId;this.mainRow=this...onSpacer;if(action){this.action=action;}



      break on this error details:

      this.clientId=ids.myId;this.mainRow=this.tablehider.rows[0];Element.extend(this.mainRow);var mainCells=this.mainRow.cells;this.leftIcon=Richfaces.lastDescendant(mainCells[0]);this.labelArea=mainCells[1];this.rightIcon=Richfaces.firstDescendant(mainCells[2]);this.content=this.tdhider.select(".dr-pmenu-group-self-label")[0];this.iconAlign=iconAlign;this.iconCollapsed=iconCollapsed;this.iconExpanded=iconExpanded;this.iconSpacer=iconSpacer;if(action){this.action=action;}


      I am using JBoss 4.2.3, Richfaces 3.3.0 and OpenJDK 1.6

      Manu

        • 1. Re: panelMenu isn't working with javascript
          Nick Belaevski Master

          Hello Manu,

          RF is bundled with jQuery script, please try using it:

          <a4j:loadScript
           src="resource:///org/richfaces/renderkit/html/scripts/jquery/jquery.js" />
          


          • 2. Re: panelMenu isn't working with javascript
            Manu Osten Apprentice

            Hello nbelaevski,

            thx, but the dynamic element isn't working with that loadScript.

            The element should be resized after clicking to full size to play the video.

            code:

             <head>
            ...
            ...
             <a4j:loadScript src="resource:///org/richfaces/renderkit/html/scripts/jquery/jquery.js" />
             <a4j:loadScript src="js/flowplayer-3.0.6.min.js"/>
             <script>
             $(function() {
            
             $f("a.player", "swfplayer/flowplayer-3.0.7.swf", {
            
             // perform custom stuff before default click action
             onBeforeClick: function() {
            
             // unload previously loaded player
             $f().unload();
            
             // get wrapper element as jQuery object
             var wrap = $(this.getParent());
            
             // hide nested play button
             wrap.find("img").fadeOut();
            
             // start growing animation
             wrap.animate({width:640, height:480}, 500, function() {
            
             // when animation finishes we will load our player
             $f(this).load();
            
             });
            
             // disable default click behaviour (player loading)
             return false;
             },
            
             // unload action resumes to original state
             onUnload: function() {
             $(this.getParent()).animate({width:52, height:37}, 500, function() {
            
             // make play button visible again
             $(this).find("img").fadeIn();
             });
             },
            
             // when playback finishes perform our custom unload action
             onFinish: function() {
             this.unload();
             }});
             });
             </script>
             </head>
             <body>
            ...
            ...
            ...
             <div class="row">
             <a
             href="http://example/movies/herzlichwillkommendsl.flv"
             class="player" >
             <img src="images/hand.gif" width="52" height="37" />
             </a>
            
             </div>
            
            ...
            ...
            ...
            </body>
            
            
            Manu


            • 3. Re: panelMenu isn't working with javascript
              Nick Belaevski Master

              Please try using jQuery() instead of $() with the bundled version of jQuery.

              • 4. Re: panelMenu isn't working with javascript
                Manu Osten Apprentice

                Thx. I found the documentation http://docs.jquery.com/Using_jQuery_with_Other_Libraries to solve my problem.

                I prefer another variable to $.