Jump to content


TimelineMax and Overwrite Problem? [SOLVED]

Recommended Posts

Firstly, hello everybody!


I recently switched to the v11 beta and i´m very happy with the new timeline feature. Thanks Jack!

Currently i´m working on a project, where i use the following code:


b3Timeline = new TimelineMax({paused:true});
	TweenMax.to(mainHolder.sImgHolder, 0.4, {x:-540}),
	TweenMax.to(mainHolder.barsMask, 0.4, {x:0, width:stage.stageWidth}),
	TweenMax.to(mainHolder.bar1, 0.4, {x:stage.stageWidth + 30, overwrite:3}),
	TweenMax.to(mainHolder.bar2, 0.4, {x:stage.stageWidth + 30, overwrite:3}),
	TweenMax.to(mainHolder.bar3, 0.4, {x:stage.stageWidth + 30, overwrite:3}),
	TweenMax.to(mainHolder.bar4, 0.4, {x:stage.stageWidth + 30, overwrite:3}),
b3Timeline.appendMultiple(TweenMax.allTo([mainHolder.bar1, mainHolder.bar2, mainHolder.bar3, mainHolder.bar4,], 0.3, {alpha:1}, 0.1), "TweenAlign.SEQUENCE" );

The timeline plays when the user clicks one of the bars, and is reverted on click on a close button.

This far everything works nicely, but when i add mouse over & -out listeners to the bars, to call a function like

TweenMax.to(mainHolder.bar1, 0.7, {x:540, ease:Exponential.easeOut});

(& back)

the tweens seem to conflict: As long as the MouseOver/out Tweens are not finished, the tweening bars wil not start the x property tweens from the timeline . As you see, i tried to set

the overwrite mode to 3, so this tweens would kill any existing tweens of the object, but it doesn´t seem to work...


Any help would be greatly appreciated!





PS: i attached the swf and main .as of the project. The problem occurs when you repeatedly click and close the 3rd bar from the top

Link to comment
Share on other sites

Do you have the latest v11? Please make sure you do, because there was a bug for a few days that was recently squashed. http://blog.greensock.com/v11beta/. And are you saying that the new tween does NOT overwrite the old one when it should?

Link to comment
Share on other sites

It looks like it... I downloaded the latest version ov v11, but the problem remains.

I recreated the problem here: http://www.deeait.com/testing/GS/test.html . Source files are attached below.

When you remove the MouseOver/Out functions, everything works nicely. But as soon as there are two tweens on the same mc

they conflict, and the new tweens do not seem to overwrite the old ones.

Link to comment
Share on other sites

I think I see the problem. It's not really a bug as much as a misunderstanding about how and when overwriting occurs. In ALL mode, overwriting occurs immediately when the tween is created. In all other modes (AUTO, CONCURRENT, ALL_AFTER), overwriting occurs as soon as the tween is initted (typically when it starts for the first time). In your example, the first time your timeline starts playing each of the tweens, it inits them and overwriting logic runs. Thereafter, however, it doesn't keep re-initting those tweens. It just renders them.


So let's say your timeline plays. Its children are initted. Then you roll over one of those bars and it creates another (standalone) tween. While that tween is running, you start playing your timeline again. The tween that's nested in the timeline doesn't keep looking for competing tweens after it has already initted, so it lets that one run. See what I mean?


You could invalidate() the timeline or tween to force it to re-init on the next render cycle. That would consequently force it to overwrite other competing tweens at that point (depending on your OverwriteManager mode). Keep in mind that invalidating a tween/timeline will get rid of all the starting values too which can actually be very handy. If, however, you want to retain the starting values, set the currentTime back to 0 before invalidating().


I know this sounds convoluted, but overwriting is actually one of the most complex aspects of a tweening engine. That's also why a lot of engines don't even have any overwriting management capabilities.

Link to comment
Share on other sites

By the way, I limited overwriting to when the tween inits because if I didn't, performance would be SIGNIFICANTLY impacted, and it gives developers exactly what they're looking for in 99.9% of the use cases. And in the other 0.1% of the cases, you can get the desired behavior with a little extra effort and the invalidate() method.

Link to comment
Share on other sites

Yes, invalidate works perfectly! I didn´t see that the Tweens init only once, though it seems kind of obvious now :)

Thanks for clarifying things.


Keep up your great work! I just donated another 50$, i really appreciate what you are doing.

Link to comment
Share on other sites

Great! Thanks for your support. Very kind of you.

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.