sorciereus Posted March 31, 2014 Share Posted March 31, 2014 Hi there. This is a straight forward question. What is the best technique for coding a replay button in Greensock AS3? Would TimelineMax be best? Could I see an example? Thanks in advance for any assistance. Link to comment Share on other sites More sharing options...
Carl Posted March 31, 2014 Share Posted March 31, 2014 Hi, Do you have particular assets you are trying to animate a particular way? Are you simply trying to restart() a TimelineLite or TimelineMax? if so this code should work myTimeline.restart() It would be best if you could provide an fla or some links to illustrate exactly what you need help with. Link to comment Share on other sites More sharing options...
sorciereus Posted March 31, 2014 Author Share Posted March 31, 2014 Hi, Do you have particular assets you are trying to animate a particular way? Are you simply trying to restart() a TimelineLite or TimelineMax? if so this code should work myTimeline.restart() It would be best if you could provide an fla or some links to illustrate exactly what you need help with. Hi - so I don't have a fla file right now - but all I'm trying to create is "replay" button that would simply replay a series of tweenlite animations. Could be nested with timelinelite or timelinemax, whichever is better. Does that makes sense? Link to comment Share on other sites More sharing options...
jamiejefferson Posted April 1, 2014 Share Posted April 1, 2014 It's hard to say what the 'best' way is, it's just adding event listeners to a button... just do it which ever way makes sense to you. replaybutton.addEventListener(MouseEvent.MOUSE_UP, myTimeline.restart, false, 0, true); pausebutton.addEventListener(MouseEvent.MOUSE_UP, myTimeline.pause, false, 0, true); // etc... stage.addEventListener(MouseEvent.MOUSE_UP, stageclicked, false, 0, true); function stageclicked(e) { if (e.target == replaybutton) { myTimeline.restart(); } else if (e.target == pausebutton) { myTimeline.pause(); } } 1 Link to comment Share on other sites More sharing options...
sorciereus Posted April 1, 2014 Author Share Posted April 1, 2014 Ok thank you I get it now - thanks! Link to comment Share on other sites More sharing options...
mkg14 Posted August 26, 2014 Share Posted August 26, 2014 Hi Carl, I have the same question about adding a replay button, but I don't understand how to apply the sample code that you've given. The complete code for my animation is below. There is only one frame in the timeline with all of the animation being controlled by AS. I'm a beginner when it comes to AS3, so please excuse my clunky code as I'm sure there's a more streamlined way to write it //imports import flash.external.ExternalInterface; import flash.net.URLRequest; import flash.net.navigateToURL; import com.greensock.TweenLite; import com.greensock.loading.ImageLoader; import com.greensock.easing.Linear; //clicktag for invisible button function getBrowserName():String { var browser:String; //Uses external interface to reach out to browser and grab browser useragent info. var browserAgent:String = ExternalInterface.call("function getBrowser(){return navigator.userAgent;}"); //Determines brand of browser using a find index. If not found indexOf returns (-1). if(browserAgent != null && browserAgent.indexOf("Firefox")>= 0) { browser = "Firefox"; } else if(browserAgent != null && browserAgent.indexOf("Safari")>= 0){ browser = "Safari"; } else if(browserAgent != null && browserAgent.indexOf("MSIE")>= 0){ browser = "IE"; } else if(browserAgent != null && browserAgent.indexOf("Opera")>= 0){ browser = "Opera"; } else { browser = "Undefined"; } return (browser); } function openWindow(url:String, target:String = '_blank', features:String=""):void { var WINDOW_OPEN_FUNCTION:String = "window.open"; var myURL:URLRequest = new URLRequest(url); var browserName:String = getBrowserName(); switch (browserName) { //If browser is Firefox, use ExternalInterface to call out to browser //and launch window via browser's window.open method. case "Firefox": ExternalInterface.call(WINDOW_OPEN_FUNCTION, url, target, features); break; //If IE, case "IE": ExternalInterface.call("function setWMWindow() {window.open('" + url + "', '"+target+"', '"+features+"');}"); break; // If Safari or Opera or any other case "Safari": navigateToURL(myURL, target); break; case "Opera": navigateToURL(myURL, target); break; default: navigateToURL(myURL, target); break; } } function clickedb(e:MouseEvent):void { //function for SIPC var sURL: String; if ((sURL = root.loaderInfo.parameters.clickTag)) { openWindow(sURL); } //navigateToURL(new URLRequest("#"), "_blank"); } thisBTN.addEventListener(MouseEvent.CLICK, clickedb); //objects on stage imageMC.alpha = 1; replayBtn.alpha = 0; ccLogo.alpha = 1; giftsTF.alpha = 0; tableTF.alpha = 0; bedroomTF.alpha = 0; bathTF.alpha = 0; everywhereTF.alpha = 0; finalLockup.alpha = 0; //begin animation: image begins panning from right to left while logo fades out and gifts type fades in TweenLite.to(imageMC, 13, {x:-1500, delay:1.5, ease:Linear.easeNone} ); TweenLite.to(ccLogo, .5, {alpha:0, delay:2.5} ); TweenLite.to(giftsTF, .5, {alpha:1, delay:2.8} ); TweenLite.delayedCall(5.25, tweenGiftsOut); //gift type fades out and table type fades in function tweenGiftsOut() { TweenLite.to(giftsTF, .5, {alpha:0} ); TweenLite.to(tableTF, .5, {alpha:1, delay:0.5} ); TweenLite.delayedCall(3, tweenTableOut); } //table type fades out and bedroom type fades in function tweenTableOut() { TweenLite.to(tableTF, .5, {alpha:0} ); TweenLite.to(bedroomTF, .5, {alpha:1} ); TweenLite.delayedCall(2, tweenBedroomOut); } //bedroom type fades out and bath type fades in function tweenBedroomOut() { TweenLite.to(bedroomTF, .5, {alpha:0} ); TweenLite.to(bathTF, .5, {alpha:1} ); TweenLite.delayedCall(2, tweenBathOut); } //bath type fades out and everywhere type fades in function tweenBathOut() { TweenLite.to(bathTF, .5, {alpha:0} ); TweenLite.to(everywhereTF, .5, {alpha:1} ); TweenLite.delayedCall(2, tweenEverywhereOut); } //everywhere type fades out and final call to action lockup and replay button fade in function tweenEverywhereOut() { TweenLite.to(everywhereTF, .5, {alpha:0} ); TweenLite.to(finalLockup, .5, {alpha:1} ); TweenLite.to(replayBtn, .5, {alpha:1} ); } //need to add the coding for a replay button (replayBtn) here, but not sure how to do it Link to comment Share on other sites More sharing options...
Carl Posted August 26, 2014 Share Posted August 26, 2014 Hi mkg14, You are not using a TimelineLite instance so it is not going to be so easy to just call restart() as shown in the original post from 4 months ago. Since you are chaining a series of functions together you are going to have to find a way to reset all the objects that were tweened back to their pre-tweened states. Since you are only tweening the alpha, this shouldn't be too bad. It seems like you already have some code in there that will handle this. You just need to wrap it in a function. In addition you have a handful of loose tweens that fire when the animation first runs.. these should also be in a function so that you can run them again. //create a function that does EVERYTHING necessary when the animation FIRST runs AND is played again //The code in this function should ONLY live in this function function reset() { //objects on stage imageMC.alpha = 1; replayBtn.alpha = 0; ccLogo.alpha = 1; giftsTF.alpha = 0; tableTF.alpha = 0; bedroomTF.alpha = 0; bathTF.alpha = 0; everywhereTF.alpha = 0; finalLockup.alpha = 0; //objects on stage imageMC.alpha = 1; replayBtn.alpha = 0; ccLogo.alpha = 1; giftsTF.alpha = 0; tableTF.alpha = 0; bedroomTF.alpha = 0; bathTF.alpha = 0; everywhereTF.alpha = 0; finalLockup.alpha = 0; //begin animation: image begins panning from right to left while logo fades out and gifts type fades in TweenLite.to(imageMC, 13, {x:-1500, delay:1.5, ease:Linear.easeNone} ); TweenLite.to(ccLogo, .5, {alpha:0, delay:2.5} ); TweenLite.to(giftsTF, .5, {alpha:1, delay:2.8} ); TweenLite.delayedCall(5.25, tweenGiftsOut); } reset(); replay_btn.addEventListener(MouseEvent.CLICK, replay) function replay(e:MouseEvent):void { reset() } If you need more help, please attach a zip of a simplified fla that only has code needed to replicate the issue. There is only so much we can do with large chunks of code in a post. Much easier to work with code we can test, edit and return to you in working form. One last note, In the future please create a new post instead of adding to a resolved issue from many months ago. Thanks and Happy Tweening. Link to comment Share on other sites More sharing options...
mkg14 Posted August 26, 2014 Share Posted August 26, 2014 I'm really sorry about that!!! I'll stick to those guidelines in the future. Thank you for your help. That worked and I only had to make one addition: Everything but the panning image reset, so I had to add the following line of code under the note "//objects on stage" in order to reset the image back to its starting position: imageMC.x = 0; The animation works perfectly now. Thanks again! Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now