3 Replies Latest reply on May 17, 2014 1:54 AM by jamesfootlight

    HELP! This is to tricky to explain in a title, see detail in post!

    jamesfootlight Level 1

      Thanks for your time, see screenshot and project - how do I ensure the vertically tiled buttons along the right side (which are always visible) call a specific animation/event depending on which country button along the bottom is clicked? ie when UK is clicked the market share button will show market share info on the UK and so on?Screen Shot 2014-05-01 at 14.24.50.png

      https://www.dropbox.com/s/n6b8epuy7nfe47v/Buttons.zip?m=

        • 1. Re: HELP! This is to tricky to explain in a title, see detail in post!
          Sudeshnasarkar27 Adobe Employee

          Hi ,

           

          One way I can think of is have the "countrybutton" that you have defined in the composition ready of the stage be declared as global arrays.

          1) For this you need to add that at the top of the code that appears pressing Ctrl+E and clicking on the "Full code" button at the top right corner.

          So , it would be something like this -

          /***********************

          * Adobe Edge Animate Composition Actions

          *

          * Edit this file with caution, being careful to preserve

          * function signatures and comments starting with 'Edge' to maintain the

          * ability to interact with these actions from within Adobe Edge Animate

          *

          ***********************/

           

          var countrybutton = ['UKcountrybutton','USAcountrybutton','countrybutton2','countrybutton4','countrybutton5', 'countrybutton6','countrybutton7','countrybutton8','countrybutton9','countrybutton10'];

           

          (function($, Edge, compId){

          var Composition = Edge.Composition, Symbol = Edge.Symbol; // aliases for commonly used Edge classes

           

          ........ etc etc

           

          2)In the stage composition ready define a variable say "clickedbtn" as -

          sym.setVariable("clickedbtn" , ""); //Initially the value of this variable is "".

          3)Now whenever a country button is clicked for eg add the code on the click handler of the UKcountryButton -

          sym.setVariable("clickedbtn" , countrybutton[0]);

          console.log(sym.getVariable("clickedbtn"));

          So this would set the variable "clickedbtn" with the value stating which button is clicked.

          4)Now for the other buttons appearing in the right panel , you can have a switch case logic to show the appropriate graph depending on which button in the bottom panel was selected/clicked.

           

          Do let me know if this solves your problem.

           

          Thanks and Regards,

          Sudeshna Sarkar

          1 person found this helpful
          • 2. Re: HELP! This is to tricky to explain in a title, see detail in post!
            jamesfootlight Level 1

            Hi thank you so much for helping, I am not the best at coding, and am a new learner, so some of the  eg. parts you leave blank and the 'switch' part you talk about I don;t know how to code.

             

            I have put a link to my EDGE program here, and was wondering if you could at least set add a bit of coding (maybe set up one example within it) for me to then follow and replicate for the rest of the country buttons?

             

            Dropbox - Buttons.zip

             

            Thank you so much for your help - the only way I could think of was to have a set of top right buttons for each bottom button, that would be hidden until the button was pressed and then shown.

             

            Thanks again,

             

            James

            • 3. Re: HELP! This is to tricky to explain in a title, see detail in post!
              jamesfootlight Level 1

              this is the code for each button:

               

              u see attached, for some reason my fadeOut command for the rest of the countries when each button is clicked fails to fadeOut the rest of the countries and only USA and UK seem to work?


              This is my code for each button:


              sym.$("UKcountrybutton").fadeOut();

              sym.$("UKcountrybutton").fadeIn();

               

              sym.getSymbol("Countries").$("UK").fadeToggle();

              sym.getSymbol("Countries").$("USA","AUS","Hongkong","Switzerland","Ireland","India","Japan ","Netherlands","Spain").fadeOut();

               

              sym.getSymbol("Piecharts").$("UK").slideToggle();

              sym.getSymbol("Piecharts").$("USA","AUS","Hongkong","Switzerland","Ireland","India","Japan ","Netherlands","Spain").fadeOut();

               

              sym.getSymbol("Textwindows").$("UK").slideToggle();

              sym.getSymbol("Textwindows").$("USA","AUS","Hongkong","Switzerland","Ireland","India","Jap an","Netherlands","Spain").fadeOut();

               

              sym.$("SB").fadeToggle();