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!?