Clear all tweens during rebuild of timeline

[ajhalls]

I have made some great progress on the GUI last night and this morning. Seems like just about everything works, except... If you go to this page: https://ajhalls.github.io/Simple-Animation-Timeline-for-Greensock/

 

Click to add an X rotation, then click the timeline at around 500ms, you will see that the "Example" text is now upside down. Now click to add Y rotation. At this point it assumes the current upside down text is the initial state and animates it from there.

 

Since I couldn't modify any of the timeline info directly, I created a rebuild function that runs each time you drag and drop, resize, or add a new animation. All the info is stored in an object off to the side and rebuilt from that info.

 

How can I quickly clear those effects, or at least not assume that is the initial state?  I don't see that there is going to be that much value in doing a Codepen when you have access to the source on Github if needed, but if I am wrong, let me know

[Jonathan]

Hello ajhalls,

 

Have you looked into calling clear() .. Before you rebuild your timeline?

timeline.clear();

clear()

 

https://greensock.com/docs/#/HTML5/GSAP/TimelineMax/clear/

 

If this does not help can you please create a simple codepen example showing your issue. Just a couple of tweens so we can get an idea?

 

[ajhalls]

I do use the .clear() function, the issue is that I have one timeline that modifies the "Example" text, then when I add another tween, I .clear() the first timeline and create another timeline that uses the original one's modifications as the new starting point. I had a work around idea of rewinding to the beginning really quick before building the timeline and then fast forward to where I was before that I will try out.

[GreenSock]

Yep, if your goal is to get back to the beginning state, that sounds like the right approach (set timeline.progress(0) quickly before doing your other stuff). Let us know if you run into any other issues.