9 Replies Latest reply on Sep 5, 2013 5:14 AM by AMULI

    Using a global variable within a function

    Raffalaff Level 1

      Hi all,

       

      I'm trying to learn how to use global variables, but can't quite get it right:

      Im trying to use two buttons, named UpButton and DownButton to control one global variable, p1

      A text field, named "Value" displays p1.

       

      Here's my code:

       

       

      p1 = 0;

       

      ButtonClick("UpButton", p1, 100,"Value");

      ButtonClick("DownButton", p1,(-100),"Value");

       

      function ButtonClick(ButtonName,Var,Increment,TextToChange){

                          sym.$(ButtonName).click(function(){

                          Var = Var + Increment;

                          sym.$(TextToChange).html(Var);

                });

      }

       

      However, it seems to be treating p1 as two different variables.

       

      Here's a link to the page to show you what I mean, apologies but this link wont work in google chrome because I'm using dropbox as a server temporarily

      In other browsers you may need to click "Show all content" or similar to any security warnings...

       

      https://dl.dropboxusercontent.com/u/83693404/ButtonTest/buttons.html

       

      Here are the project files:

      https://app.box.com/s/0shocivto8fl295h62uq

       

       

      Any help greatly appreciated, sorry if this is a stupid question,

       

      Katherine

        • 1. Re: Using a global variable within a function
          AMULI Level 4

          Hi Katherine,

           

          Look at this thread : http://forums.adobe.com/message/5512963#5512963

           

          and download the example I give, because it's very near of what your trying to do : clicking the buttons produces a cumulative count in a text field.

           

          Gil

          1 person found this helpful
          • 2. Re: Using a global variable within a function
            Raffalaff Level 1

            Hi Gil,

            I've looked at your example and can't get my head around why yours works and mine doesn't...
              I'll keep at it, thank you very much for your help and your example.

            Katherine

            • 3. Re: Using a global variable within a function
              AMULI Level 4

              Hi Katherine,

              However, it seems to be treating p1 as two different variables.

               

              Indeed, your code created two different variables in two different scopes (I guess it as to do with JavaScript closures, but do  not ask me more, I am still a bit foggy about that idiosyncrasy ).

               

              In JavaScript, a primitive parameter – this is the case here with p1, a Number value –, is passed by value. In other words, a copy of the value is made. Your code handles two copies of the value stored in p1.

               

              This contrasts with an object parameter, which is passed by reference (address in memory), without copy. Your code would work if Numbers were passed by reference : the two Var (p1) would then point to the same address.

               

              The intent behind your trial is a global variable.

               

              1) Let us be as simple as possible :

               

              Stage : document.compositionReady event handler

               

              p1 = 0;

               

              buttonClick = function( Increment)

              {

                p1 += Increment;

                sym.$( "Value").html( p1);

              }

               

              Stage : DownButton.click event handler

               

              buttonClick(-100);

               

              Stage : UpButton.click event handler

               

              buttonClick(100);

               

              Without being preceded by the var keyword the variables are global.

               

              So the Number variable p1 can be accessed inside function buttonClick.

               

              And the Function variable buttonClick as well, is accessible inside click event handlers, everything (function definition +function calls) being inside the same symbol (Stage).

               

              2) Now, suppose this is no longer the case : you want to access a variable from another symbol.

               

              We create a new GraySquare symbol, instantiated both in the DownButton symbol (instance name DownSquare) and in the UpButton symbol (instance name DownSquare).

               

              Stage : document.compositionReady event handler

               

              p1 = 0;

               

              sym.buttonClick = function( Increment)

              {

                p1 += Increment;

                sym.$( "Value").html( p1);

              }

               

              The sym. prefix is now necessary to make the variable (here a Function, but you would proceed exactly the same with a String, Number or Boolean) accessible in other symbols.

               

              DownButton symbol : DownSquare.click event handler

               

              sym.getComposition().getStage().buttonClick( -100);

               

              UpButton symbol : UpSquare.click event handler

               

              sym.getComposition().getStage().buttonClick( 100);

               

              From these other symbols, the sym.getComposition().getStage(). prefix is necessary to acces to our global variable (function).

               

              The two examples are downloadable here : https://app.box.com/s/6vkyiqk7i8zwlw0j1wk1

               

              Gil

              • 4. Re: Using a global variable within a function
                AMULI Level 4

                3) A simpler way to share global variables between symbols is to define a Javascript object (thanks again to Zaxist who showed us the way ).

                 

                Stage : document.compositionReady event handler

                 

                COUNT =

                {

                  p1 : 0,

                  buttonClick : function( Increment)

                  {

                    COUNT.p1 += Increment;

                    sym.$( "Value").html( COUNT.p1);

                  }

                };

                 

                The COUNT object has two properties : a Number and a Function.

                 

                An interesting feature is that you can have different objects, which are each a different namespace, avoiding name conflicts (COUNT.total and MEMBERS.total for example).

                 

                DownButton symbol : DownSquare.click event handler

                 

                COUNT.buttonClick( -100);

                 

                UpButton symbol : UpSquare.click event handler

                 

                COUNT.buttonClick( 100);

                 

                This avoids the heavy sym.getComposition.getStage().

                 

                Gil

                 

                PS : the above link has been updated to include this third version.

                1 person found this helpful
                • 5. Re: Using a global variable within a function
                  resdesign Adobe Community Professional & MVP

                  Amuli, this is cool!

                  • 6. Re: Using a global variable within a function
                    AMULI Level 4

                    My pleasure, Marie

                    • 7. Re: Using a global variable within a function
                      AMULI Level 4

                      sorry if this is a stupid question

                       

                      Not at all, Katherine. An excellent opportunity for all of us to think and clarify

                       

                      Gil

                      1 person found this helpful
                      • 8. Re: Using a global variable within a function
                        Raffalaff Level 1

                        Wow Gil thanks so much for taking the time to explain it so well, you really know your stuff!

                        • 9. Re: Using a global variable within a function
                          AMULI Level 4

                          You're welcome, Katherine. Formulating for others is an actual opportunity to get things clearer. I had not the whole answer when you asked, so I have learned as well

                           

                          Gil