Hey everyone, I am new to this community and the phaser framework so go easy on me.
I am having trouble with trying to detect an overlap between two sprites. I don't know what the guidelines are for how much code to post so I will just post my main.js file
EDIT: It seems like my biggest problem here is trying to figure out how to get my badItem and goodItem variables into the update function so that I can see if they are colliding with my character. I've provided a .zip file if anyone wants to take a look at the bigger picture here.
gameObj.Play = function (game) {
var txScore;
var timerSeconds; //current time in seconds
var timerObj; // time object
var txTime; // display text time
var spBackground; // background image
var sp;
var road;
var buildings;
var character;
// Jumping
// items
var Items = [];
var image;
var rndVar;
var badItem;
var goodItem;
// var badItemGroup;
// var goodItemGroup;
// var characterGroup;
};
gameObj.Play.prototype = {
create: function () {
console.log('State - Play');
spBackground = this.add.tileSprite(this.world.centerX, this.world.centerY,960,720, 'background');
spBackground.anchor.setTo(0.5, 0.5);
buildings = this.add.tileSprite(this.world.centerX, this.world.centerY,960,720, 'buildings');
buildings.anchor.setTo(0.5, 0.5);
road = this.add.tileSprite(this.world.centerX, this.world.centerY,960,720, 'road');
road.anchor.setTo(0.5, 0.5);
character = this.add.sprite(this.world.centerX-300, this.world.centerY+170, 'character');
character.anchor.x = 0.5;
// test = this.add.sprite(this.world.centerX+100, this.world.centerY+200, 'coffeecup');
// test.anchor.x = 0.5;
//The numbers given in parameters are the indexes of the frames, in this order: OVER, OUT, DOWN
var btWin = this.add.button(this.world.centerX-110, 50, 'winButton', this.winnerFun, this, 1, 0, 2);
var btLose = this.add.button(this.world.centerX, 50, 'loseButton', this.loserFun, this, 1, 0, 2);
var btPoints = this.add.button(this.world.centerX+110, 50, 'pointsButton', this.pointsFun, this, 1, 0, 2);
gameObj.gScore = 0;
//Add text
var scoreStr = '0';
var timeStr = '2:00';
txScore = this.add.text(115, 15, scoreStr);
txTime = this.add.text(this.world.width - 115, 15, timeStr);
txScore.anchor.x = 0.5;
txTime.anchor.x = 0.5;
txScore.fill = '#264E90';
txScore.font = 'VT323';
txScore.fontSize = 64;
txTime.fill = '#264E90';
txTime.font = 'VT323';
txTime.fontSize = 64;
// good items
Items = [ 'coffeecup', 'textbook', 'charger','student', 'professor', 'car' ];
Items.enableBody = true;
// this.physics.enable(test, Phaser.Physics.ARCADE);
// test.body.collideWorldBounds = true;
// test.body.bounce.setTo(1, 1);
// test.body.velocity.x = -200;
// Set the world (global) gravity and character/road gravity
this.physics.startSystem(Phaser.Physics.ARCADE);
this.physics.arcade.gravity.y = 1800;
this.physics.enable(character, Phaser.Physics.ARCADE);
character.body.collideWorldBounds = true;
character.body.bounce.y = .125;
character.enableBody = true;
character.immovable = true;
this.physics.enable(road, Phaser.Physics.ARCADE);
road.body.bounce.y = 0;
road.body.allowGravity = false;
road.body.immovable = true;
road.body.setSize(960, 100, 0, 700);
// Timer setup
timerSeconds = 120;
//Create timer object
timerObj = this.game.time.create(false);
// Set a timer loop
timerObj.loop(1000, this.updateTimeFun, this);
// Start timer loop
timerObj.start();
// Timed Random Setup
var number = this.time.events.repeat(Phaser.Timer.SECOND * this.rnd.integerInRange(3,5), 24, this.generateRandom, this);
// jumping mechanics
this.JUMP_SPEED = -1100; // pixels/second (negative y is up)
this.spaceKey = this.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR);
},
generateRandom: function() {
rndVar = this.rnd.integerInRange(0,5);
if (rndVar == 3 || rndVar == 4 || rndVar == 5) {
if (rndVar == 3) {
badItem = this.add.sprite(this.world.centerX+500,this.world.centerY+145, Items[rndVar]);
}
if (rndVar == 4) {
badItem = this.add.sprite(this.world.centerX+500,this.world.centerY+140, Items[rndVar]);
}
if (rndVar == 5) {
badItem = this.add.sprite(this.world.centerX+500,this.world.centerY+200, Items[rndVar]);
}
this.physics.enable(badItem, Phaser.Physics.ARCADE);
badItem.enableBody = true;
badItem.body.velocity.x=-1050;
badItem.body.immovable = true;
badItem.body.allowGravity = false;
badItem.body.bounce.setTo(1, 1);
}
else {
goodItem = this.add.sprite(this.world.centerX+500,this.world.centerY+270, Items[rndVar]);
this.physics.enable(goodItem, Phaser.Physics.ARCADE);
goodItem.enableBody = true;
goodItem.body.velocity.x=-1050;
goodItem.body.immovable = true;
goodItem.body.allowGravity = false;
goodItem.body.bounce.setTo(1, 1);
}
},
winnerFun: function () {
console.log('win');
this.state.start('Winner');
},
loserFun: function () {
console.log('lose');
this.state.start('Loser');
},
pointsFun: function () {
console.log('pointsFun called');
gameObj.gScore+= 10;
txScore.text = gameObj.gScore;
},
updateTimeFun: function () {
console.log('updateTimeFun called');
timerSeconds--;
if (timerSeconds >= 0 ) {
// Keep going
var displayMin = Math.floor(timerSeconds / 60) % 60;
var displaySec = Math.floor(timerSeconds) % 60;
if (displaySec < 10 ) {
displaySec = "0" + displaySec;
}
gameObj.gTime = displayMin + ":" + displaySec;
txTime.text = gameObj.gTime;
} else {
// Game over
if (gameObj.gScore > 100) {
this.state.start('Winner');
gameObj.gScore *= 2;
} else {
this.state.start('Loser');
gameObj.gScore *= 0.5;
}
}
},
update: function () {
if (buildings.tilePosition.x > -7000) {
road.tilePosition.x -= 5;
buildings.tilePosition.x -= 1;
spBackground.tilePosition.x -= 0.2;
if (timerObj == 0 && buildings.tilePosition.x > -7000) {
this.state.start('Loser');
gameObj.gScore *= 0.5;
}
} else {
buildings.stopScroll();
timerObj.stop();
this.state.start('Winner');
gameObj.gScore *= 2;
}
// this.physics.arcade.collide(test, character, this.goodItemCollision(test, character), null, this);
var onTheGround = character.body.touching.down;
if (onTheGround && this.spaceBarInputActive()) {
// Jump when the player is touching the ground and the up arrow is pressed
character.body.velocity.y = this.JUMP_SPEED;
}
},
badItemCollision: function (badItem, character ) {
console.log('bad collision');
},
goodItemCollision: function (goodItem, character) {
console.log('good collision');
},
spaceBarInputActive: function(duration) {
var isActive = false;
isActive = this.input.keyboard.downDuration(Phaser.Keyboard.SPACEBAR, duration);
isActive |= (this.game.input.activePointer.justPressed(duration + 1000/60) &&
this.game.input.activePointer.x > this.game.width/4 &&
this.game.input.activePointer.x < this.game.width/2 + this.game.width/4);
return isActive;
},
render: function () {
this.game.debug.bodyInfo(character,32,32);
}
};
The main function to look at here is generateRandom(), which generates a random item from an array and determines if it is a good or bad item, and then it applies physics to it.
Any help would be appreciated, thanks!
westphal.zip
