Testing out Frame and Animation clone features.

Author: photonstorm

src/animation/AnimationManager.js

@@ -115,6 +115,50 @@ Phaser.AnimationManager.prototype = {
         return true;
     },
 
+    /**
+    * Loads FrameData into the internal temporary vars and resets the frame index to zero.
+    * This is called automatically when a new Sprite is created.
+    *
+    * @method Phaser.AnimationManager#copyFrameData
+    * @private
+    * @param {Phaser.FrameData} frameData - The FrameData set to load.
+    * @param {string|number} frame - The frame to default to.
+    * @return {boolean} Returns `true` if the frame data was loaded successfully, otherwise `false`
+    */
+    copyFrameData: function (frameData, frame) {
+
+        this._frameData = frameData.clone();
+
+        if (this.isLoaded)
+        {
+            //   We need to update the frameData that the animations are using
+            for (var anim in this._anims)
+            {
+                this._anims[anim].updateFrameData(this._frameData);
+            }
+        }
+
+        if (typeof frame === 'undefined' || frame === null)
+        {
+            this.frame = 0;
+        }
+        else
+        {
+            if (typeof frame === 'string')
+            {
+                this.frameName = frame;
+            }
+            else
+            {
+                this.frame = frame;
+            }
+        }
+
+        this.isLoaded = true;
+
+        return true;
+    },
+
     /**
     * Adds a new animation under the given key. Optionally set the frames, frame rate and loop.
     * Animations added in this way are played back with the play function.

src/animation/Frame.js

@@ -165,6 +165,29 @@ Phaser.Frame.prototype = {
 
     },
 
+    /**
+     * Clones this Frame into a new Phaser.Frame object and returns it.
+     * Note that all properties are cloned, including the name, index and UUID.
+     *
+     * @method clone
+     * @return {Phaser.Frame} An exact copy of this Frame object.
+     */
+    clone: function () {
+
+        var output = new Phaser.Frame(this.index, this.x, this.y, this.width, this.height, this.name, this.uuid);
+
+        for (var prop in this)
+        {
+            if (this.hasOwnProperty(prop))
+            {
+                output[prop] = this[prop];
+            }
+        }
+
+        return output;
+
+    },
+
     /**
     * Returns a Rectangle set to the dimensions of this Frame.
     *

src/animation/FrameData.js

@@ -105,6 +105,31 @@ Phaser.FrameData.prototype = {
 
     },
 
+    /**
+     * Makes a copy of this FrameData including copies (not references) to all of the Frames it contains.
+     *
+     * @method clone
+     * @return {Phaser.FrameData} A clone of this object, including clones of the Frame objects it contains.
+     */
+    clone: function () {
+
+        var output = new Phaser.FrameData();
+
+        //  No input array, so we loop through all frames
+        for (var i = 0; i < this._frames.length; i++)
+        {
+            output._frames.push(this._frames[i].clone());
+        }
+
+        for (var i = 0; i < this._frameNames.length; i++)
+        {
+            output._frameNames.push(this._frameNames[i]);
+        }
+
+        return output;
+
+    },
+
     /**
     * Returns a range of frames based on the given start and end frame indexes and returns them in an Array.
     *

src/gameobjects/BitmapData.js

@@ -762,29 +762,32 @@ Phaser.BitmapData.prototype = {
     */
     blit: function (image, source, dest, alpha, transform, blendMode) {
 
+        var setAlpha = false;
+
         if (typeof image === 'string')
         {
             image = this.game.cache.getImage(image);
         }
 
-        if (typeof transform === 'undefined')
+        if (typeof alpha === 'number')
         {
-            var transform = { scaleX: 1, skewX: 0, skewY: 0, scaleY: 1, translateX: 0, translateY: 0 };
-        }
+            if (alpha <= 0)
+            {
+                //  No point doing anything if alpha is zero
+                return;
+            }
+            else if (alpha > 1)
+            {
+                //  Sanity cap
+                alpha = 1;
+            }
 
-        if (typeof alpha === 'undefined')
-        {
-            alpha = null;
-        }
-        else if (alpha <= 0)
-        {
-            //  No point doing anything if alpha is zero
-            return;
+            setAlpha = true;
         }
-        else if (alpha > 1)
+
+        if (typeof transform === 'undefined' || transform === null)
         {
-            //  Sanity cap
-            alpha = 1;
+            var transform = Phaser.BitmapData.getTransform();
         }
 
         if (typeof blendMode === 'undefined')
@@ -811,23 +814,30 @@ Phaser.BitmapData.prototype = {
             }
         }
 
-        if (alpha)
+        this.context.save();
+
+        if (setAlpha)
         {
             var prevAlpha = this.context.globalAlpha;
             this.context.globalAlpha = alpha;
         }
 
-        // this.context.globalCompositeOperation = blendMode;
+        var comp = this.context.globalCompositeOperation;
+        this.context.globalCompositeOperation = blendMode;
 
         this.context.setTransform(transform.scaleX, transform.skewX, transform.skewY, transform.scaleY, transform.translateX, transform.translateY);
 
         this.context.drawImage(src, sx + source.x, sy + source.y, source.width, source.height, dest.x, dest.y, dest.width, dest.height);
 
-        if (alpha)
+        this.context.restore();
+
+        if (setAlpha)
         {
             this.context.globalAlpha = prevAlpha;
         }
 
+        this.context.globalCompositeOperation = comp;
+
         this.dirty = true;
 
     },
@@ -1122,4 +1132,29 @@ Phaser.BitmapData.prototype = {
 
 };
 
+/**
+ * Gets a JavaScript object that has 6 properties set that are used by BitmapData in a transform.
+ *
+ * @method Phaser.BitmapData.getTransform
+ * @param {number} translateX - The x translate value.
+ * @param {number} translateY - The y translate value.
+ * @param {number} scaleX - The scale x value.
+ * @param {number} scaleY - The scale y value.
+ * @param {number} skewX - The skew x value.
+ * @param {number} skewY - The skew y value.
+ * @return {Object} A JavaScript object containing all of the properties BitmapData needs for transforms.
+ */
+Phaser.BitmapData.getTransform = function (translateX, translateY, scaleX, scaleY, skewX, skewY) {
+
+    if (typeof translateX !== 'number') { translateX = 0; }
+    if (typeof translateY !== 'number') { translateY = 0; }
+    if (typeof scaleX !== 'number') { scaleX = 1; }
+    if (typeof scaleY !== 'number') { scaleY = 1; }
+    if (typeof skewX !== 'number') { skewX = 0; }
+    if (typeof skewY !== 'number') { skewY = 0; }
+
+    return { sx: scaleX, sy: scaleY, scaleX: scaleX, scaleY: scaleY, skewX: skewX, skewY: skewY, translateX: translateX, translateY: translateY, tx: translateX, ty: translateY };
+
+};
+
 Phaser.BitmapData.prototype.constructor = Phaser.BitmapData;

src/gameobjects/Sprite.js

@@ -378,6 +378,7 @@ Phaser.Sprite.prototype.loadTexture = function (key, frame, stopAnimation) {
     }
     else if (key instanceof Phaser.BitmapData)
     {
+        //  This works from a reference, which probably isn't what we need here
         this.setTexture(key.texture);
     }
     else if (key instanceof PIXI.Texture)