Property 'width'

[Thunderfist]

I can't figure this out. My game code keeps saying that it can't read the property 'width' of undefined. There's nothing my code declaring a property width.

Most of the locations are different lines in the phaser.js, but two of them are in the game.js: game.js lines 25, and 32.

Line 25 is this.loadLevel(); and line 32 is this.map = this.add.tilemap(this.currentLevel);

Here's the code:

/*global Phaser*/
var RPG = RPG || {};

RPG.GameState = {
    
    init: function (currentLevel) {
        //Needed to keep track of the level
        this.currentLevel = currentLevel || currentLevel === 'testroom1';
        
        //movement speed constants
        this.PLAYER_SPEED = 150;
        
        //no gravity in top down games
        this.game.physics.arcade.gravity.y = 0;
        
        //keyboard cursors for input
        this.cursors = this.game.input.keyboard.createCursorKeys();
    },
    preload: function () {
        //this.map.loadTilesetImage('terrain');
    },
    create: function () {
        this.game.onscreenControls = this.game.plugins.add(Phaser.Plugin.OnscreenControls);
        
        this.loadLevel();
    },
    update: function () {
        
    },
    loadLevel: function () {
        //create the tilemap object
        this.map = this.add.tilemap(this.currentLevel);
        
        //Join the tile images to the .json data
        this.map.addTilesetImage('terrains', 'terrain');
        
        //create tile layers
        this.backgroundLayer = this.map.createLayer('backgroundLayer');
        //this.collisionLayer = this.map.createLayer('collisionLayer');
        
        //set background to the back of screen
        this.game.world.sendToBack(this.backgroundLayer);
        
        //Collision Layer... if only I made it earlier
        //this.map.setCollisionBetween(1, 16, true, 'collisionLayer');
        
        //resize the world to fit the layer
        //this.collisionLayer.resizeWorld();
    },
    
    gameOver: function () {
        this.game.state.start('Game', true, false, this.currentLevel);
    }
};

What do I do to fix this issue? I only have a month until my project is due!

[PsichiX]

this is internal engine problem. please, share with us full stack trace of error (you can expand collapsed error in chrome/firefox), so we could trace its origin location and conditions that triggers it.

[Thunderfist]

I found this in the console. Is this overkill?

phaser.js:98872 Uncaught TypeError: Cannot read property 'width' of undefined
    at new Phaser.Tilemap (phaser.js:98872)
    at Phaser.GameObjectFactory.tilemap (phaser.js:48822)
    at Object.loadLevel (game.js:32)
    at Object.create (game.js:25)
    at Phaser.StateManager.loadComplete (phaser.js:29298)
    at Phaser.StateManager.preUpdate (phaser.js:29056)
    at Phaser.Game.updateLogic (phaser.js:36129)
    at Phaser.Game.update (phaser.js:36072)
    at Phaser.RequestAnimationFrame.updateRAF (phaser.js:64165)
    at _onLoop (phaser.js:64148)
Phaser.Tilemap @ phaser.js:98872
tilemap @ phaser.js:48822
loadLevel @ game.js:32
create @ game.js:25
loadComplete @ phaser.js:29298
preUpdate @ phaser.js:29056
updateLogic @ phaser.js:36129
update @ phaser.js:36072
updateRAF @ phaser.js:64165
_onLoop @ phaser.js:64148
requestAnimationFrame (async)
updateRAF @ phaser.js:64167
_onLoop @ phaser.js:64148
requestAnimationFrame (async)
updateRAF @ phaser.js:64167
_onLoop @ phaser.js:64148
requestAnimationFrame (async)
updateRAF @ phaser.js:64167
_onLoop @ phaser.js:64148
requestAnimationFrame (async)
updateRAF @ phaser.js:64167
_onLoop @ phaser.js:64148
requestAnimationFrame (async)
start @ phaser.js:64151
(anonymous) @ phaser.js:35784
execute @ phaser.js:30129
dispatch @ phaser.js:29934
_ready @ phaser.js:75063
_checkReady @ phaser.js:75049
_removePending @ phaser.js:75035
img.onload @ phaser.js:73201
load (async)
addImageAsync @ phaser.js:73199
addMissingImage @ phaser.js:73242
_addImages @ phaser.js:74991
Phaser.Cache @ phaser.js:72932
boot @ phaser.js:35719
Phaser.Device._readyCheck @ phaser.js:62985

[PsichiX]

put console.log(currentLevel) at first line in init function and tell me, if it shows undefined, null, 0, false, or what value.

problem is when you init your object with one of 'false' values, it will assign boolean and engine crashes (engine should warn you that you're trying pass non-string value, but does not doing that because input validation is sadly not implemented).

you should change next line into:

this.currentLevel = currentLevel || 'testroom1';

to eliminate this logic problem.

[Thunderfist]

It says undefined, and I just tried changing the next line and it still isn't working.

Now the error is 'data.trim' is not a function. Any idea why this is happening?