Jump to content
Search Community

Strange behavior after timeline.remove( tween )

arl1nd test
Moderator Tag

Recommended Posts

Hello everyone,

 

This is my first post here. I am writing about an issue that is messing my mind. The example is simple so you can try on your own, lets start with timeline and three children:

var t = gsap.timeline( { paused: true } ),
    myObj = { width: 0 },
    a = gsap.to( myObj, { duration: 0.8, width: '+=100' } ),
    b = gsap.to( myObj, { duration: 0.7, width: '+=200' } ),
    c = gsap.to( myObj, { duration: 1.1, width: '+=300' } );

t.add( [a, b, c] );

After that, removing the tween "b" works fine:

t.remove( b );

So by calling t.getChildren( false ) returns 2 tweens which is also fine.

 

However, when I tweak the "b" tween after removing it from timeline "t" it causes unexpected behavior for me at least.

 

Lets say for example setting progress to 50%: b.progress( 0.5 )

The timeline will return 3 tweens again, and the "b" tween is assigned as the first element in timeline that is previously removed from.

 

Is there anything here I am doing wrong?

 

Thank you.

 

P.S. The same code works differently (correct) with version 2.1.3 of GSAP -> https://bit.ly/2tMK2C6

See the Pen eYmrPGo by arl1nd (@arl1nd) on CodePen

  • Thanks 1
Link to comment
Share on other sites

Well, that's a tricky scenario because in order for any animation to play, it must be on a timeline (think of it like a record player, where the animation is the record and the player with the needle is the timeline). GSAP includes some logic so that if an animation gets popped off of a timeline (which happens as soon as its done, by default, on the global timeline or any other which has autoRemoveChildren:true) and then its playhead is later adjusted, it automatically gets added back to its previous parent so that it can continue playing. Without that logic, it'd just be stuck. 

 

However, I see why you'd be confused by the behavior in your particular scenario. I think it's reasonable to add some logic so that it only gets added back to a timeline that has autoRemoveChildren:true which is limited to the global timeline by default. That'd deliver the most intuitive results for the most cases from my estimation. 

 

I've made that adjustment in the upcoming release which you can preview here: https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/gsap-latest-beta.min.js

 

Better? 

  • Like 1
  • Thanks 1
Link to comment
Share on other sites

Dear Jack,

 

Thank you for taking into consideration and adding this intuitive logic for unlinked tweens from their parent timeline to live forever free (until added again).

 

Now I feel I am more in control of the detached tweens because the way it was behaving before was harder to control the animation and parent timeline.

 

Keep up with the great work,

Arlind

 

 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...