7

I was wondering how could I stop an entire CreateJs canvas animation and how to restart it later. I'd like to save computing power and memory while the canvas is not visible for the user.

Does anybody know how?

Thank you in advance

Andrea Silvestri
  • 1,082
  • 4
  • 14
  • 41

2 Answers2

7

Simply remove the listener on Ticker. For example:

createjs.Ticker.removeEventListener("tick", myStageOrTickFunction);
// then add it back later to unpause:
createjs.Ticker.addEventListener("tick", myStageOrTickFunction);

If you want to reset an entire animation exported from Flash, you have a couple of options:

  1. You can re-instantiate the main timeline. You'll need to take a look at the output code to grab the name of the main timeline symbol, but it is generally based on the FLA name (ex. an FLA named "test.fla" will have its main timeline symbol named "Test").

stage.removeChildAt(0);

stage.addChild(new lib.Test());

  1. You can use gotoAndPlay(0). This requires that all child MovieClips are set as Graphic instances though, because MCs play independently of their parent.

stage.getChildAt(0).gotoAndPlay(0)

gskinner
  • 2,478
  • 11
  • 12
  • Thanks for your reply. I've already tried that path but unfortunately it does not rewind the animation before restarting it – Andrea Silvestri Jul 15 '15 at 08:12
  • Ah. Sorry, I didn't realize you also wanted to reset the animation. Doing that is very dependent on how you animation works. Is this just a straight output from Flash? – gskinner Jul 17 '15 at 20:54
  • Yes it is. By the way at the moment I'm using the exported HTML in an IFRAME. When I want to stop the animation I remove the tick event and when I want to start it over I remove the SRC attribute and then reattach it. – Andrea Silvestri Jul 20 '15 at 10:20
  • I see. I'll try that and let you know the outcome. Thank you! – Andrea Silvestri Jul 21 '15 at 07:43
1

You need to remove exportRoot from Stage then add it again 

function restart()
    {


        stage.getChildAt(0).gotoAndPlay(0);
        stage.removeChildAt(0);
        createjs.Ticker.removeEventListener("tick", stage);
        createjs.Sound.stop();

        exportRoot = new lib[Object.getOwnPropertyNames(lib)[Object.getOwnPropertyNames(lib).length-3]]();
        stage.addChild(exportRoot);

        createjs.Ticker.addEventListener("tick", stage);
        stage.update(); 

    }
Lanny
  • 11,244
  • 1
  • 22
  • 30
freeman3020
  • 23
  • 6