added all rocket patrol functionality

index.html

@@ -13,6 +13,7 @@
     <script src="./lib/phaser.js"></script>
     <script src="./src/scenes/Menu.js"></script>
     <script src="./src/prefabs/Rocket.js"></script>
+    <script src="./src/prefabs/Spaceship.js"></script>
     <script src="./src/scenes/Play.js"></script>
     <script src="./src/main.js"></script>
 

src/prefabs/Rocket.js

@@ -8,6 +8,7 @@ class Rocket extends Phaser.GameObjects.Sprite {
       scene.add.existing(this);
       this.isFiring = false;
       this.moveSpeed = 2;
+      this.sfxRocket = scene.sound.add('sfx_rocket'); // add rocket sfx
     }
 
     update() 
@@ -24,9 +25,10 @@ class Rocket extends Phaser.GameObjects.Sprite {
             }
         }
 
-        if(Phaser.Input.Keyboard.JustDown(keyF))
-        {
+          // fire button
+        if (Phaser.Input.Keyboard.JustDown(keyF) && !this.isFiring) {
             this.isFiring = true;
+            this.sfxRocket.play();  // play sfx
         }
 
         if(this.isFiring && this.y >= borderUISize * 3 + borderPadding)
@@ -36,8 +38,13 @@ class Rocket extends Phaser.GameObjects.Sprite {
 
         if(this.y <= borderUISize * 3 + borderPadding)
         {
-            this.isFiring = false;
-            this.y = game.config.height - borderUISize - borderPadding;
+            this.reset();
         }
     }
+
+    reset() 
+    {
+        this.isFiring = false;
+        this.y = game.config.height - borderUISize - borderPadding;
+    }
   }

src/prefabs/Spaceship.js

@@ -0,0 +1,25 @@
+class Spaceship extends Phaser.GameObjects.Sprite {
+    constructor(scene, x, y, texture, frame, pointValue) {
+      super(scene, x, y, texture, frame);
+
+      // add object to existing scene
+      scene.add.existing(this);
+      this.points = pointValue;
+      this.moveSpeed = game.settings.spaceshipSpeed;
+    }
+
+    update()
+    {
+        this.x -= this.moveSpeed;
+
+        if(this.x <= 0 - this.width)
+        {
+            this.reset();
+        }
+    }
+
+    reset() 
+    {
+        this.x = game.config.width;
+    }
+}

src/scenes/menu.js

@@ -3,8 +3,57 @@ class Menu extends Phaser.Scene {
         super("menuScene");
     }
 
+    preload() {
+        // load audio
+        this.load.audio('sfx_select', './assets/blip_select12.wav');
+        this.load.audio('sfx_explosion', './assets/explosion38.wav');
+        this.load.audio('sfx_rocket', './assets/rocket_shot.wav');
+      }
+
     create() {
-        this.add.text(20, 20, "Rocket Patrol Menu");
-        this.scene.start("playScene");
+
+        let menuConfig = {
+            fontFamily: 'Courier',
+            fontSize: '28px',
+            backgroundColor: '#F3B141',
+            color: '#843605',
+            align: 'right',
+            padding: {
+                top: 5,
+                bottom: 5,
+            },
+            fixedWidth: 0
+        }
+
+        this.add.text(game.config.width/2, game.config.height/2 - borderUISize- borderPadding,'ROCKET PATROL', menuConfig).setOrigin(0.5);
+        this.add.text(game.config.width/2, game.config.height/2, 'Use ←→ arrows to move & (F) to fire', menuConfig).setOrigin(0.5);
+        menuConfig.backgroundColor = '#00FF00';
+        menuConfig.color = '#000';
+        this.add.text(game.config.width/2, game.config.height/2 + borderUISize + borderPadding, 'Press ← for Novice or → for Expert', menuConfig).setOrigin(0.5);
+        // define keys
+        keyLEFT = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.LEFT);
+        keyRIGHT = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.RIGHT);
+
+    }
+
+    update() {
+        if (Phaser.Input.Keyboard.JustDown(keyLEFT)) {
+          // easy mode
+          game.settings = {
+            spaceshipSpeed: 3,
+            gameTimer: 60000    
+          }
+          this.sound.play('sfx_select');
+          this.scene.start('playScene');    
+        }
+        if (Phaser.Input.Keyboard.JustDown(keyRIGHT)) {
+          // hard mode
+          game.settings = {
+            spaceshipSpeed: 4,
+            gameTimer: 45000    
+          }
+          this.sound.play('sfx_select');
+          this.scene.start('playScene');    
+        }
       }
 }

src/scenes/play.js

@@ -8,6 +8,8 @@ class Play extends Phaser.Scene {
         this.load.image('rocket', './assets/rocket.png');
         this.load.image('spaceship', './assets/spaceship.png');
         this.load.image('starfield', './assets/starfield.png');
+        // load spritesheet
+        this.load.spritesheet('explosion', './assets/explosion.png', {frameWidth: 64, frameHeight: 32, startFrame: 0, endFrame: 9});
     }
 
     create() {
@@ -22,15 +24,115 @@ class Play extends Phaser.Scene {
         this.add.rectangle(game.config.width - borderUISize, 0, borderUISize, game.config.height, 0xFFFFFF).setOrigin(0, 0);
         // add rocket (p1)
         this.p1Rocket = new Rocket(this, game.config.width/2, game.config.height - borderUISize - borderPadding, 'rocket').setOrigin(0.5, 0);
+          // add spaceships (x3)
+        this.ship01 = new Spaceship(this, game.config.width + borderUISize*6, borderUISize*4, 'spaceship', 0, 30).setOrigin(0, 0);
+        this.ship02 = new Spaceship(this, game.config.width + borderUISize*3, borderUISize*5 + borderPadding*2, 'spaceship', 0, 20).setOrigin(0,0);
+        this.ship03 = new Spaceship(this, game.config.width, borderUISize*6 + borderPadding*4, 'spaceship', 0, 10).setOrigin(0,0);
         // define keys
         keyF = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.F);
         keyR = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.R);
         keyLEFT = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.LEFT);
         keyRIGHT = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.RIGHT);
+
+        // animation config
+        this.anims.create({
+            key: 'explode',
+            frames: this.anims.generateFrameNumbers('explosion', { start: 0, end: 9, first: 0}),
+            frameRate: 30
+        });
+        // initialize score
+        this.p1Score = 0;
+        // display score
+        let scoreConfig = {
+            fontFamily: 'Courier',
+            fontSize: '28px',
+            backgroundColor: '#F3B141',
+            color: '#843605',
+            align: 'right',
+            padding: {
+            top: 5,
+            bottom: 5,
+            },
+            fixedWidth: 100
+        }
+        this.scoreLeft = this.add.text(borderUISize + borderPadding, borderUISize + borderPadding*2, this.p1Score, scoreConfig);
+
+        // GAME OVER flag
+        this.gameOver = false;
+        // 60-second play clock
+        scoreConfig.fixedWidth = 0;
+        this.clock = this.time.delayedCall(60000, () => {
+            this.add.text(game.config.width/2, game.config.height/2, 'GAME OVER', scoreConfig).setOrigin(0.5);
+            this.add.text(game.config.width/2, game.config.height/2 + 64, 'Press (R) to Restart or ← for Menu', scoreConfig).setOrigin(0.5);
+            this.gameOver = true;
+        }, null, this);
     }
 
     update() {
+          // check key input for restart
+        if (this.gameOver && Phaser.Input.Keyboard.JustDown(keyR)) {
+            this.scene.restart();
+        }
+        if (this.gameOver && Phaser.Input.Keyboard.JustDown(keyLEFT)) {
+            this.scene.start("menuScene");
+        }
+
         this.starfield.tilePositionX -= 4;
         this.p1Rocket.update();
+        this.ship01.update();               // update spaceships (x3)
+        this.ship02.update();
+        this.ship03.update();
+        // check collisions
+        // check collisions
+        if(this.checkCollision(this.p1Rocket, this.ship03)) {
+            this.p1Rocket.reset();
+            this.shipExplode(this.ship03);   
+        }
+        if (this.checkCollision(this.p1Rocket, this.ship02)) {
+            this.p1Rocket.reset();
+            this.shipExplode(this.ship02);
+        }
+        if (this.checkCollision(this.p1Rocket, this.ship01)) {
+            this.p1Rocket.reset();
+            this.shipExplode(this.ship01);
+        }
+
+        if (!this.gameOver) {               
+            this.p1Rocket.update();         // update rocket sprite
+            this.ship01.update();           // update spaceships (x3)
+            this.ship02.update();
+            this.ship03.update();
+        } 
+
+    }
+
+    checkCollision(rocket, ship) {
+    // simple AABB checking
+    if (rocket.x < ship.x + ship.width && 
+        rocket.x + rocket.width > ship.x && 
+        rocket.y < ship.y + ship.height &&
+        rocket.height + rocket.y > ship. y) {
+            return true;
+    } else {
+        return false;
+    }
+    }
+    shipExplode(ship) {
+        // temporarily hide ship
+        ship.alpha = 0;                         
+        // create explosion sprite at ship's position
+        let boom = this.add.sprite(ship.x, ship.y, 'explosion').setOrigin(0, 0);
+        boom.anims.play('explode');             // play explode animation
+        boom.on('animationcomplete', () => {    // callback after ani completes
+          ship.reset();                       // reset ship position
+          ship.alpha = 1;                     // make ship visible again
+          boom.destroy();                     // remove explosion sprite
+        });
+        // score add and repaint
+
+        this.p1Score += ship.points;
+        this.scoreLeft.text = this.p1Score; 
+        console.log(ship.points);
+        this.sound.play('sfx_explosion');      
       }
 }