Added a reverse functionality to animations.

Author: John Doe

src/animation/Animation.js

@@ -6,7 +6,7 @@
 
 /**
 * An Animation instance contains a single animation and the controls to play it.
-* 
+*
 * It is created by the AnimationManager, consists of Animation.Frame objects and belongs to a single Game Object such as a Sprite.
 *
 * @class Phaser.Animation
@@ -130,10 +130,10 @@ Phaser.Animation = function (game, parent, name, frameData, frames, frameRate, l
     this.onStart = new Phaser.Signal();
 
     /**
-    * This event is dispatched when the Animation changes frame. 
+    * This event is dispatched when the Animation changes frame.
     * By default this event is disabled due to its intensive nature. Enable it with: `Animation.enableUpdate = true`.
     * Note that the event is only dispatched with the current frame. In a low-FPS environment Animations
-    * will automatically frame-skip to try and claw back time, so do not base your code on expecting to 
+    * will automatically frame-skip to try and claw back time, so do not base your code on expecting to
     * receive a perfectly sequential set of frames from this event.
     * @property {Phaser.Signal|null} onUpdate
     * @default
@@ -150,6 +150,12 @@ Phaser.Animation = function (game, parent, name, frameData, frames, frameRate, l
     */
     this.onLoop = new Phaser.Signal();
 
+    /**
+     * @property {boolean} isReversed - Indicates if the animation will play backwards.
+     * @default
+     */
+    this.isReversed = false;
+
     //  Set-up some event listeners
     this.game.onPause.add(this.onPause, this);
     this.game.onResume.add(this.onResume, this);
@@ -385,14 +391,23 @@ Phaser.Animation.prototype = {
             //  And what's left now?
             this._timeNextFrame = this.game.time.time + (this.delay - this._frameDiff);
 
-            this._frameIndex += this._frameSkip;
+            if (this.isReversed){
+                this._frameIndex -= this._frameSkip;
+            }else{
+                this._frameIndex += this._frameSkip;
+            }
 
-            if (this._frameIndex >= this._frames.length)
+            if (!this.isReversed && this._frameIndex >= this._frames.length || this.isReversed && this._frameIndex <= 0)
             {
                 if (this.loop)
                 {
                     // Update current state before event callback
-                    this._frameIndex %= this._frames.length;
+                    this._frameIndex = Math.abs(this._frameIndex) % this._frames.length;
+
+                    if (this.isReversed){
+                        this._frameIndex = this._frames.length - 1 - this._frameIndex;
+                    }
+
                     this.currentFrame = this._frameData.getFrame(this._frames[this._frameIndex]);
 
                     //  Instead of calling updateCurrentFrame we do it here instead
@@ -454,7 +469,7 @@ Phaser.Animation.prototype = {
             // The animation is already destroyed, probably from a callback
             return false;
         }
-            
+
         //  Previous index
         var idx = this.currentFrame.index;
 
@@ -654,6 +669,26 @@ Object.defineProperty(Phaser.Animation.prototype, 'paused', {
 
 });
 
+/**
+* @name Phaser.Animation#reversed
+* @property {boolean} reversed - Gets and sets the isReversed state of this Animation.
+*/
+Object.defineProperty(Phaser.Animation.prototype, 'reversed', {
+
+    get: function () {
+
+        return this.isReversed;
+
+    },
+
+    set: function (value) {
+
+        this.isReversed = value;
+
+    }
+
+});
+
 /**
 * @name Phaser.Animation#frameTotal
 * @property {number} frameTotal - The total number of frames in the currently loaded FrameData, or -1 if no FrameData is loaded.

typescript/phaser.comments.d.ts

@@ -129,6 +129,11 @@ declare module Phaser {
         */
         isPlaying: boolean;
 
+        /**
+        * The playing direction of the Animation.
+        */
+        isReversed: boolean;
+
         /**
         * Should the parent of this Animation be killed when the animation completes?
         */
@@ -178,6 +183,11 @@ declare module Phaser {
         */
         paused: boolean;
 
+        /**
+        * Gets and sets the reversed state of this Animation.
+        */
+        reversed: boolean;
+
         /**
         * Gets or sets the current speed of the animation in frames per second. Changing this in a playing animation will take effect from the next frame. Minimum value is 1.
         */

typescript/phaser.d.ts

@@ -81,6 +81,7 @@ declare module Phaser {
         onStart: Phaser.Signal;
         onUpdate: Phaser.Signal;
         paused: boolean;
+        reversed: boolean;
         speed: number;
 
         complete(): void;
@@ -3527,8 +3528,8 @@ declare module Phaser {
     }
 
     module Plugin {
-        
-        class SaveCPU extends Phaser.Plugin { 
+
+        class SaveCPU extends Phaser.Plugin {
 
             renderOnFPS: number;
             renderOnPointerChange: boolean;