- ennemy hp/sound/death

Author: Robouste

public/assets/audio/sfx/pixie-dead.ogg

@@ -358,6 +358,26 @@
                  "width":0,
                  "x":690,
                  "y":403.333333333333
+                }, 
+                {
+                 "height":0,
+                 "id":20,
+                 "name":"pixie_ennemy_tag",
+                 "polyline":[
+                        {
+                         "x":0,
+                         "y":0
+                        }, 
+                        {
+                         "x":-131.333666666667,
+                         "y":1.33333
+                        }],
+                 "rotation":0,
+                 "type":"ennemy_patrol",
+                 "visible":true,
+                 "width":0,
+                 "x":981.333333333333,
+                 "y":204.666666666667
                 }],
          "opacity":1,
          "type":"objectgroup",
@@ -366,7 +386,7 @@
          "y":0
         }],
  "nextlayerid":10,
- "nextobjectid":19,
+ "nextobjectid":21,
  "orientation":"orthogonal",
  "renderorder":"right-down",
  "tiledversion":"1.11.0",

public/assets/audio/sfx/pixie-hurt.ogg

@@ -144,6 +144,14 @@ export class AssetsConfig {
         tag: SfxTag.ARROW_WALL_IMPACT,
         url: "audio/sfx/arrow-wall-impact.ogg",
       },
+      {
+        tag: SfxTag.PIXIE_HURT,
+        url: "audio/sfx/pixie-hurt.ogg",
+      },
+      {
+        tag: SfxTag.PIXIE_DEAD,
+        url: "audio/sfx/pixie-dead.ogg",
+      },
     ];
   }
 

public/assets/spritesheets/ennemies/pixie-spritesheet.webp

@@ -2,7 +2,7 @@ import { Scene } from "phaser";
 import { depthsConfig } from "../configs";
 import { GameHelper } from "../helpers";
 import { ArcadeBody, Sprite } from "../phaser-aliases";
-import { AnimationTag, EnnemyTag } from "../tags";
+import { AnimationTag, EnnemyTag, SfxTag } from "../tags";
 import { Hero } from "./hero.game-object";
 
 export interface EnnemyConfig {
@@ -12,20 +12,19 @@ export interface EnnemyConfig {
   patrolDistance: number;
   chaseDistance: number;
   speed: number;
+  patrolSpeed: number;
   sprite: EnnemyTag;
+  hp: number;
 }
 
 export class Ennemy extends Sprite {
   public declare body: ArcadeBody;
 
-  private _patrolDistance: number;
-  private _chaseDistance: number;
   private _player: Hero;
   private _startingX: number;
-  private _spriteTag: EnnemyTag;
   private _patrolDirection = 1;
-  private _speed = 60;
   private _patrolTween: Phaser.Tweens.Tween | null = null;
+  private _config: EnnemyConfig;
 
   private get _isPatrolling(): boolean {
     return this._patrolTween !== null;
@@ -34,10 +33,7 @@ export class Ennemy extends Sprite {
   constructor(config: EnnemyConfig, player: Hero) {
     super(config.scene, config.x, config.y, config.sprite);
     this._startingX = config.x;
-    this._patrolDistance = config.patrolDistance;
-    this._chaseDistance = config.chaseDistance;
-    this._speed = config.speed;
-    this._spriteTag = config.sprite;
+    this._config = config;
 
     this._player = player;
 
@@ -54,30 +50,52 @@ export class Ennemy extends Sprite {
   }
 
   public update(): void {
+    if (this._config.hp <= 0) {
+      return;
+    }
+
     this.updateFlipX();
 
     const distanceToPlayer = Phaser.Math.Distance.Between(this.x, this.y, this._player.x, this._player.y);
 
-    if (distanceToPlayer <= this._chaseDistance) {
+    if (distanceToPlayer <= this._config.chaseDistance) {
       this.stopPatrol();
       this.chasePlayer();
     } //
-    else if (distanceToPlayer > this._chaseDistance && this._patrolTween === null) {
+    else if (distanceToPlayer > this._config.chaseDistance && this._patrolTween === null) {
       this.returnToStart();
     }
+
+    GameHelper.animate(this, AnimationTag.ENNEMY_MOVING, {
+      exceptIf: [AnimationTag.ENNEMY_DEATH, AnimationTag.ENNEMY_HURT],
+    });
+  }
+
+  public hurt(damage: number): void {
+    this._config.hp -= damage;
+
+    if (this._config.hp <= 0) {
+      this.anims.play(AnimationTag.ENNEMY_DEATH);
+      this.body.setVelocityX(0);
+      this.on("animationcomplete", () => this.destroy());
+      this.scene.sound.play(SfxTag.PIXIE_DEAD);
+    } else {
+      this.anims.play(AnimationTag.ENNEMY_HURT);
+      this.scene.sound.play(SfxTag.PIXIE_HURT);
+    }
   }
 
   private startPatrol(): void {
     if (this._patrolTween !== null) {
       return;
     }
 
-    this._patrolDirection = Math.sign(this._patrolDistance);
+    this._patrolDirection = Math.sign(this._config.patrolDistance);
 
     this._patrolTween = this.scene.tweens.add({
       targets: this,
-      x: this._startingX + this._patrolDistance,
-      duration: Math.abs(this._patrolDistance) * 10,
+      x: this._startingX + this._config.patrolDistance,
+      duration: (Math.abs(this._config.patrolDistance) / this._config.patrolSpeed) * 1000,
       yoyo: true,
       repeat: -1,
       onYoyo: () => (this._patrolDirection *= -1),
@@ -94,15 +112,14 @@ export class Ennemy extends Sprite {
 
   private chasePlayer(): void {
     const direction = Math.sign(this._player.x - this.x);
-    this.body.setVelocityX(direction * this._speed);
+    this.body.setVelocityX(direction * this._config.speed);
   }
 
   private returnToStart(): void {
     if (!GameHelper.isCloseEnough(this.x, this._startingX)) {
       const direction = Math.sign(this._startingX - this.x);
-      this.body.setVelocityX(direction * this._speed);
+      this.body.setVelocityX(direction * this._config.patrolSpeed);
     } else {
-      console.log("reached start");
       this.body.setVelocityX(0);
       this.startPatrol();
     }
@@ -120,7 +137,7 @@ export class Ennemy extends Sprite {
   private createAnimations(): void {
     this.anims.create({
       key: AnimationTag.ENNEMY_IDLE,
-      frames: this.anims.generateFrameNumbers(this._spriteTag, {
+      frames: this.anims.generateFrameNumbers(this._config.sprite, {
         start: 0,
         end: 3,
       }),
@@ -130,12 +147,32 @@ export class Ennemy extends Sprite {
 
     this.anims.create({
       key: AnimationTag.ENNEMY_MOVING,
-      frames: this.anims.generateFrameNumbers(this._spriteTag, {
+      frames: this.anims.generateFrameNumbers(this._config.sprite, {
         start: 4,
         end: 7,
       }),
       frameRate: 10,
       repeat: -1,
     });
+
+    this.anims.create({
+      key: AnimationTag.ENNEMY_HURT,
+      frames: this.anims.generateFrameNumbers(this._config.sprite, {
+        start: 8,
+        end: 9,
+      }),
+      frameRate: 20,
+      repeat: 3,
+    });
+
+    this.anims.create({
+      key: AnimationTag.ENNEMY_DEATH,
+      frames: this.anims.generateFrameNumbers(this._config.sprite, {
+        start: 10,
+        end: 11,
+      }),
+      frameRate: 20,
+      repeat: 3,
+    });
   }
 }

public/assets/spritesheets/ennemies/pixie.psd

@@ -16,12 +16,16 @@ export class Hero extends Sprite {
   public get speed(): number {
     return this._speed;
   }
+  public get damage(): number {
+    return this._damage;
+  }
 
   private _speed = 160;
   private _jumpSpeed = 360;
   private _noOfJump = 2;
   private _maxNoOfJump = 2;
   private _lastJumpTime = 0;
+  private _damage = 17;
   private _cursors: Phaser.Types.Input.Keyboard.CursorKeys;
   private _keyboard: Phaser.Input.Keyboard.KeyboardPlugin;
   private _shootKey: Phaser.Input.Keyboard.Key;

public/assets/tilemaps/forest-map.json

@@ -45,3 +45,10 @@ export const containsGameObjectValue = (
 
   return false;
 };
+
+export const isEnumValue = <T extends Record<string | number, string | number>>(
+  enumObj: T,
+  value: unknown
+): value is T[keyof T] => {
+  return Object.values(enumObj).includes(value as T[keyof T]);
+};

src/configs/assets.config.ts

@@ -1,7 +1,7 @@
 import { Scene } from "phaser";
 import { depthsConfig } from "../configs";
 import { Ennemy, EnnemyConfig, Hero } from "../game-objects";
-import { GameHelper } from "../helpers";
+import { GameHelper, isEnumValue } from "../helpers";
 import { Sprite, Tilemap, Tileset } from "../phaser-aliases";
 import {
   BackgroundSound,
@@ -222,15 +222,22 @@ export class ForestLevel {
       }
 
       const { x, y, polyline } = patrol;
+      const ennemyTag = patrol.name;
+
+      if (!isEnumValue(EnnemyTag, ennemyTag)) {
+        throw Error("Invalid ennemy tag");
+      }
 
       const ennemyConfig: EnnemyConfig = {
         x,
         y,
         chaseDistance: 200,
         patrolDistance: polyline[1].x,
-        speed: this.hero.speed - 30,
-        sprite: patrol.name as EnnemyTag,
+        speed: this.hero.speed - 80,
+        patrolSpeed: 40,
+        sprite: ennemyTag,
         scene: this._scene,
+        hp: 30,
       };
 
       const ennemyObject = new Ennemy(ennemyConfig, this.hero);
@@ -253,5 +260,16 @@ export class ForestLevel {
       });
       this._scene.sound.play(SfxTag.ARROW_WALL_IMPACT);
     });
+
+    this._physics.add.collider(this.hero.projectiles, this._ennemies, (projectile, ennemy) => {
+      if (!(ennemy instanceof Ennemy)) {
+        throw Error("ennemy is not a sprite");
+      }
+
+      ennemy.hurt(this.hero.damage);
+      projectile.destroy();
+
+      console.log("hit ennemy", ennemy);
+    });
   }
 }