3 Replies Latest reply on Nov 21, 2012 3:14 PM by TimJaramillo

    Click handler button function to control symbols

    robertsimpson3

      Hi,

       

      I have a remote control image which has 2 buttons (Slide button & Bar Graph button).  Thanks to help from resdesign the first button controlling a slideshow of 15 images works.  In the slideshow there are question slides that need to launch an animated bar graph symbol showing the results.  I'm able to launch the first bar graph for slide 3.  I'm using the container method to place the bar graph on the stage.  The bar graph symbol can be closed using a click event from within the symbol.   Here are my questions:

       

      1. How to toggle the bar graph off OR delete the bar graph symbol when the Bar Graph button is clicked again.
      2. How to prevent multiple instances of the bar graph from launching in the container?
      3. How to close the bar graph if the user advances to the next slide? 

       

      Here's the code to control the Bar Graph button on compositionReady:

       

      var bgOn = false;

       

      sym.$("buttonbg").click(function(){

                          if (bgOn == false) {

                          sym.createChildSymbol("bg1", "bargraph_container3");

                          var container =  sym.getSymbol("bargraph_container3");

                          sym.container("bg1").play();

                          bgOn = true;

                          }

                          else {

            sym.deletesymbol();  //If bar graph symbol is already on, when buttonbg is clicked again then delete "bg1"

            bgOn = false;  // reset to false, click will relaunch "bg1"

            }

       

      Here's the project file.

      http://dl.dropbox.com/u/10647145/necc_viewer_nov2012.zip

       

      Thanks for your time,

      -Robert

        • 1. Re: Click handler button function to control symbols
          joel_pau Level 5

          ==> file attached.

           

          1) Symbol "stage", compositionReady:

          sym.bgOn = false;

           

          sym.$("buttonbg").click(function(){

          if (!sym.bgOn) {

          sym.bg1 = sym.createChildSymbol("bg1", "bargraph_container3").play();

          //var container =  sym.getSymbol("bargraph_container3");

          //container("bg1").play();

          sym.bgOn = true;

          } else {

          sym.bg1.deleteSymbol();  //If bar graph symbol is already on, when buttonbg is clicked again then delete "bg1"

          sym.bgOn = false// reset to false, click will relaunch "bg1"

          }

          });

           

          2) Symbol "bg1", close.click:

          sym.getParentSymbol("bargraph_container3").getParentSymbol("Stage").bgOn = false;

          sym.deleteSymbol();

          • 2. Re: Click handler button function to control symbols
            robertsimpson3 Level 1

            Joel, 

             

            Thanks for your prompt reply!  I'm pleased that the code could be modified to work correctly.  What does the statement (!sym.bgOn) evaluate as in the loop?  I'm finding it difficult to understand the proper use of jQuery/javascript syntax when applied to an Edge project.  My next step is to code the behavior of the other question slides so that the bar grph symbol is matched to the correct question slide.  I believe that an array will be needed.

             

            Thanks again.

            -Robert

            • 3. Re: Click handler button function to control symbols
              TimJaramillo Level 4

              Hey Robert, (!sym.bgOn) checks to see if the sym.bgOn variable is false.

               

              If you used (sym.bgOn), it would be checking if the variable is true.

              1 person found this helpful