mustachio-game 1.0.0

package/src/classes/game-objects/projectiles/enemy-projectiles/fire-cross.ts

@@ -0,0 +1,67 @@
+import type { GameContext } from "../../../../shared/game-context";
+import type { FireCrossBlock } from "../../set-pieces/obstacles/blocks/fire-cross-block";
+import { EnemyProjectile } from "./enemy-projectile";
+import { BLOCK_SIZE } from "../../../../shared/constants";
+import { direction, type collision } from "../../../../shared/types";
+
+export class FireCross extends EnemyProjectile {
+  private readonly direction: number;
+  private readonly maxLength = BLOCK_SIZE * 4;
+  private readonly minLength = BLOCK_SIZE * 0.5;
+
+  constructor(gameContext: GameContext, parent: FireCrossBlock, dir: number) {
+    const offset = BLOCK_SIZE * 0.25;
+    const width = BLOCK_SIZE * 0.5;
+    const height = BLOCK_SIZE * 0.5;
+    const x = parent.rect.x + parent.rect.width / 2 - offset;
+    const y = parent.rect.y + parent.rect.height / 2 - offset;
+
+    super(gameContext, {
+      x,
+      y,
+      width,
+      height,
+    });
+
+    this.speedY = 0.75;
+    this.speedX = 0.75;
+
+    this.direction = dir;
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  update(_: collision[]): void {
+    if (this.direction === direction.LEFT) {
+      this.rect.x -= this.speedX;
+      this.rect.width += this.speedX;
+    } else if (this.direction === direction.RIGHT) {
+      this.rect.width += this.speedX;
+    } else if (this.direction === direction.UP) {
+      this.rect.y -= this.speedY;
+      this.rect.height += this.speedY;
+    } else if (this.direction === direction.DOWN) {
+      this.rect.height += this.speedY;
+    }
+
+    if (this.rect.width > this.maxLength || this.rect.height > this.maxLength) {
+      this.speedX = -Math.abs(this.speedX);
+      this.speedY = -Math.abs(this.speedY);
+    } else if (
+      this.rect.width < this.minLength ||
+      this.rect.height < this.minLength
+    ) {
+      this.speedX = Math.abs(this.speedX);
+      this.speedY = Math.abs(this.speedY);
+    }
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.fillStyle = "red";
+    ctx.fillRect(
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+  }
+}

package/src/classes/game-objects/projectiles/enemy-projectiles/laser.ts

@@ -0,0 +1,41 @@
+import type { GameContext } from "../../../../shared/game-context";
+import type { collision } from "../../../../shared/types";
+import { EnemyProjectile } from "./enemy-projectile";
+import type { Enemy } from "../../point-objects/enemies/enemy";
+import { BLOCK_SIZE } from "../../../../shared/constants";
+
+export class Laser extends EnemyProjectile {
+  constructor(gameContext: GameContext, parent: Enemy, shotTime: number) {
+    const width = BLOCK_SIZE * 0.5;
+    const height = gameContext.gameArea.height;
+    const x = parent.rect.x + parent.rect.width / 2 - width / 2;
+    const y = parent.rect.y + parent.rect.height;
+
+    super(gameContext, {
+      x,
+      y,
+      width,
+      height,
+    });
+
+    setTimeout(() => {
+      this.gameContext.removeGameObject(this);
+    }, shotTime);
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  update(_: collision[]): void {}
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.fillStyle = "blue";
+    ctx.fillRect(
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+    ctx.strokeStyle = "black";
+    ctx.lineWidth = 2;
+    ctx.strokeRect(this.rect.x, this.rect.y, this.rect.width, this.rect.height);
+  }
+}

package/src/classes/game-objects/projectiles/projectile.ts

@@ -0,0 +1,3 @@
+import { MovingGameObject } from "../../../shared/game-objects/moving-game-object";
+
+export abstract class Projectile extends MovingGameObject {}

package/src/classes/game-objects/projectiles/stache-ball.ts

@@ -0,0 +1,57 @@
+import { Enemy } from "../point-objects/enemies/enemy";
+import { Projectile } from "./projectile";
+import type { GameContext } from "../../../shared/game-context";
+import type { collision, rectangle } from "../../../shared/types";
+
+export class StacheBall extends Projectile {
+  constructor(
+    gameContext: GameContext,
+
+    x: number,
+    y: number,
+  ) {
+    const rect: rectangle = {
+      x,
+      y,
+      width: 8,
+      height: 8,
+    };
+
+    super(gameContext, rect);
+  }
+
+  update(collisions: collision[]): void {
+    this.leftRightMovement(collisions);
+
+    if (this.onGround) {
+      this.speedY = -5.5;
+    }
+
+    if (this.rect.x < 0 || this.rect.x > this.gameContext.gameArea.width) {
+      this.gameContext.removeGameObject(this);
+      return;
+    }
+
+    for (const collision of collisions) {
+      if (collision.gameObject instanceof Enemy) {
+        collision.gameObject.enemyHit();
+        this.gameContext.removeGameObject(this);
+        return;
+      }
+    }
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.beginPath();
+    ctx.lineWidth = 5;
+    ctx.fillStyle = "red";
+    ctx.arc(
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.height,
+      0,
+      2 * Math.PI,
+    );
+    ctx.fill();
+  }
+}

package/src/classes/game-objects/set-pieces/flag.ts

@@ -0,0 +1,34 @@
+import type { GameContext } from "../../../shared/game-context";
+import { SetPiece } from "./set-piece";
+import { BLOCK_SIZE } from "../../../shared/constants";
+import homestead from "../../../assets/homestead.webp";
+import homesteadClosed from "../../../assets/homesteadClosed.webp";
+
+export class Flag extends SetPiece {
+  private readonly image = new Image();
+
+  constructor(gameContext: GameContext, x: number, y: number) {
+    super(gameContext, {
+      x,
+      y,
+      width: BLOCK_SIZE * 8,
+      height: BLOCK_SIZE * 8,
+    });
+
+    this.image.src = homestead;
+  }
+
+  closeDoor() {
+    this.image.src = homesteadClosed;
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.drawImage(
+      this.image,
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/blocks/block.ts

@@ -0,0 +1,17 @@
+import { BLOCK_SIZE } from "../../../../../shared/constants";
+import type { GameContext } from "../../../../../shared/game-context";
+import type { rectangle } from "../../../../../shared/types";
+import { Obstacle } from "../obstacle";
+
+export abstract class Block extends Obstacle {
+  constructor(gameContext: GameContext, x: number, y: number) {
+    const rect: rectangle = {
+      x,
+      y,
+      width: BLOCK_SIZE,
+      height: BLOCK_SIZE,
+    };
+
+    super(gameContext, rect);
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/blocks/cave-wall.ts

@@ -0,0 +1,21 @@
+import type { GameContext } from "../../../../../shared/game-context";
+import { Block } from "./block";
+import type { rectangle } from "../../../../../shared/types";
+
+export class CaveWall extends Block {
+  constructor(gameContext: GameContext, rect: rectangle) {
+    super(gameContext, rect.x, rect.y);
+    this.rect.width = rect.width;
+    this.rect.height = rect.height;
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.fillStyle = "DarkSlateGray";
+    ctx.fillRect(
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/blocks/falling-floor.ts

@@ -0,0 +1,65 @@
+import { BLOCK_SIZE } from "../../../../../shared/constants";
+import type { rectangle } from "../../../../../shared/types";
+import { Block } from "./block";
+
+export class FallingFloor extends Block {
+  private isFalling: boolean = false;
+  private fallStarted: boolean = false;
+
+  startFall() {
+    if (this.fallStarted) {
+      return;
+    }
+
+    this.fallStarted = true;
+    setTimeout(() => {
+      this.acceptsCollision = false;
+      this.isFalling = true;
+    }, 250);
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    // This logic SHOULD be in the update method,
+    // but I decided to extend block rather than UpdatingGameObject
+    if (this.isFalling) {
+      this.rect.y += 5;
+
+      if (this.rect.y > this.gameContext.gameArea.height) {
+        this.gameContext.removeGameObject(this);
+      }
+    }
+
+    ctx.fillStyle = "Bisque";
+    ctx.fillRect(
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+
+    const seeThroughRect: rectangle = {
+      x: this.rect.x + BLOCK_SIZE / 3 + this.gameContext.xOffset,
+      y: this.rect.y + BLOCK_SIZE / 3,
+      width: this.rect.width - (BLOCK_SIZE / 3) * 2,
+      height: this.rect.height - (BLOCK_SIZE / 3) * 2,
+    };
+
+    ctx.clearRect(
+      seeThroughRect.x,
+      seeThroughRect.y,
+      seeThroughRect.width,
+      seeThroughRect.height,
+    );
+
+    ctx.strokeStyle = "black";
+    ctx.lineWidth = 2;
+    ctx.strokeRect(
+      seeThroughRect.x,
+      seeThroughRect.y,
+      seeThroughRect.width,
+      seeThroughRect.height,
+    );
+
+    ctx.strokeRect(this.rect.x, this.rect.y, this.rect.width, this.rect.height);
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/blocks/fire-bar-block.ts

@@ -0,0 +1,31 @@
+import type { GameContext } from "../../../../../shared/game-context";
+import { Block } from "./block";
+import { FireBar } from "../../../projectiles/enemy-projectiles/fire-bar";
+import obstacleBrick from "../../../../../assets/obstacleBrick.webp";
+
+export class FireBarBlock extends Block {
+  private readonly image: HTMLImageElement = new Image();
+  constructor(gameContext: GameContext, x: number, y: number) {
+    super(gameContext, x, y);
+
+    this.image.src = obstacleBrick;
+    const fireBar = new FireBar(
+      gameContext,
+      this.rect.x + this.rect.width / 2 - 5,
+      this.rect.y + this.rect.height / 2 - 50,
+      this,
+    );
+
+    this.gameContext.addGameObject(fireBar);
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.drawImage(
+      this.image,
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/blocks/fire-cross-block.ts

@@ -0,0 +1,28 @@
+import type { GameContext } from "../../../../../shared/game-context";
+import { Block } from "./block";
+import { FireCross } from "../../../projectiles/enemy-projectiles/fire-cross";
+import obstacleBrick from "../../../../../assets/obstacleBrick.webp";
+
+export class FireCrossBlock extends Block {
+  private readonly image: HTMLImageElement = new Image();
+
+  constructor(gameContext: GameContext, x: number, y: number, dirs: number[]) {
+    super(gameContext, x, y);
+
+    this.image.src = obstacleBrick;
+
+    for (const dir of dirs) {
+      this.gameContext.addGameObject(new FireCross(gameContext, this, dir));
+    }
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.drawImage(
+      this.image,
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/blocks/punchable-blockS/brick.ts

@@ -0,0 +1,44 @@
+import type { GameContext } from "../../../../../../shared/game-context";
+import { PunchableBlock } from "./punchable-block";
+import { BrickDebris } from "../../../../projectiles/brick-debris";
+import brickImage from "../../../../../../assets/brick.webp";
+
+export class Brick extends PunchableBlock {
+  protected punched = false;
+  private readonly image: HTMLImageElement = new Image();
+
+  constructor(gameContext: GameContext, x: number, y: number) {
+    super(gameContext, x, y);
+    this.image.src = brickImage;
+  }
+
+  punch() {
+    if (this.punched) {
+      return;
+    }
+
+    this.punched = true;
+    this.gameContext.addScore(100);
+
+    const speedXs = [-1, -2.5, 1, 2.5];
+    const speedYs = [-2, -3.5, -2, -3.5];
+    for (let i = 0; i < 4; i++) {
+      const debris = new BrickDebris(this.gameContext, this);
+      debris.speedX = speedXs[i];
+      debris.speedY = speedYs[i];
+      this.gameContext.addGameObject(debris);
+    }
+
+    this.gameContext.removeGameObject(this);
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.drawImage(
+      this.image,
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/blocks/punchable-blockS/item-block.ts

@@ -0,0 +1,82 @@
+import type { GameContext } from "../../../../../../shared/game-context";
+import type { Item } from "../../../../point-objects/items/item";
+import { Coin } from "../../../../point-objects/items/coin";
+import { Stacheroom } from "../../../../point-objects/items/stacheroom";
+import { FireStache } from "../../../../point-objects/items/fire-stache";
+import { PunchableBlock } from "./punchable-block";
+import itemBlockImage from "../../../../../../assets/itemBlock.webp";
+import punchedBlockImage from "../../../../../../assets/punchedBlock.webp";
+
+export class ItemBlock extends PunchableBlock {
+  protected punched = false;
+  hidden: boolean;
+
+  private readonly image: HTMLImageElement = new Image();
+  private readonly imageSource: string = itemBlockImage;
+  private readonly imageSourcePunched: string = punchedBlockImage;
+
+  protected item: new (
+    gameContext: GameContext,
+    x: number,
+    y: number,
+    fromItemBlock?: boolean,
+  ) => Item;
+
+  constructor(
+    gameContext: GameContext,
+    x: number,
+    y: number,
+    hidden: boolean,
+    itemType: "coin" | "stacheroom" | "fire-stache",
+  ) {
+    super(gameContext, x, y);
+    this.image.src = this.imageSource;
+    this.hidden = hidden;
+
+    switch (itemType) {
+      case "coin":
+        this.item = Coin;
+        break;
+      case "stacheroom":
+        this.item = Stacheroom;
+        break;
+      case "fire-stache":
+        this.item = FireStache;
+        break;
+      default:
+        throw new Error(`Unknown item type: ${itemType}`);
+    }
+  }
+
+  punch() {
+    if (this.punched) {
+      return;
+    }
+
+    this.punched = true;
+    this.hidden = false;
+    this.image.src = this.imageSourcePunched;
+    const newItem = new this.item(
+      this.gameContext,
+      this.rect.x + this.rect.width / 2,
+      this.rect.y - this.rect.height,
+      true,
+    );
+
+    this.gameContext.addGameObject(newItem, true);
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    if (this.hidden) {
+      return;
+    }
+
+    ctx.drawImage(
+      this.image,
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/blocks/punchable-blockS/punchable-block.ts

@@ -0,0 +1,6 @@
+import { Block } from "../block";
+
+export abstract class PunchableBlock extends Block {
+  protected abstract punched: boolean;
+  abstract punch(): void;
+}

package/src/classes/game-objects/set-pieces/obstacles/blocks/stache-cannon.ts

@@ -0,0 +1,54 @@
+import type { GameContext } from "../../../../../shared/game-context";
+import { Block } from "./block";
+import { direction } from "../../../../../shared/types";
+import { StacheShot } from "../../../point-objects/enemies/stache-shot";
+import { outOfBounds } from "../../../../../shared/app-code";
+import stacheCannonUp from "../../../../../assets/cannonUp.webp";
+import stacheCannonDown from "../../../../../assets/cannonDown.webp";
+import stacheCannonLeft from "../../../../../assets/cannonLeft.webp";
+import stacheCannonRight from "../../../../../assets/cannonRight.webp";
+
+export class StacheCannon extends Block {
+  private readonly image: HTMLImageElement = new Image();
+  private readonly shotTimer: number;
+
+  constructor(gameContext: GameContext, x: number, y: number, dir: number) {
+    super(gameContext, x, y);
+    if (dir === direction.UP) {
+      this.image.src = stacheCannonUp;
+    } else if (dir === direction.DOWN) {
+      this.image.src = stacheCannonDown;
+    } else if (dir === direction.LEFT) {
+      this.image.src = stacheCannonLeft;
+    } else if (dir === direction.RIGHT) {
+      this.image.src = stacheCannonRight;
+    } else {
+      throw new Error("Invalid direction for StacheCannon");
+    }
+
+    this.shotTimer = setInterval(() => {
+      if (outOfBounds(this, this.gameContext)) {
+        return;
+      }
+
+      this.gameContext.addGameObject(
+        new StacheShot(this.gameContext, this, dir),
+        true,
+      );
+    }, 6000);
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.drawImage(
+      this.image,
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+  }
+
+  dispose() {
+    clearInterval(this.shotTimer);
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/blocks/wall.ts

@@ -0,0 +1,22 @@
+import type { GameContext } from "../../../../../shared/game-context";
+import { Block } from "./block";
+import obstacleBrick from "../../../../../assets/obstacleBrick.webp";
+
+export class Wall extends Block {
+  private readonly image: HTMLImageElement = new Image();
+
+  constructor(gameContext: GameContext, x: number, y: number) {
+    super(gameContext, x, y);
+    this.image.src = obstacleBrick;
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.drawImage(
+      this.image,
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/floor.ts

@@ -0,0 +1,27 @@
+import { BLOCK_SIZE } from "../../../../shared/constants";
+import { Obstacle } from "./obstacle";
+
+export class Floor extends Obstacle {
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.fillStyle = "YellowGreen";
+
+    const grassRect = {
+      x: this.rect.x + this.gameContext.xOffset,
+      y: this.rect.y,
+      width: this.rect.width,
+      height: BLOCK_SIZE / 3,
+    };
+
+    const dirtRect = {
+      x: this.rect.x + this.gameContext.xOffset,
+      y: this.rect.y + BLOCK_SIZE / 3,
+      width: this.rect.width,
+      height: BLOCK_SIZE - BLOCK_SIZE / 3,
+    };
+
+    ctx.fillRect(grassRect.x, grassRect.y, grassRect.width, grassRect.height);
+
+    ctx.fillStyle = "SaddleBrown";
+    ctx.fillRect(dirtRect.x, dirtRect.y, dirtRect.width, dirtRect.height);
+  }
+}

package/src/classes/game-objects/set-pieces/obstacles/obstacle-types.ts

@@ -0,0 +1,14 @@
+import type { GameContext } from "../../../../shared/game-context";
+
+export type PipeOptions = {
+  x: number;
+  y: number;
+  width?: number;
+  height?: number;
+  hasStacheSeed?: boolean;
+  reversed?: boolean;
+};
+
+export type WarpPipeOptions = PipeOptions & {
+  setNewLevel: (gameContext: GameContext) => void;
+};

package/src/classes/game-objects/set-pieces/obstacles/obstacle.ts

@@ -0,0 +1,3 @@
+import { SetPiece } from "../set-piece";
+
+export abstract class Obstacle extends SetPiece {}

package/src/classes/game-objects/set-pieces/obstacles/pipe.ts

@@ -0,0 +1,35 @@
+import { Obstacle } from "./obstacle";
+import type { GameContext } from "../../../../shared/game-context";
+import { StacheSeed } from "../../point-objects/enemies/stache-seed";
+import { BLOCK_SIZE } from "../../../../shared/constants";
+import type { PipeOptions } from "./obstacle-types";
+
+export class Pipe extends Obstacle {
+  constructor(
+    gameContext: GameContext,
+    { x, y, width, height, hasStacheSeed, reversed }: PipeOptions,
+  ) {
+    super(gameContext, {
+      x,
+      y,
+      width: width ?? BLOCK_SIZE * 2,
+      height: height ?? BLOCK_SIZE * 2,
+    });
+
+    if (hasStacheSeed) {
+      gameContext.addGameObject(
+        new StacheSeed(gameContext, this, reversed ?? false),
+      );
+    }
+  }
+
+  draw(ctx: CanvasRenderingContext2D) {
+    ctx.fillStyle = "green";
+    ctx.fillRect(
+      this.rect.x + this.gameContext.xOffset,
+      this.rect.y,
+      this.rect.width,
+      this.rect.height,
+    );
+  }
+}