All core features of the new Texture classes are now done. Multi-atlas support, Sprite Sheets embedded in atlases, shared source references, shared frame data, and split parsers. Phew.

Author: photonstorm

build/config.php

@@ -125,7 +125,10 @@
 
     <script src="$path/src/textures/TextureManager.js"></script>
     <script src="$path/src/textures/Texture.js"></script>
+    <script src="$path/src/textures/TextureSource.js"></script>
     <script src="$path/src/textures/Frame.js"></script>
+    <script src="$path/src/textures/parsers/Image.js"></script>
+    <script src="$path/src/textures/parsers/Canvas.js"></script>
     <script src="$path/src/textures/parsers/JSONArray.js"></script>
     <script src="$path/src/textures/parsers/JSONHash.js"></script>
     <script src="$path/src/textures/parsers/SpriteSheet.js"></script>

src/textures/Frame.js

@@ -18,15 +18,17 @@
 * @param {number} width - Width of the frame within the Texture.
 * @param {number} height - Height of the frame within the Texture.
 */
-Phaser.TextureFrame = function (texture, name, x, y, width, height)
+Phaser.TextureFrame = function (texture, name, sourceIndex, x, y, width, height)
 {
 
     /**
     * @property {Phaser.Texture} texture - The Texture this frame belongs to.
     */
     this.texture = texture;
 
-    this.source = texture.source;
+    this.source = texture.source[sourceIndex];
+
+    this.sourceIndex = sourceIndex;
 
     /**
     * @property {string} name - The name of this frame within the Texture.

src/textures/Texture.js

@@ -20,103 +20,34 @@
 * @param {object} source
 * @param {number} scaleMode
 */
-Phaser.Texture = function (key, source, scaleMode)
+Phaser.Texture = function (manager, key, source)
 {
+    this.manager = manager;
+
+    if (!Array.isArray(source))
+    {
+        source = [ source ];
+    }
+
     this.key = key;
 
     /**
     * The source that is used to create the texture.
     * Usually an Image, but can also be a Canvas.
     *
     * @property source
-    * @type Image
-    */
-    this.source = source;
-
-    /**
-    * The Resolution of the texture.
-    *
-    * @property resolution
-    * @type Number
-    */
-    this.resolution = 1;
-    
-    /**
-    * The width of the Texture.
-    *
-    * @property width
-    * @type Number
-    * @readOnly
-    */
-    this.width = source.naturalWidth || source.width || 0;
-
-    /**
-    * The height of the Texture.
-    *
-    * @property height
-    * @type Number
-    * @readOnly
-    */
-    this.height = source.naturalHeight || source.height || 0;
-
-    /**
-    * The scale mode to apply when scaling this texture
-    * 
-    * @property scaleMode
-    * @type {Number}
-    * @default PIXI.scaleModes.LINEAR
-    */
-    this.scaleMode = scaleMode || PIXI.scaleModes.DEFAULT;
-
-    /**
-    * Controls if RGB channels should be pre-multiplied by Alpha  (WebGL only)
-    *
-    * @property premultipliedAlpha
-    * @type Boolean
-    * @default true
-    */
-    this.premultipliedAlpha = true;
-
-    /**
-    * Set this to true if a mipmap of this texture needs to be generated. This value needs to be set before the texture is used
-    * Also the texture must be a power of two size to work
-    * 
-    * @property mipmap
-    * @type {Boolean}
-    */
-    this.mipmap = false;
-
-    /**
-    * The multi texture batching index number.
-    * @property textureIndex
-    * @type Number
-    */
-    this.textureIndex = 0;
-
-    /**
-    * A BaseTexture can be set to skip the rendering phase in the WebGL Sprite Batch.
-    * 
-    * You may want to do this if you have a parent Sprite with no visible texture (i.e. uses the internal `__default` texture)
-    * that has children that you do want to render, without causing a batch flush in the process.
-    * 
-    * @property renderable
-    * @type Boolean
-    */
-    this.renderable = false;
-
-    /**
-    * @property isPowerOf2
-    * @type boolean
+    * @type array
     */
-    this.isPowerOf2 = Phaser.Math.isPowerOfTwo(this.width, this.height);
+    this.source = [];
 
     /**
     * @property {object} frames - Frames
     */
     this.frames = {
-        __BASE: new Phaser.TextureFrame(this, '__BASE', 0, 0, this.width, this.height)
     };
 
+    this.frameTotal = 0;
+
     /**
     * @property _dirty
     * @type Array
@@ -130,19 +61,27 @@ Phaser.Texture = function (key, source, scaleMode)
     * @private
     */
     this._glTextures = [];
+
+    //  Load the Sources
+    for (var i = 0; i < source.length; i++)
+    {
+        this.source.push(new Phaser.TextureSource(this, source[i]));
+    }
 
 };
 
 Phaser.Texture.prototype.constructor = Phaser.Texture;
 
 Phaser.Texture.prototype = {
 
-    add: function (name, x, y, width, height)
+    add: function (name, sourceIndex, x, y, width, height)
     {
-        var frame = new Phaser.TextureFrame(this, name, x, y, width, height);
+        var frame = new Phaser.TextureFrame(this, name, sourceIndex, x, y, width, height);
 
         this.frames[name] = frame;
 
+        this.frameTotal++;
+
         return frame;
     },
 
@@ -154,6 +93,20 @@ Phaser.Texture.prototype = {
 
     },
 
+    getSpriteSheet: function (key, frame, frameWidth, frameHeight, startFrame, endFrame, margin, spacing)
+    {
+        var sheet = this.get(frame);
+
+        if (sheet)
+        {
+            var texture = this.manager.create(key, sheet.source.image);
+
+            this.manager.parsers.SpriteSheet(texture, 0, sheet.cutX, sheet.cutY, sheet.cutWidth, sheet.cutHeight, frameWidth, frameHeight, startFrame, endFrame, margin, spacing);
+
+            return texture;
+        }
+    },
+
     /**
     * Sets all glTextures to be dirty.
     *

src/textures/TextureManager.js

@@ -24,40 +24,167 @@ Phaser.TextureManager = function (game)
         //  Empty by default
     };
 
+    this.parsers = {
+        Image: Phaser.TextureManager.Parsers.Image,
+        Canvas: Phaser.TextureManager.Parsers.Canvas,
+        JSONArray: Phaser.TextureManager.Parsers.JSONArray,
+        JSONHash: Phaser.TextureManager.Parsers.JSONHash,
+        StarlingXML: Phaser.TextureManager.Parsers.StarlingXML,
+        Pyxel: Phaser.TextureManager.Parsers.Pyxel,
+        SpriteSheet: Phaser.TextureManager.Parsers.SpriteSheet
+    };
 };
 
 Phaser.TextureManager.prototype.constructor = Phaser.TextureManager;
 
+Phaser.TextureManager.Parsers = {
+    //  Where the different parsers hook themselves
+};
+
 Phaser.TextureManager.prototype = {
 
-    create: function (key, source, scaleMode)
+    addImage: function (key, source)
     {
-        var texture = new Phaser.Texture(key, source, scaleMode);
+        var texture = this.create(key, source);
+        
+        this.parsers.Image(texture, 0);
 
-        this.list[key] = texture;
+        return texture;
+
+    },
+
+    addCanvas: function (key, source)
+    {
+        var texture = this.create(key, source);
+        
+        this.parsers.Canvas(texture, 0);
 
         return texture;
 
     },
 
-    get: function (key, frame)
+    addAtlasJSONArray: function (key, source, data)
     {
-        if (this.list[key])
+        var texture = this.create(key, source);
+
+        if (Array.isArray(data))
         {
-            if (frame)
+            for (var i = 0; i < data.length; i++)
             {
-                return this.list[key].get(frame);
+                this.parsers.JSONArray(texture, i, data[i]);
             }
-            else
+        }
+        else
+        {
+            this.parsers.JSONArray(texture, 0, data);
+        }
+
+        return texture;
+    },
+
+    addAtlasJSONHash: function (key, source, data)
+    {
+        var texture = this.create(key, source);
+
+        if (Array.isArray(data))
+        {
+            for (var i = 0; i < data.length; i++)
             {
-                return this.list[key];
+                this.parsers.JSONHash(texture, i, data[i]);
             }
         }
+        else
+        {
+            this.parsers.JSONHash(texture, 0, data);
+        }
 
-    }
+        return texture;
+    },
 
-};
+    addSpriteSheet: function (key, source, frameWidth, frameHeight, startFrame, endFrame, margin, spacing)
+    {
+        var texture = this.create(key, source);
 
-Phaser.TextureManager.Parsers = {
+        var width = texture.source[0].width;
+        var height = texture.source[0].height;
+
+        this.parsers.SpriteSheet(texture, 0, 0, 0, width, height, frameWidth, frameHeight, startFrame, endFrame, margin, spacing);
+
+        return texture;
+    },
+
+    /*
+    addAtlasStarlingXML: function (key, source, data)
+    {
+        var texture = this.create(key, source);
+
+        return Phaser.TextureManager.Parsers.StarlingXML(texture, data);
+    },
+
+    addAtlasPyxel: function (key, source, data)
+    {
+        var texture = this.create(key, source);
+
+        return Phaser.TextureManager.Parsers.Pyxel(texture, data);
+    },
+    */
+
+    create: function (key, source)
+    {
+        var texture = new Phaser.Texture(this, key, source);
+
+        this.list[key] = texture;
+
+        return texture;
+
+    },
+
+    exists: function (key)
+    {
+        return (this.list.hasOwnProperty(key));
+    },
+
+    get: function (key)
+    {
+        if (this.list[key])
+        {
+            return this.list[key];
+        }
+
+    },
+
+    getFrame: function (key, frame)
+    {
+        if (this.list[key])
+        {
+            return this.list[key].get(frame);
+        }
+
+    },
+
+    /**
+    * Passes all Textures to the given callback.
+    *
+    * @method each
+    * @param {function} callback - The function to call.
+    * @param {object} [thisArg] - Value to use as `this` when executing callback.
+    * @param {...*} [arguments] - Additional arguments that will be passed to the callback, after the child.
+    */
+    each: function (callback, thisArg)
+    {
+        var args = [ null ];
+
+        for (var i = 1; i < arguments.length; i++)
+        {
+            args.push(arguments[i]);
+        }
+
+        for (var texture in this.list)
+        {
+            args[0] = this.list[texture];
+
+            callback.apply(thisArg, args);
+        }
+    }
 
 };