Sign in to follow this  
lemondragon

Failing to add plugin

Recommended Posts

Hey everyone,

I am currently following the format of this tutorial to try to create a structured Phaser project, where the code is split up. Everything seems to go well, except from the fact that I can't seem to add the Isometric plugin I am using. 
This is the code I'm using:

Main.js

window.onload = function(){

	var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-canvas', null, true, false);

	game.state.add('Boot', Boot);
	game.state.add('Preload', Preload);
	game.state.add('Menu', Menu);
	game.state.add('Start', Start);

	game.state.start('Boot');
}

Preload.js

var Preload = function(game){

};

Preload.prototype = {
	preload: function(){
		this.time.advancedTiming = true;
		this.plugins.add(new Phaser.Plugin.Isometric(this));
		this.iso.anchor.setTo(0.5, 0.2);

		this.load.spritesheet('basic_ground', 'img/spritesheet/basic_ground_tiles.png', 128, 128);

	},
	create: function(){
		this.state.start('Start');
	}

}

This is the error I am getting when running:

Uncaught TypeError: Cannot read property 'add' of undefined
    at Preload.preload (Preload.js:8)
    at c.StateManager.preUpdate (phaser.min.js:10)
    at c.Game.updateLogic (phaser.min.js:12)
    at c.Game.update (phaser.min.js:12)
    at c.RequestAnimationFrame.updateRAF (phaser.min.js:18)
    at window.requestAnimationFrame.forceSetTimeOut._onLoop (phaser.min.js:18)

Any help?

Share this post


Link to post
Share on other sites

I believe it should be "this.game.plugins.add" instead of "this.plugins.add". "this" inside your preload function is a Phaser.State; they don't have a plugins property like game does.

The way to read that error message is this: what's on line 8? I'm calling "this.plugins.add". The error message says "cannot read property 'add' of undefined". That means that "this.plugins" is undefined, like it's not present on "this". What's "this"? It's a Phaser.State. Looking at the Phaser.State docs I don't see a "plugins" property.

Share this post


Link to post
Share on other sites

Thanks, that seemed to fix it! It seems counter intuitive, but it fixed it.
If you don't mind I would like to use this opportunity, to ask an additional question.

I'm currently in the process of splitting up my code to make a more structured project, but I'm having some issues.  I'm running into a problem while splitting the code of my 'spawning tiles' functionality. Note: I'm using the Isometric plugin.

My Start.js

var Start = function(game){};

Start.prototype = {
	create: function(){
		var isoGroup = this.add.group();
		Map.createTiles(this.game, isoGroup);
	}
}

My Map.js

var Map = {};

Map.createTiles = function(game, isoGroup){
    for (var xx = 0; xx < 640; xx += 32) {
      for (var yy = 0; yy < 640; yy += 32) {
        var tile = game.add.isoSprite(xx, yy, 0, 'basic_ground', 0, isoGroup);
        tile.scale.setTo(0.5, 0.5);
        tile.anchor.set(0.5, 0);
        tile.inputEnabled = true;
      }
  }
}

 But I'm getting the following error:

phaser-plugin-isometric.js:805 Uncaught TypeError: Cannot read property 'project' of undefined
    at Phaser.Plugin.Isometric.IsoSprite._project (phaser-plugin-isometric.js:805)
    at new Phaser.Plugin.Isometric.IsoSprite (phaser-plugin-isometric.js:773)
    at c.GameObjectFactory.Phaser.GameObjectFactory.isoSprite (phaser-plugin-isometric.js:976)
    at Object.Map.createTiles (Map.js:8)
    at Start.create (Start.js:8)
    at c.StateManager.loadComplete (phaser.min.js:10)
    at c.StateManager.preUpdate (phaser.min.js:10)
    at c.Game.updateLogic (phaser.min.js:12)
    at c.Game.update (phaser.min.js:12)
    at c.RequestAnimationFrame.updateRAF (phaser.min.js:18)

While I knew that my previous error had to something to do with the 'this' keyword, I really can't tell what's causing this error. It seems to be a error within the Isometric plugin, but I'm probably doing something wrong that's causing it.

Thanks again for the help.

Share this post


Link to post
Share on other sites

My suspicion is that the scope is being screwed up by Map.createTiles being a 'static' method. game.add.isoSprite expects 'this' to be the Phaser instance. You're likely to have the same problem trying to do game.add.sprite or any of the other game.add methods as they all pass 'this.game' to the constructor of the object they're instantiating. To fix this you need to make sure whatever context Map.createTiles is called in is passed the Phaser instance as 'this'. Try this maybe:

var tile = game.add.isoSprite.call(game, xx, yy, 0, 'basic_ground', 0, isoGroup);

Though structuring your project to better handle being in the correct context from the beginning would be preferable. It's very tricky stuff in JavaScript though!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.