Lunar Lander EXPLOSION OPTION
In this version of the game the lander will exploded right before game is over.

Load our image data for explosion
Add this code to the PRELOAD section of the MainMenuState.
This code will load the projectile image we need for our explosion.
// image data for EXPLOSION projectile
// -------------------------------------------------------------------------
var projectileData = [
'8888',
'8888',
'8888',
'8888'
];
game.create.texture('projectile', projectileData, 1, 1, 0);
Run Your Code and check for errors.
The image data should be loaded but you won't see any changes yet.
Remember to Press F12 to open the Developer Tools, click Console tab and make sure there are no errors.
Create our Explosion Object
Add this code to the end of the CREATE function of the Level1State.
This code will create a collection of particles which will make up our explosion.
// Create Explosion object - which is a collection of projectile pieces
// --------------------------------------------------------------------
this.NUMBER_OF_PIECES = 100;
// create a flag so the explosion only happens once
this.explosion_happened = false;
// create group of projectile pieces
this.piecesPool = this.game.add.group();
for(var k = 0; k < this.NUMBER_OF_PIECES; k++) {
// Create each piece and add it to the group.
var piece = this.game.add.sprite(0, 0, 'ship');
this.piecesPool.add(piece);
// Set its pivot point to the center of the sprite
piece.anchor.setTo(0.5, 0.5);
// Enable physics on the sprite object
this.game.physics.enable(piece, Phaser.Physics.ARCADE);
}
Run Your Code and check for errors.
Our game now has all the particles created in a collection. You won't see any changes yet though.
Explosion
Add this new function right after the UPDATE function of the Level1State.
This function will produce our explosion by randomly throwing all the particles out from the rocket ship.
explosion: function() {
// create a bunch of particles and make then go everywhere
for(var ii = 1; ii < this.NUMBER_OF_PIECES; ii++ ) {
// where do want the explosion on the screen?
// at the same place the rocket is
var particle = this.game.add.sprite(this.rocket.x, this.rocket.y, 'projectile');
// Enable physics on the sprite object
this.game.physics.enable(particle, Phaser.Physics.ARCADE);
// set a random velocity direction for each particle
// by setting a flag if the axis will be negative or positive
var xneg = game.rnd.integerInRange(1,2);
if (xneg == 1) { xneg = xneg * -1; }
var yneg = game.rnd.integerInRange(1,2);
if (yneg == 1) { yneg = yneg * -1; }
// set the velocity of each individual particle
particle.body.velocity.y = game.rnd.integerInRange(0, 1000) * xneg;
particle.body.velocity.x = game.rnd.integerInRange(0, 1000) * yneg;
//---comment following to experiment with particles
//particle.body.gravity.x = 10000;
//particle.body.gravity.y = 1;
//particle.body.collideWorldBounds = true;
//particle.body.bounce.set(.5);
}
},
Now, lets modify the part of the program which determines when the game is over.
Find the code below in the UPDATE function of the Level1State and replace it code below.
// check if this level is over
// --------------------------------------------------------------------
if (Level1State.ThisLevelIsOverDude === true) {
// make an explosion only once
if (this.explosion_happened === false) {
this.explosion();
this.explosion_happened = true;
}
// check if user is pressing spacebar
if (this.keyboard.isDown(Phaser.Keyboard.SPACEBAR)) {
Level1State.ThisLevelIsOverDude = false;
game.state.start('mainmenu');
}
}
Run Your Code and check for errors.
Try crashing the rocket ship to see the explosion.
You're done! You are a coder!!
What other things can you add to this game?
What other games can you make up using this code!?