Pause pixi scene?

[CragVFX]

Hey All,

 

I am doing a simple 2d animation using pixi for a website... it's not interactive, it just uses the MovieClip feature and some simple rotation and position animations.

 

I want to know if there's a way to "pause" all animations. If the user scrolls past the the area of the website where the canvas is or if they click on another tab (single page app style) I want to pause the animation so that it's not impacting the site's performance.  I found that I can do a ticker.stop() to pause the MovieClip animation, but this does not stop the frame by frame animate() from running.

 

So, if I have some simple example like:

 

var renderer = PIXI.autoDetectRenderer(window.innerWidth, 500, {transparent: true});

this.$.container.appendChild(renderer.view);

var stage = new PIXI.Container();

var thing = new PIXI.Sprite.fromImage('/path/to/file.png');

stage.addChild(thing);

animate();

function animate() {

 thing.rotation = 0.1;

}

 

how do I pause the animation so that pixijs is not running and the canvas shows a still image of the non-animating 'thing'.

 

Thanks!

[xerver]

Stop calling renderer.render()