First, I want to thank you for all of the classes. Great stuff.
Second, I've been struggling for days with this animation. Perhaps I don't quite understand how invalidate or overwrite work. Here's what I'm trying to accomplish. Basically, the following code builds out three clickable graphics in a timeline. When any graphic is clicked, the first timeline reverses and loads a new timeline, which shows a definition graphic and a reset button. When the reset button is clicked, the latter timeline is reversed and calls back the first timeline - all of that works great. The problem arises when the user clicks a different graphic than the first time around - instead of showing the corresponding definition graphic on a click, the original definition graphic the user chose plays first, followed by the correct definition graphic and reset button. If the user continues to choose different graphics, things pile up and get really messy.
What I want to happen is to have the second timeline overwritten each time the user makes a new choice. Make sense? For the life of me, I can't understand why invalidate() is not simply clearing all values so that the second timeline is created from scratch each time. Any ideas/help would be appreciated.
import com.greensock.*;
import com.greensock.easing.*;
import flash.events.MouseEvent;
OverwriteManager.init(OverwriteManager.AUTO);
var flavorexplained:TimelineMax = new TimelineMax({paused: true, overwrite: true, onReverseComplete:funcTest});
function funcTest():void {
flavorexplained.invalidate();
timeline.restart();
}
var timeline:TimelineMax = new TimelineMax({overwrite: true, onReverseComplete:flavorexplained.play});
timeline.append(TweenMax.to(question, .7, {x:7.5, y:147}));
timeline.append(TweenMax.to(chocolate, .4, {x:204.95, y:157, delay: .25, ease:Back.easeInOut}));
timeline.append(TweenMax.to(vanilla, .4, {x:312.95, y:156.5, ease:Back.easeInOut}));
timeline.append(TweenMax.to(strawberry, .4, {x:256.95, y:160, ease:Back.easeInOut}));
chocolate.addEventListener(MouseEvent.CLICK, clickHandler);
strawberry.addEventListener(MouseEvent.CLICK, clickHandler2);
vanilla.addEventListener(MouseEvent.CLICK, clickHandler3);
function clickHandler(event:MouseEvent):void {
timeline.reverse();
var flavorX:TweenMax = ( TweenMax.to(noway, .7, {x:275, y:200, ease:Back.easeInOut, overwrite:true}) );
flavorexplained.append(flavorX);
flavorexplained.append(TweenMax.to(resetbutton, .7, {x:512, y:228, ease:Back.easeInOut}));
}
function clickHandler2(event:MouseEvent):void {
timeline.reverse();
var flavorX:TweenMax = ( TweenMax.to(strawexplained, .7, {x:275, y:200, ease:Back.easeInOut, overwrite:true}) );
flavorexplained.append(flavorX);
flavorexplained.append(TweenMax.to(resetbutton, .7, {x:512, y:228, ease:Back.easeInOut}));
}
function clickHandler3(event:MouseEvent):void {
timeline.reverse();
var flavorX:TweenMax = ( TweenMax.to(vanillaexplained, .7, {x:275, y:200, ease:Back.easeInOut, overwrite:true}) );
flavorexplained.append(flavorX);
flavorexplained.append(TweenMax.to(resetbutton, .7, {x:512, y:228, ease:Back.easeInOut}));
}
resetbutton.addEventListener(MouseEvent.CLICK, clickHandlerA);
function clickHandlerA(event:MouseEvent):void {
flavorexplained.reverse();
}
