Loader can now load JSON files specifically (game.load.json) and they are parsed and stored in the Game.Cache. Retrieve with game.cache.getJSON(key) (phaserjs#329)

Also fixed UTF encoding on the animation file.

Author: photonstorm

README.md

@@ -122,6 +122,7 @@ New features:
 * fixedToCamera now works across all display objects. When enabled it will fix at its current x/y coordinate, but can be changed via cameraOffset.
 * fixedToCamrea now works for Groups as well :) You can fix a Group to the camera and it will influence its children.
 * Tilemap.createCollisionObjects will parse Tiled data for objectgroups and convert polyline instances into physics objects you can collide with in the world.
+* Loader can now load JSON files specifically (game.load.json) and they are parsed and stored in the Game.Cache. Retrieve with game.cache.getJSON(key).
 
 
 Updates:

examples/assets/sprites/seacreatures_json.json

@@ -49,6 +49,12 @@ Phaser.Cache = function (game) {
     */
     this._text = {};
 
+    /**
+    * @property {object} _text - Text key-value container.
+    * @private
+    */
+    this._json = {};
+
     /**
     * @property {object} _physics - Physics data key-value container.
     * @private
@@ -149,6 +155,12 @@ Phaser.Cache.BITMAPDATA = 9;
 */
 Phaser.Cache.BITMAPFONT = 10;
 
+/**
+* @constant
+* @type {number}
+*/
+Phaser.Cache.JSON = 11;
+
 Phaser.Cache.prototype = {
 
     /**
@@ -382,6 +394,20 @@ Phaser.Cache.prototype = {
 
     },
 
+    /**
+    * Add a new json object into the cache.
+    *
+    * @method Phaser.Cache#addJSON
+    * @param {string} key - Asset key for the text data. 
+    * @param {string} url - URL of this text data file.
+    * @param {object} data - Extra text data.
+    */
+    addJSON: function (key, url, data) {
+
+        this._json[key] = { url: url, data: data };
+
+    },
+
     /**
     * Add a new image.
     *
@@ -880,6 +906,26 @@ Phaser.Cache.prototype = {
 
     },
 
+    /**
+    * Get a JSON object by key from the cache.
+    *
+    * @method Phaser.Cache#getJSON
+    * @param {string} key - Asset key of the json object to retrieve from the Cache.
+    * @return {object} The JSON object.
+    */
+    getJSON: function (key) {
+
+        if (this._json[key])
+        {
+            return this._json[key].data;
+        }
+        else
+        {
+            console.warn('Phaser.Cache.getJSON: Invalid key: "' + key + '"');
+        }
+        
+    },
+
     /**
     * Get binary data by key.
     *
@@ -952,6 +998,10 @@ Phaser.Cache.prototype = {
             case Phaser.Cache.BITMAPFONT:
                 array = this._bitmapFont;
                 break;
+
+            case Phaser.Cache.JSON:
+                array = this._json;
+                break;
         }
 
         if (!array)
@@ -1013,6 +1063,16 @@ Phaser.Cache.prototype = {
         delete this._text[key];
     },
 
+    /**
+    * Removes a json object from the cache.
+    *
+    * @method Phaser.Cache#removeJSON
+    * @param {string} key - Key of the asset you want to remove.
+    */
+    removeJSON: function (key) {
+        delete this._json[key];
+    },
+
     /**
     * Removes a physics data file from the cache.
     *
@@ -1090,6 +1150,11 @@ Phaser.Cache.prototype = {
             delete this._text[item['key']];
         }
 
+        for (var item in this._json)
+        {
+            delete this._json[item['key']];
+        }
+
         for (var item in this._textures)
         {
             delete this._textures[item['key']];

src/loader/Cache.js

@@ -361,6 +361,32 @@ Phaser.Loader.prototype = {
 
     },
 
+    /**
+    * Add a json file to the Loader.
+    *
+    * @method Phaser.Loader#json
+    * @param {string} key - Unique asset key of the json file.
+    * @param {string} url - URL of the json file.
+    * @param {boolean} [overwrite=false] - If an unloaded file with a matching key already exists in the queue, this entry will overwrite it.
+    * @return {Phaser.Loader} This Loader instance.
+    */
+    json: function (key, url, overwrite) {
+
+        if (typeof overwrite === "undefined") { overwrite = false; }
+
+        if (overwrite)
+        {
+            this.replaceInFileList('json', key, url);
+        }
+        else
+        {
+            this.addToFileList('json', key, url);
+        }
+
+        return this;
+
+    },
+
     /**
     * Add a JavaScript file to the Loader. Once loaded the JavaScript file will be automatically turned into a script tag (and executed), so be careful what you load!
     *
@@ -885,6 +911,15 @@ Phaser.Loader.prototype = {
 
                 break;
 
+            case 'json':
+                this._xhr.open("GET", this.baseURL + file.url, true);
+                this._xhr.responseType = "text";
+                this._xhr.onload = function () {
+                    return _this.jsonLoadComplete(_this._fileIndex);
+                };
+                this._xhr.send();
+                break;
+
             case 'tilemap':
                 this._xhr.open("GET", this.baseURL + file.url, true);
                 this._xhr.responseType = "text";
@@ -1176,6 +1211,10 @@ Phaser.Loader.prototype = {
         {
             this.game.cache.addTilemap(file.key, file.url, data, file.format);
         }
+        else if (file.type === 'json')
+        {
+            this.game.cache.addJSON(file.key, file.url, data);
+        }
         else
         {
             this.game.cache.addTextureAtlas(file.key, file.url, file.data, data, file.format);

src/loader/Loader.js

@@ -29,7 +29,7 @@ <h3>Sublime Text</h3>
 
         <h3>WebStorm</h3>
 
-        <p>JetBrains WebStorm is an extremely advanced fully development environment. It goes well beyond simple code editing and offers all of the high-level features you'd expect from a proper IDE include code-insight, npm built-in, code style/syntax reports, source control and a wealth of other features designed more for web developers than game developers. It's based on IntelliJ IDEA, which is both a good and bad thing. For a start the actual code editing experience is nothing like as smooth and freeform as with Sublime, but the power features can often make up for that. Having errors with your code spotted for you, before you've even tested your game can be really useful. And code-completion is great too, although obviously somewhat limited by the myriad ways JavaScript can be written.</p>
+        <p>JetBrains WebStorm is an extremely advanced fully development environment. It goes well beyond simple code editing and offers all of the high-level features you'd expect from a proper IDE include code-insight, npm built-in, code style/syntax reports, source control and a wealth of other features designed more for web developers than game developers. It's based on IntelliJ IDEA, a heavily Java based editor, which is both a good and bad thing. For a start the actual code editing experience is nothing like as smooth and freeform as with Sublime and OS integration is weak, but the power features can often make up for that. Having errors with your code spotted for you, before you've even tested your game can be really useful. And code-completion is great too, although obviously somewhat limited by the myriad ways JavaScript can be written.</p>
 
         <p>The full version starts from $49 and is available for Windows and OS X. There are often deals to be found on the JetBrains site too.</p>