loadTexture Error: Cannot read property 'cache' of null

Phaser 2 / CE
1

Hi there! I really need your help, I spent all day on the code.

I have group with sprite inside. At some step, the sprites are added to the array.
Next I need to change the image of only the last sprite in the array.
I do it like this:

var special = selectedGems.pop();
special.loadTexture('bomb');

Of course, before that, I upload assets:

Level.prototype.preload = function () {
	this.load.pack('gem', 'assets/assets.json');
	this.load.pack('special_gem', 'assets/assets.json');
	game = this;
};

I have an Error:

phaser.js:47498 Uncaught TypeError: Cannot read property 'cache' of null

I would be grateful for any help!

2

Remove

game = this;
1 Like
3

@samme Thx for your answer!
But how can i get access to ā€œgameā€ in another context?

4 
this.game
2 Likes
5

@Ivopc Will this work in my own function?

UPD: Ok, in my own function next code doesnt work, when i remove game = this from preload:

gems = this.game.add.group();

Cannot read property 'add' of undefined

6 
var game;

Level.prototype.preload = function () {
	// ā€¦
	game = this.game;
};
7

@samme I change preload function, but the same error:

Cannot read property 'cache' of null
8

Please post the whole script.

10

@samme He is too big :slight_smile:
Here are the main parts where the problem code is used.

Summary 
Level.prototype.preload = function () {
this.load.pack(ā€˜gemā€™, ā€˜assets/assets.jsonā€™);
this.load.pack(ā€˜special_gemā€™, ā€˜assets/assets.jsonā€™);
game = this.game;
};

// ā€¦

function fillBoard() {
gems = game.add.group();
gems.inputEnableChildren = true;
for (var i = 0; i < BOARD_COLS; i++)
    {
        for (var j = 0; j < BOARD_ROWS - 1; j++)
        {
        	var sprite = ['gem1', 'gem2', 'gem3', 'gem4', 'gem5'];
        	var gem = gems.create(i * GEM_SIZE_SPACED, 0 * GEM_SIZE_SPACED, game.rnd.pick(sprite));    
        	gem.scale.setTo(0.3320312661838153, 0.3320312661838153);
        	
        	game.add.tween(gem).to({x: i  * GEM_SIZE_SPACED, y: (BOARD_ROWS - j - 2) * GEM_SIZE_SPACED}, 600, Phaser.Easing.Linear.None, true);
        }        
    }
	
	gems.onChildInputDown.add(onDown, this);
	gems.onChildInputOver.add(onOver, this);
	gems.onChildInputUp.add(onUp, this);
}

// ...
function onOver(gem) {
	if (allowInput == true) {
		// ..
		else if (gem.key == selectedGem.key) {
			if ((Math.abs(selectedGem.position.x - gem.position.x) == GEM_SIZE_SPACED && Math.abs(selectedGem.position.y - gem.position.y) == 0)
					|| (Math.abs(selectedGem.position.y - gem.position.y) == GEM_SIZE_SPACED && Math.abs(selectedGem.position.x - gem.position.x) == 0) ||
					(Math.abs(selectedGem.position.y - gem.position.y) == GEM_SIZE_SPACED && Math.abs(selectedGem.position.x - gem.position.x) == GEM_SIZE_SPACED)) {
				gem.tint = 0x00ff00;				
				selectedGem = gem;
				selectedGems.push(selectedGem);
			}			
		}
	}
}

// ...
function onUp(gem) {
if (selectedGems.length >= 20) {
var special = selectedGems.pop();
special.loadTexture('/bomb.png'); // MY PROBLEM
}
selectedGems = [];	
}
11 
var special = selectedGems.pop();

console.assert(special.game);
console.assert(!special.destroyPhase);

console.log(special);
1 Like
12
Summary

chrome_2019-03-29_01-10-57

13

Just came here to say Phaser is the most frustrating thing ever. The fact nothing at all is cross reference-able makes it impossible to do anything. I swear I have jumped back and forth between versions and physics and absolutely nothing is compatible. Now I canā€™t even load a json file sprite that works perfectly fine in phaser 2 in phaser 3 without getting all these undefined errors. Where can I find accurate information to get my sprite to work as an animated json? I am making a platformer/sidescroller so ideally I want my game to be played on mobile and desktop. That means I will need a virtual controller as well as keyboard input. I can only seem to get one to work, not both simultaneously.