4 Replies Latest reply on Oct 25, 2013 7:48 AM by AMULI

    Reversing a symbols timeline

    Salieri_purple

      Hi there,

       

      I need to activate a timeline event on a symbol with a button press on another object, then when the button is pressed again, reverse the timeline event. This will have something sliding in and out of the stage.

       

      If the animation is placed right at 0.00 and there's nothing else, then this code works OK:

       

      if (sym.getPosition() == 0)

      {

          sym.play();

      }

      else

      {

          sym.playReverse();

      }

       

      However there is other animation that plays automatically on page load, then a trigger stops all animation. The animation I need to trigger is a couple of seconds later bracketed by labels 'start' and 'stop'. So I need to code the button A to get the symbol B and animate from 'start' to 'stop' and then wait. Then on a further press to animate from 'stop' to 'start'. But I'm damned if I can get anything to work.

       

      Any ideas, anyone?

        • 1. Re: Reversing a symbols timeline
          AMULI Level 4

          Hi Salieri_purple,

           

          Let's define a growingUp symbol with autoplay property set to true which grows up a rectangle from bottom to top of the stage in 5s.

           

          In Stage > document.compositionReady event handler, let's define a JavaScript object containing

           

          • a boolean property reverse initialized to false ;

           

          • a function to switch the direction based on the direction and the current cursor x value e.pageX (e is the event object passed as a parameter ; stage width : 400) :

           

          ANIMA =

          {

            reverse: false,

            switchDirection: function( e)

            {

              var symAnima = sym.getSymbol('growingUp');

              if (ANIMA.reverse && e.pageX <200)

              {

                symAnima.play();

                ANIMA.reverse = false;

              }

              else if (!ANIMA.reverse && e.pageX >200)

              {

                symAnima.playReverse();

                ANIMA.reverse = true;   

              }

            }  

          }

           

          Stage > mousemove event handler

           

          ANIMA.switchDirection( e);

           

          The example file is downloadable here : https://app.box.com/s/ivqjhao17m4jbg4ldf9q

           

          Gil

          • 2. Re: Reversing a symbols timeline
            AMULI Level 4

            Sorry, Salieri_purple, I made a mistake posting an answer to another thread .

            But I will answer to yours.

             

            Gil

            • 3. Re: Reversing a symbols timeline
              Salieri_purple Level 1

              Ha, I'm glad you said, I was puzzling over your code thinking 'do I dare tell this person I don't think this answers the question?'

              • 4. Re: Reversing a symbols timeline
                AMULI Level 4

                Rereading your post, I cannot clearly understand what you are after .

                 

                But may be you could adapt the same logic as detailled above (in response to a neighboring problem, hence my mistake). In your case,

                 

                • instead of firing the switch function on mousemove, you will call it in yourButton.click event handler ;

                 

                • you will adapt the function, keeping the boolean part, but getting rid of the e.pageX tests.

                 

                If this doesn't help, please provide another description of the behavior you want to code and I will post a sample file (later : now, I have to go).

                 

                Gil

                1 person found this helpful