Question about TweenMax onUpdate parameter and function the to be run

Envato Authors CodeCanyon
1

In TweenMax and I believe TweenLite also, there’s a parameter that you can pass a function, the “onUpdate”

example:

TweenMax.to(someMC, tweenTime, {x:my_value, onUpdate:myFunction});
function myFunction():void
{
//do something
}

ok, so every time TweenMax do its job the onUpdate function is called.

now I modified the code like this

TweenMax.to(someMC, tweenTime, {x:my_value, onUpdate:myFunction(someValue)});
function myFunction(someValue:String):void
{
trace(someValue);
//do something
}

the someValue is traced corectly

now what I want is to do a switch check with the someValue as parameter

TweenMax.to(someMC, tweenTime, {x:my_value, onUpdate:myFunction(“one”)});
function myFunction(someValue:String):void
{
switch(someValue)
{
case “one”:
trace(someValue);
//check something and if true do something else
break;
}
}

the trace works correctly

now my problem:

TweenMax.to(someMC, tweenTime, {x:my_value, onUpdate:myFunction(“one”)});
function myFunction(someValue:String):void
{
switch(someValue)
{
case “one”:
if(something is true)
{
TweenMax.to(someMC, tweenTime, {x:another_value});
}
break;
}
}

not working :frowning:

the new TweeMax inside the switch option should override the previous one. At least this appear to be the normal behaviour if you add a new tween on the same value that is currently tweened.

how can I make this work? Thank you.

2

look in to:

com.greensock.OverwriteManager

3

Not sure if this works, but you could give it a whirl anyway :slight_smile:

Try killing the current tween before initiating the new one… i.e.

TweenMax.killTweensOf(someMC);//optionally pass in the 2nd parameter as true if you want to force tween completion

Hope this helps! :slight_smile:

4

When you specify the function on onUpdate or onStart or onComplete you can’t put the parameters in the function. You have to add them with onUpdateParams:

So I think this is how it goes but you’ll want to check greensock to make sure.

TwenMax.to(mc, 5, {x:0, onUpdate:myfunc, onUpdateParams:[“hello”, “goodbye”, “ok”]})

I think that’ll solve your problems.

5

Take a look here:

http://www.greensock.com/as/docs/tween/com/greensock/TweenMax.html#killTweensOf

6

dSKY gave you the answer

7

well thank you everyone for your answer, I tried all the solution proposed.

The OverwriteManager has no effect. the killTweensOf has no effect either but even if it has worked it had been of no use, as it kills all the tweens for my particular object and I have more of them working in parallel. I have a tween for each variable, as they start and stop at different times or are not needed at all.

Anyway the problem appear to be because of the way I pass the parameter as marcfolio pointed out. Now, if I pass the parameter with onUpdateParams it sometime works and sometimes not. I can’t understand why.

Well I need this because I want to get rid of the dozen of functions one for each tween that I have. It works excellent as I have it now, but I just don’t like all those functions. :slight_smile:

Well thank you everyone, I appreciate your help. :inlove:

If someone wonders what I need this for (or if someone cares :slight_smile: ) :

I work at a 3D game made with away3d. In particular I have this ship that player controls with the keyboard and I use TweenMax to tween the various ship movements, like acceleration, velocity, yaw, pitch, roll and others. Now its working great but as I said, the code have way to much functions that do just one thing, like stoping a tween or tween a variable to some other value if the player push or release a key.

8

How are you writing the tween?

Like Marcfolio’s example, when passing a function onComplete you leave out the () and instead just pass the name of the function.

Can you trace something before your new tween is supposed to fire? Because if your if statement passes, I don’t see any reason why the tween would not be overridden.

9

Maybe try “if” instead of “switch”? The only time I’ve really needed “onUpdated” was for a 3D project and I used “if” and it worked every time. It’s worth a shot.

10

Try this way.

TweenMax.to(someMC, tweenTime, {x:my_value, onUpdate: function() { myFunction("one")} });
11

@CrackerJack

the Marcfolio example works but not always, sometime like 1 in 5 times (random) the tween will not be overrided, probably because something in my code or I don’t know :?

@marcfolio

hmm I will try with if to see if works

@flashedge

if your example works, (and it should) I’m saved :slight_smile: I will try also this way.

thank you everyone for help I will post here what result I get.

12

This works every time for me:

http://pastie.org/1189575

13
the new TweeMax inside the switch option should override the previous one. At least this appear to be the normal behaviour if you add a new tween on the same value that is currently tweened.

Two things to keep in mind:

  1. marcfolio was correct - you were using the wrong syntax to pass parameters:
//BAD!
TweenMax.to(mc, 1, {x:100, onUpdate:myFunction("param")});

//GOOD
TweenMax.to(mc, 1, {x:100, onUpdate:myFunction, onUpdateParams:["param"]});
  1. As far as it overwriting things intermittently, by default TweenMax will only overwrite the individual overlapping properties on tweens of the same object that are running at the same time (to avoid conflicts of course). If there are no tweening properties left in a tween (as a result of overwriting), the entire tween will be killed. However, if there are still any tweening properties that exist, the tween won’t be killed (for obvious reasons). So if you noticed sometimes the onUpdate didn’t stop running after you created a new tween on that object, it is because the other tween still had properties that were tweening. For example:
TweenMax.to(mc, 2, {x:300, onUpdate:myFunction});
function myFunction():void {
    trace("myFunction()");
    if (mc.x > 200) {
        TweenMax.to(mc, 1, {x:0}); //kills the previous tween
    }
}

In the above code, as soon as mx.x is greater than 200, a new tween is created for mc. Since the new tween also affects mc’s “x” property, it will overwrite the initial tween. When that initial tween is overwritten, since there are no other tweening properties left, the tween is killed and the onUpdate doesn’t get called anymore. However, once I add another property like y:100, that changes the results:

TweenMax.to(mc, 2, {x:300, y:100, onUpdate:myFunction});
function myFunction():void {
    trace("myFunction()");
    if (mc.x > 200) {
        TweenMax.to(mc, 1, {x:0}); //only kills the "x" part of the other tween
    }
}

Now you’ll see that the trace() continues firing even after the new tween is created because the old tween is still tweening the “y” property. It’s not a bug, of course - this is how it should function.

You said “sometimes it works and sometimes not” - I bet the times it didn’t work it was because you had other properties in the original tween.

By the way, there are forums dedicated to GreenSock tools at http://forums.greensock.com

14

3 Cheers for Jack!

I heart TweenLite!

15
2) As far as it overwriting things intermittently, by default TweenMax will only overwrite the individual overlapping properties on tweens of the same object that are running at the same time (to avoid conflicts of course). If there are no tweening properties left in a tween (as a result of overwriting), the entire tween will be killed. However, if there are still any tweening properties that exist, the tween won't be killed (for obvious reasons). So if you noticed sometimes the onUpdate didn't stop running after you created a new tween on that object, it is because the other tween still had properties that were tweening. For example: 
TweenMax.to(mc, 2, {x:300, onUpdate:myFunction});
function myFunction():void {
    trace("myFunction()");
    if (mc.x > 200) {
        TweenMax.to(mc, 1, {x:0}); //kills the previous tween
    }
}

In the above code, as soon as mx.x is greater than 200, a new tween is created for mc. Since the new tween also affects mc’s “x” property, it will overwrite the initial tween. When that initial tween is overwritten, since there are no other tweening properties left, the tween is killed and the onUpdate doesn’t get called anymore. However, once I add another property like y:100, that changes the results:

TweenMax.to(mc, 2, {x:300, y:100, onUpdate:myFunction});
function myFunction():void {
    trace("myFunction()");
    if (mc.x > 200) {
        TweenMax.to(mc, 1, {x:0}); //only kills the "x" part of the other tween
    }
}

Now you’ll see that the trace() continues firing even after the new tween is created because the old tween is still tweening the “y” property. It’s not a bug, of course - this is how it should function.

thank you for your clear answer, is not everyday one receive help for the creator of Greensock Tween engine :smiley: :slight_smile:

I didn’t have the code as you posted but it was like this.

TweenMax.to(this, myTime, {rotationY:myRotation, onUpdate:myFunction, onUpdateParams:[“param”]});

(“this” because I call the tween inside a ObjectContainer3D class from away3D)

and

TweenMax.to(this, myTime, {rotationX:myRotation, onUpdate:myFunction, onUpdateParams:[“param2”]});

when some boolean variable turns out “true” I will for example:

TweenMax.to(this, myTime, {rotationY:defaultRotation}); //this is inside myFunction

Now the code is not the same but I think what you point out applies in the same way. even if the rotationY and rotationX are called separately in the end the tweens are applied on the same entity.

Well as I said, thank you again for clarifying this for me.

16
I heart TweenLite!

+1

17

Glad to hear that cleared things up.

For the record, if you want your new tween to overwrite ALL existing tweens of the same object (regardless of whether or not they have any overlapping properties), you can simply set overwrite:true like:

TweenMax.to(mc, 1, {rotationX:myRotation, overwrite:true});

There are a bunch of other options for managing how things overwrite - see http://www.greensock.com/overwritemanager/

And of course you can kill all the tweens of a particular object with TweenLite.killTweensOf(myObject);

Happy tweening!