Added generateFrameNames method and reduced in size.

Fixed Pad bug.
Fixed Animation framerate delta speed.

Author: photonstorm

v3/src/animation/AnimationManager.js

@@ -6,6 +6,7 @@
 
 var Animation = require('./frame/Animation');
 var Map = require('../structs/Map');
+var Pad = require('../utils/string/Pad');
 
 /**
 * Animations are managed by the global AnimationManager. This is a singleton class that is
@@ -95,16 +96,56 @@ AnimationManager.prototype = {
         return child;
     },
 
-    buildSpriteSheetFrames: function (key, startFrame, endFrame)
+    generateFrameNumbers: function (key, startFrame, endFrame, firstFrame)
     {
         var out = [];
 
+        if (firstFrame)
+        {
+            out.push({ key: key, frame: firstFrame });
+        }
+
         for (var i = startFrame; i <= endFrame; i++)
         {
             out.push({ key: key, frame: i });
         }
 
         return out;
+    },
+
+    /**
+    * Really handy function for when you are creating arrays of animation data but it's using frame names and not numbers.
+    * For example imagine you've got 30 frames named: 'explosion_0001-large' to 'explosion_0030-large'
+    * You could use this function to generate those by doing: Phaser.Animation.generateFrameNames('explosion_', 1, 30, '-large', 4);
+    *
+    * @method Phaser.Animation.generateFrameNames
+    * @static
+    * @param {string} prefix - The start of the filename. If the filename was 'explosion_0001-large' the prefix would be 'explosion_'.
+    * @param {number} start - The number to start sequentially counting from. If your frames are named 'explosion_0001' to 'explosion_0034' the start is 1.
+    * @param {number} stop - The number to count to. If your frames are named 'explosion_0001' to 'explosion_0034' the stop value is 34.
+    * @param {string} [suffix=''] - The end of the filename. If the filename was 'explosion_0001-large' the prefix would be '-large'.
+    * @param {number} [zeroPad=0] - The number of zeros to pad the min and max values with. If your frames are named 'explosion_0001' to 'explosion_0034' then the zeroPad is 4.
+    * @return {string[]} An array of framenames.
+    */
+    generateFrameNames: function (key, prefix, start, stop, suffix, zeroPad)
+    {
+        if (suffix === undefined) { suffix = ''; }
+        if (zeroPad === undefined) { zeroPad = 0; }
+
+        var output = [];
+        var diff = (start < stop) ? 1 : -1;
+
+        //  Adjust because we use i !== stop in the for loop
+        stop += diff;
+
+        for (var i = start; i !== stop; i += diff)
+        {
+            var frame = prefix + Pad(i, zeroPad, '0', 1) + suffix;
+
+            output.push({ key: key, frame: frame });
+        }
+
+        return output;
     }
 
 };

v3/src/animation/frame/Animation.js

@@ -82,11 +82,18 @@ Animation.prototype = {
         return (index < this.frames.length);
     },
 
+    getFirstTick: function (component)
+    {
+        //  When is the first update due?
+        component.accumulator = 0;
+        component.nextTick = this.msPerFrame + component.currentFrame.duration + (this.delay * 1000);
+    },
+
     getNextTick: function (component)
     {
         //  When is the next update due?
         component.accumulator -= component.nextTick;
-        component.nextTick = (this.msPerFrame + component.currentFrame.duration) * component.timescale;
+        component.nextTick = this.msPerFrame + component.currentFrame.duration;
     },
 
     nextFrame: function (component)
@@ -95,13 +102,7 @@ Animation.prototype = {
 
         //  TODO: Add frame skip support
 
-        if (!frame.isLast)
-        {
-            component.updateFrame(frame.nextFrame);
-
-            this.getNextTick(component);
-        }
-        else
+        if (frame.isLast)
         {
             //  We're at the end of the animation
 
@@ -110,7 +111,7 @@ Animation.prototype = {
             {
                 component.forward = false;
 
-                //  Delay for the current frame?
+                //  Delay for the current frame
                 this.getNextTick(component);
             }
             else if (component.repeatCounter > 0)
@@ -124,29 +125,11 @@ Animation.prototype = {
                 component.stop();
             }
         }
-    },
-
-    repeatAnimation: function (component)
-    {
-        if (this.repeatDelay > 0 && component.pendingRepeat === false)
-        {
-            component.pendingRepeat = true;
-            component.accumulator -= component.nextTick;
-            component.nextTick += (this.repeatDelay * 1000) * component.timescale;
-        }
         else
         {
-            component.repeatCounter--;
-
-            component.forward = true;
-
-            component.updateFrame(component.currentFrame.nextFrame);
+            component.updateFrame(frame.nextFrame);
 
             this.getNextTick(component);
-
-            component.pendingRepeat = false;
-    
-            //  OnRepeat
         }
     },
 
@@ -156,13 +139,7 @@ Animation.prototype = {
 
         //  TODO: Add frame skip support
 
-        if (!frame.isFirst)
-        {
-            component.updateFrame(frame.prevFrame);
-
-            this.getNextTick(component);
-        }
-        else
+        if (frame.isFirst)
         {
             //  We're at the start of the animation
 
@@ -177,6 +154,36 @@ Animation.prototype = {
                 component.stop();
             }
         }
+        else
+        {
+            component.updateFrame(frame.prevFrame);
+
+            this.getNextTick(component);
+        }
+    },
+
+    repeatAnimation: function (component)
+    {
+        if (this.repeatDelay > 0 && component.pendingRepeat === false)
+        {
+            component.pendingRepeat = true;
+            component.accumulator -= component.nextTick;
+            component.nextTick += (this.repeatDelay * 1000);
+        }
+        else
+        {
+            component.repeatCounter--;
+
+            component.forward = true;
+
+            component.updateFrame(component.currentFrame.nextFrame);
+
+            this.getNextTick(component);
+
+            component.pendingRepeat = false;
+    
+            //  OnRepeat
+        }
     },
 
     setFrame: function (component)

v3/src/checksum.js

@@ -1,4 +1,4 @@
 var CHECKSUM = {
-build: '78a4a0d0-19a6-11e7-94be-9b4d3e4cd847'
+build: '1c28cf90-19ae-11e7-ada8-a93dd71560f8'
 };
 module.exports = CHECKSUM;

v3/src/components/Animation.js

@@ -29,6 +29,7 @@ var Animation = function (parent)
 
     this.accumulator = 0;
 
+    this.prevTick = 0;
     this.nextTick = 0;
 
     this.repeatCounter = 0;
@@ -66,34 +67,43 @@ Animation.prototype = {
         this.animationManager.load(this, key, startFrame);
     },
 
+    delayedPlay: function (delay, key, startFrame)
+    {
+        this.play(key, startFrame);
+
+        this.nextTick += (delay * 1000);
+
+        return this.parent;
+    },
+
     play: function (key, startFrame)
     {
         if (startFrame === undefined) { startFrame = 0; }
 
         this.load(key, startFrame);
 
-        //  Move to reset?
-        this.accumulator = 0;
-        this.nextTick = 0;
-
         //  Should give us 9,007,199,254,740,991 safe repeats
         this.repeatCounter = (this.currentAnim.repeat === -1) ? Number.MAX_SAFE_INTEGER : this.currentAnim.repeat;
 
-        this.currentAnim.getNextTick(this);
+        this.currentAnim.getFirstTick(this);
 
         this.forward = true;
         this.isPlaying = true;
         this.pendingRepeat = false;
+
+        return this.parent;
     },
 
     //  Example data:
     //  timestamp = 2356.534000020474
-    //  frameDelta = 17.632333353807383 (diff since last timestamp)
-    update: function (timestamp, frameDelta)
+    //  frameDelta = 17.632333353807383 (diff since last timestamp?)
+    update: function (timestamp)
     {
         if (this.isPlaying)
         {
-            this.accumulator += frameDelta;
+            this.accumulator += (timestamp - this.prevTick) * this.timescale;
+
+            this.prevTick = timestamp;
 
             if (this.accumulator >= this.nextTick)
             {
@@ -107,6 +117,8 @@ Animation.prototype = {
         this.isPlaying = false;
 
         console.log('Animation Stopped');
+
+        return this.parent;
     }
 
 };

v3/src/utils/string/Pad.js

@@ -27,9 +27,9 @@
 */
 var Pad = function (str, len, pad, dir)
 {
-    if (len === undefined) { var len = 0; }
-    if (pad === undefined) { var pad = ' '; }
-    if (dir === undefined) { var dir = 3; }
+    if (len === undefined) { len = 0; }
+    if (pad === undefined) { pad = ' '; }
+    if (dir === undefined) { dir = 3; }
 
     str = str.toString();
 
@@ -46,7 +46,7 @@ var Pad = function (str, len, pad, dir)
             case 3:
                 var right = Math.ceil((padlen = len - str.length) / 2);
                 var left = padlen - right;
-                str = new Array(left+1).join(pad) + str + new Array(right+1).join(pad);
+                str = new Array(left + 1).join(pad) + str + new Array(right + 1).join(pad);
                 break;
 
             default:
@@ -56,7 +56,6 @@ var Pad = function (str, len, pad, dir)
     }
 
     return str;
-
 };
 
 module.exports = Pad;