JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/phaser/2.4.4/phaser.min.js"></script>
<div id="game-div"> </div>
JavaScript
var game = new Phaser.Game(200, 200, Phaser.AUTO, 'game-div');
var gameState = {};
gameState.main = function() {};
gameState.main.prototype = {
preload: function() {
game.load.json('j', 'https://dl.dropboxusercontent.com/u/177054/test.json');
},
create: function() {
var a = game.add.text(0, 0, 'first button', {fill: 'white'});
var b = game.add.text(0, 100, 'second button', {fill: 'white'});
a.inputEnabled = true;
a.events.onInputDown.add(function() {
console.log('');
console.log('-- FIRST BUTTON --');
var q = game.cache.getJSON('j', true);
console.log('q[0].i should be 0: ' + q[0].i);
q[0].i = 1;
console.log('q[0].i is changed and should be 1: ' + q[0].i);
q = game.cache.getJSON('j', true);
console.log('I am reloading JSON and q[0].i should be 0 even though I have changed it before loading the second time');
console.log('also notice the format of the object and additional functions and compare it later to second button');
console.log(q);
console.log('now click the second button');
}, this);
b.inputEnabled = true;
b.events.onInputDown.add(function() {
console.log('');
console.log('-- SECOND BUTTON --');
var q = game.cache.getJSON('j');
console.log('q[0].i should be 0: ' + q[0].i);
q[0].i = 1;
console.log('q[0].i is changed and should be 1: ' + q[0].i);
q = game.cache.getJSON('j');
console.log('I am reloading the JSON and I would expect q[0].i to be 0');
console.log('but since the getJSON(key) returns a reference and when I have changed it, it changes in the cache too, so q[0].i here is 1');
console.log(q);
console.log('');
console.log('if you now click the first button again, you will notice that q[0].i is 1 because the second button changed it in the cache');
...