Calculate Animation Duration

[TweenNewbie]

Hello all,

 

Sorry if this is a stupid question.....still new to all this. How do I calculate the total duration of my animation in seconds if I use the delay property? Do I just add the seconds I'm assigning to each line? Below is my code. Any help would be greatly appreciated! Thank you!

 

import com.greensock.*;

import com.greensock.easing.*;

 

mini_mc.alpha = 0;

amazonLogo_mc.alpha = 0;

copy1_mc.alpha = 0;

copy2_mc.alpha = 0;

copy3_mc.alpha = 0;

 

 

TweenMax.to(mini_mc, 2, {alpha:1});

TweenMax.to(artistName_mc, 1, {x:10.95});

TweenMax.to(title_mc, 2, {x:10.95});

 

TweenMax.to(line1_mc, 1, {x:49.25, delay:2});

TweenMax.to(copy1_mc, 1, {alpha:1, scaleX:0.45, scaleY:0.45, x:19.15, y:354.65, delay:2.5});

TweenMax.to(line2_mc, 1, {x:49.25, delay:3});

TweenMax.to(copy2_mc, 1, {alpha:1, scaleX:0.45, scaleY:0.45, x:33.1, y:434.3, delay:3.5});

TweenMax.to(line3_mc, 1, {x:49.25, delay:4});

TweenMax.to(copy3_mc, 1, {alpha:1, scaleX:0.53, scaleY:0.53, x:13, y:475.1, delay:4.5});

TweenMax.to(line4_mc, 1, {x:49.25, delay:5});

 

TweenMax.to(amazonLogo_mc, 2, {alpha:1, delay:5.5});

 

TweenMax.to(snow_1, 5, {y:650});

TweenMax.to(snow_2, 5, {y:650, delay:1});

TweenMax.to(snow_3, 5, {y:650, delay:2});

TweenMax.to(snow_4, 5, {y:650, delay:3});

TweenMax.to(snow_5, 5, {y:650, delay:4});

TweenMax.to(snow_6, 5, {y:650, delay:5});

 

myClickTag_btn.addEventListener(MouseEvent.MOUSE_UP, function(event: MouseEvent): void {

var sURL: String;

if ((sURL = root.loaderInfo.parameters.clickTag)) {

navigateToURL(new URLRequest(sURL), "_blank");

}

});

[GreenSock]

I assume you haven't looked at TimelineLite or TimelineMax yet, right? Those could make your life a lot easier and completely change your animation workflow (in a good way). I'd highly recommend experimenting with them (TimelineMax is identical to TimelineLite - it just has a few extra features like repeat, yoyo, repeatDelay, etc.). Think of them like a container for your tweens, where you can position them at certain times inside the timeline (they can overlap or not - it makes no difference). Then you can control the entire group as a whole by controlling the TimelineLite instance (play(), pause(), resume(), reverse(), timeScale(), etc.). And of course you can get the total duration of the whole timeline too.

 

In v12, we added convenience methods like to(), from(), staggerTo(), etc. that make the syntax even easier and more concise. Here is what your code could look like in a TimelineLite:

 

var tl:TimelineLite = new TimelineLite();
tl.to(mini_mc, 2, {alpha:1});
tl.to(artistName_mc, 1, {x:10.95}, 0, 0);
tl.to(title_mc, 2, {x:10.95}, 0, 0);

tl.to(line1_mc, 1, {x:49.25}, 2, 0);
tl.to(copy1_mc, 1, {alpha:1, scaleX:0.45, scaleY:0.45, x:19.15, y:354.65}, 2.5, 0);
tl.to(line2_mc, 1, {x:49.25}, 3, 0);
tl.to(copy2_mc, 1, {alpha:1, scaleX:0.45, scaleY:0.45, x:33.1, y:434.3}, 3.5, 0);
tl.to(line3_mc, 1, {x:49.25}, 4, 0);
tl.to(copy3_mc, 1, {alpha:1, scaleX:0.53, scaleY:0.53, x:13, y:475.1}, 4.5, 0);
tl.to(line4_mc, 1, {x:49.25}, 5, 0);

tl.to(amazonLogo_mc, 2, {alpha:1}, 5.5, 0);

tl.staggerTo([snow_1, snow_2, snow_3, snow_4, snow_5, snow_6], 5, {y:650}, 1, 0, 0);

 

Notice that there are an extra 2 parameters at the end of the to() calls. The first is the offset and the second is the baseTimeOrLabel. So, if those values are "0, 0", that means the tween will be offset 0 seconds from the time 0 (which is at the very beginning). By default, if you omit those parameters, to() calls will always append a tween to the timeline, placing it at the end which makes sequencing SUPER easy. But in your case, you seem to want precise control over where things start (they're not one-after-the-other; you have overlaps). That's why I used those offset and baseTimeOrLabel values.

 

Read the docs to learn more at http://api.greensock.com/as/com/greensock/TimelineLite.html

 

Get v12 at http://www.greensock.com/v12/

 

To get the duration of the whole group of tweens in the TimelineLite, you'd just get its duration like this:

 

var duration:Number = tl.duration();

 

If you don't want to use TimelineLite, that's okay - to answer your original question, to find out when the last tween will be finished you'd need to look at all your tweens and figure it out by adding the duration to the delay of each. The longest one wins But again, I really think TimelineLite will make a big difference in your workflow. It opens a whole world of possibilities once you figure out how it works. One of the niftiest things is that timelines can be nested inside of timelines as deeply as you want!

 

Have fun.