Active animations now monitor if the game pauses, and resume normally when the game un-pauses (fixes phaserjs#179)

Author: photonstorm

README.md

@@ -150,6 +150,7 @@ Bug Fixes:
 * Updated Input.Mouse to use event.button not event.which, so the const reference from input.mouse.button is correct (thanks grimor)
 * Text that was fixedToCamera would 'jitter' if the world scrolled. Now works as expected across all fixed objects.
 * Fixed a bug where Sound.play wouldn't pick-up the local loop setting if not specified in the parameter.
+* Active animations now monitor if the game pauses, and resume normally when the game un-pauses (fixes #179)
 
 
 TO DO:

examples/wip/anim1.js

@@ -1,21 +1,36 @@
 
-var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create });
+var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
 
 function preload() {
 
     game.load.spritesheet('mummy', 'assets/sprites/metalslug_mummy37x45.png', 37, 45, 18);
 
 }
 
+var mummy;
+var anim;
+
 function create() {
 
-	// game.stage.backgroundColor = '#239923';
 	game.stage.backgroundColor = 0xff8855;
 
-    var mummy = game.add.sprite(300, 200, 'mummy', 5);
+    mummy = game.add.sprite(300, 200, 'mummy', 5);
+
+    mummy.animations.updateIfVisible = false;
 
-    mummy.animations.add('walk');
+    anim = mummy.animations.add('walk');
 
-    mummy.animations.play('walk', 20, true);
+    anim.play(2, false);
+    // anim.play(2, true);
 
 }
+
+function update() {
+
+}
+
+function render() {
+
+	game.debug.renderText(anim.frame + ' / 17', 32, 32);
+	
+}

src/animation/Animation.js

@@ -115,6 +115,10 @@ Phaser.Animation = function (game, parent, name, frameData, frames, delay, loope
     * @property {Phaser.Frame} currentFrame - The currently displayed frame of the Animation.
     */
     this.currentFrame = this._frameData.getFrame(this._frames[this._frameIndex]);
+
+    //  Set-up some event listeners
+    this.game.onPause.add(this.onPause, this);
+    this.game.onResume.add(this.onResume, this);
 
 };
 
@@ -162,6 +166,7 @@ Phaser.Animation.prototype = {
         this.currentFrame = this._frameData.getFrame(this._frames[this._frameIndex]);
         this._parent.setTexture(PIXI.TextureCache[this.currentFrame.uuid]);
 
+        //  TODO: Double check if required
         if (this._parent.__tilePattern)
         {
             this._parent.__tilePattern = false;
@@ -220,6 +225,36 @@ Phaser.Animation.prototype = {
 
     },
 
+    /**
+    * Called when the Game enters a paused state.
+    *
+    * @method Phaser.Animation#onPause
+    * @memberof Phaser.Animation
+    */
+    onPause: function () {
+
+        if (this.isPlaying)
+        {
+            this._frameDiff = this._timeNextFrame - this.game.time.now;
+        }
+
+    },
+
+    /**
+    * Called when the Game resumes from a paused state.
+    *
+    * @method Phaser.Animation#onResume
+    * @memberof Phaser.Animation
+    */
+    onResume: function () {
+
+        if (this.isPlaying)
+        {
+            this._timeNextFrame = this.game.time.now + this._frameDiff;
+        }
+
+    },
+
     /**
     * Updates this animation. Called automatically by the AnimationManager.
     *
@@ -318,6 +353,9 @@ Phaser.Animation.prototype = {
         this.currentFrame = null;
         this.isPlaying = false;
 
+        this.game.onPause.remove(this.onPause, this);
+        this.game.onResume.remove(this.onResume, this);
+
     },
 
     /**

src/animation/AnimationManager.js

@@ -251,7 +251,7 @@ Phaser.AnimationManager.prototype = {
     */
     update: function () {
 
-        if (this.updateIfVisible && this.sprite.visible === false)
+        if (this.updateIfVisible && !this.sprite.visible)
         {
             return false;
         }