Halcyon

Follow up question: is there an easier way to kill a delayedCall to an anonymous function? Most of my setTimeouts wrap anonymous functions and it will be a pain to name every block of anonymous code. I was thinking this would work, but it does not: var time1 = 0; TweenMax.killDelayedCallsTo(time1); time1 = TweenMax.delayedCall(1, function(){ console.log('Job is done.'); }); Instead you have to initialize it as a TweenMax instance which is kind of a pain. var time1 = new TimelineMax(); time1.kill(); time1 = TweenMax.delayedCall(1, function(){ console.log('Job is done.'); }); Is there an easier way, or is this pretty much what I would have to do? In any case it works great. I just don't want to do it the hard way if there's an easier way. Thanks again!

Oh, my goodness! delayedCall is perfect! It's also much less typing than my initial solution, so that's even better! So all I would have to do is replace all of my setTimeouts and setIntervals with delayedCall and then simply execute: TweenMax.pauseAll(); All without a game loop? This is amazing. I can't believe it's this easy. That third option seems more technical and perhaps not the right choice for my scenario, but I will look into it to learn more. I haven't used add or call much. Though I have used timelines to chain multiple animations together... like 2-4 animations in a row (monster attack animations) because it's much less code than using a ton of onCompletes or even delays. In fact I usually create a function to shorten the code needed: function TM(){ return new TimelineMax(); } And then I just do: var e = monster[3]; var tl = TM(); tl.to(e, .2, {left:'-=10', top:'+=15'}) .to(e, .2, {top:'+=20'}); .to(e, .2, {onStart:function(){ doDamage(); }, top:'-=35', left:'+=10'}); The long timeline stuff is perhaps better suited for long, linear animated sequences like introductions? I'm not sure it's the right choice for game animations unless you're making something like Braid where you can rewind the entire level.

It seems like you could replace all of your setTimeout and setIntervals in your code using something simple like: var foo=0; TweenMax.to(foo, 1, { onComplete:function(){ // do something } }); Of course you could use repeat:-1 and onRepeat to make this a setInterval, too. Note that I Tween a generic variable as opposed to a DOM element to avoid the cost of accessing the DOM. Now this comes with several benefits such as the ability to pause, resume, or even killing all timers with a one-line command (which is very useful for me). I made a DOM-based webgame that is entirely timer and event driven, meaning that it was designed without using any game loop at all. Upon discovering the ability to use something like TweenMax.pauseAll(), I realized it would actually be possible to pause all animations, and even timers, if I changed my setTimeouts to TweenMax timers instead. Implementing a pause feature in my game would be a pretty big deal. So is this a good idea? I also noticed that chained setTimeouts tend to lose their timing while TweenMax does not. For example I have button timers that indicate the number of seconds remaining until a skill button is ready to be used, and it updates the seconds remaining every second. In reality the setTimeout is actually running a little bit late depending on how busy the processor has been, but if I use TweenMax timers, it will always be very precise and every second is almost exactly one second of delay (notably, setInterval does not appear to suffer from this timing problem). I particularly noticed this when I developed analog clocks for my website at work and I noticed that all four clocks kept absolute perfect timing no matter how much was going on or how long the webpage was running. Very cool. Any thoughts or feedback on this? I have over 1000+ setTimeouts/setIntervals throughout 70,000+ lines of code so this would be a drastic re-work.