Sign in to follow this  

Help solving a couple of problems? My map seems to force itself to the topmost, and I can't get a extended sprite object working correctly.

Recommended Posts

Hey! I'm fairly new to these forums and to Phaser in general. I have a two-fold issue at hand here, and I wasn't sure if I need to create two separate threads for it or not but decided to present them as one.

So far, I'm enjoying Phaser and it's been working great. However, I keep hitting little snags and I've finally found two I can't fix. 


First one: I've got a state-based game set up, and after a few primary states (Boot, Preload), it switches over to the Engine. 

The engine builds the main game, sets up the map and the foreground aesthetics. However... once the map loads, it seems

to be determined to stay on top of everything else and I cannot figure out why. It is a TILED map - one that I only really use

to provide a default 'fill' of tiles before the game remaps it to something dynamically generated. This is my code for this segment 

thus far:

GameObject.Engine = function() {};GameObject.Engine.prototype = {	init : function()	{;		this.cursors;		this.mapLayer =;		this.mapLayer.z = 0;				this.asteroidShadowGroup =;		this.asteroidShadowGroup.z = 200;				this.mapSizeWidth = 1280;		this.mapSizeHeight = 960;		this.bufferZone = 60;, 0, this.mapSizeWidth, this.mapSizeHeight);		this.initPhysics();    },	initPhysics :function()	{		game.physics.startSystem(Phaser.Physics.ARCADE);        this.asteroidShadowGroup.enableBody = true;        this.asteroidShadowGroup.physicsBodyType = Phaser.Physics.ARCADE;			},	create : function()	{ = game.add.tilemap('World');'Textures', 'Background');'BaseWorld');		this.cursors = game.input.keyboard.createCursorKeys();				this.createPlayer();				this.buildAsteroids();	},	update: function() {				this.asteroidShadowGroup.forEachExists(this.Boundaries, this);				if (this.cursors.up.isDown)		{ -= 4;		}		else if (this.cursors.down.isDown)		{ += 4;		}		if (this.cursors.left.isDown)		{ -= 4;		}		else if (this.cursors.right.isDown)		{ += 4;		}	},	createPlayer: function()	{		this.humanPlayer = new Player(, 20, 20, 'white', false);			},    Boundaries: function (sprite) {        if (sprite.x < -this.bufferZone) {            sprite.x = this.mapSizeWidth + this.bufferZone;        } else if (sprite.x > this.mapSizeWidth + this.bufferZone) {            sprite.x = -this.bufferZone;        }         if (sprite.y < -this.bufferZone) {            sprite.y = this.mapSizeHeight  + this.bufferZone;        } else if (sprite.y > this.mapSizeHeight  + this.bufferZone) {            sprite.y = -this.bufferZone;        }    },    buildAsteroids: function () {        for (var i=0; i < 8; i++ ) {            var x = game.rnd.integerInRange(0, this.mapSizeWidth);            var y = game.rnd.integerInRange(0, this.mapSizeHeight);            this.createAsteroid(x, y);        }	    },    createAsteroid: function (x, y) {        var asteroid = this.asteroidShadowGroup.create(x, y, 'asteroids', game.rnd.integerInRange(0, 12));        asteroid.anchor.set(0.5, 0.5);        asteroid.angularVelocity = game.rnd.integerInRange(0, 360);        var randomAngle = game.math.degToRad(game.rnd.angle());        var randomVelocity = game.rnd.integerInRange(10, 40);        game.physics.arcade.velocityFromRotation(randomAngle, randomVelocity, asteroid.body.velocity);    }}

I have double-checked this and seen that the asteroids, for instance, are generated 'under' the map but cannot figure out why, as is the player (when the player works, which brings me to the second issue):


I decided to build my player into a reusable object so that once the basics of the game are done, I can then add multiplayer. This works fine, to a point, but I've seen this error reported elsewhere as well.

When I try to add animations to this object, I get this error: 


Uncaught TypeError: Cannot read property 'index' of undefined


Beyond the map issue, the above code segment also shows how I'm creating the player as well. Here's the code for the player object - it's based off a sprite extension:

'use strict'; // without this the animation.add will not workvar Player = function(game, x, y, PlayerColor, Network) {, game, x, y, PlayerColor);	game.add.existing(this);	this.anchor.setTo(0.5, 0.5);	    // Player Properties	this.owner = "";	this.isNetwork = false;	this.animationSpeed = 15;	this.hitpoints = 100;	this.level = 0;	this.exp = 0;	this.playerState = 0;		// 0 = Idle	// 1 = WalkArmed	// 2 = Walk Weapon Down	// 3 = Walk Scanner	// 4 = Walk    	// Establish Animations //		this.animations.add('Idle', [11], 0, true);	this.animations.add('WalkArmed', [2,3,4], this.animationSpeed, true);    this.animations.add('WalkWeaponDown', [5,6,7], this.animationSpeed, true);	this.animations.add('WalkScanner', [8,9,10], this.animationSpeed, true);	this.animations.add('Walk', [12,13,14], this.animationSpeed, true);    // enable physics    game.physics.enable(this, Phaser.Physics.ARCADE);	}// Players are a type of Phaser.SpritePlayer.prototype = Object.create(Phaser.Sprite.prototype);Player.prototype.constructor = Player;

I've tried a couple solutions already, making sure I used "" and "use strict", but nothing has worked yet. I'm using Phaser version v2.4.4

Share this post

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.