Enemy AI

src/common/utils.ts

@@ -46,6 +46,13 @@ export function* zip(...args: Iterable<any>[]) {
     }
 }
 
+export function* enumerate<T>(iterable: Iterable<T>): Generator<[number, T]> {
+    let i = 0;
+    for (const item of iterable) {
+        yield [i++, item];
+    }
+}
+
 export const range = (size: number | string) => Object.keys((new Array(+size)).fill(0)).map(k => +k);
 export const clamp = (value: number, min: number, max: number) => Math.min(max, Math.max(min, value));
 export const lerp = (start: number, end: number, t: number) => (start + (end - start) * t);

src/games/zombies/character.ts

@@ -1,5 +1,5 @@
 import { lerp } from "@common/utils";
-import Item from "./item";
+import Item, { ItemType } from "./item";
 import Tile from "./tile";
 
 const MOVE_DURATION = .1;
@@ -9,6 +9,13 @@ export default class Character extends Item {
     private path: Tile[] = [];
     private pathProgress = 0;
     
+    get moveBonus() {
+        if (this.type === ItemType.CHAR_RUNNER || this.type === ItemType.ENEMY_DOG) return 1;
+        if (this.type === ItemType.ENEMY_ZOMBIE) return -1;
+
+        return 0;
+    }
+
     public get displayPosition(): [number, number] {
         if (this.path.length > 1) {
             const numTransitions = this.path.length - 1;
@@ -16,6 +23,11 @@ export default class Character extends Item {
             const currentTileIdx = Math.floor(progress);
 
             const currentTile = this.path[currentTileIdx];
+
+            if (!currentTile) {
+                return [this.tile.centerX, this.tile.centerY];
+            }
+
             const nextTile = this.path[currentTileIdx + 1];
 
             if (!nextTile) {

src/games/zombies/index.ts

@@ -14,12 +14,14 @@ const TILE_SIZE = (MAP_PIXEL_SIZE - MAP_PADDING * 2) / MAP_SIZE;
 const SIDEBAR_SIZE = clamp((window.innerWidth - window.innerHeight) / 2, 300, 600);
 
 const canvas = createCanvas(MAP_PIXEL_SIZE + SIDEBAR_SIZE * 2, MAP_PIXEL_SIZE);
+
+const spinner = new Spinner([MAP_PIXEL_SIZE + SIDEBAR_SIZE, 0], [SIDEBAR_SIZE, SIDEBAR_SIZE]);
 const map = new TileMap(
     [MAP_PADDING + SIDEBAR_SIZE, MAP_PADDING],
     MAP_SIZE,
     TILE_SIZE,
+    spinner,
 );
-const spinner = new Spinner([MAP_PIXEL_SIZE + SIDEBAR_SIZE, 0], [SIDEBAR_SIZE, SIDEBAR_SIZE]);
 const inventory = new Inventory(
     map,
     [0, 0],

src/games/zombies/pathfinding.ts

@@ -5,7 +5,7 @@ namespace Pathfinding {
      * A* search from start to end Tile.
      * @returns array of Tiles from start to end (inclusive), or [] if no path.
      */
-    export function findPath(start: Tile, end: Tile): Tile[] {
+    export function findPath(start: Tile, end: Tile, forEnemy = false): Tile[] {
         // The set of discovered nodes to be evaluated
         const openSet: Set<Tile> = new Set([start]);
 
@@ -21,6 +21,9 @@ namespace Pathfinding {
         // For path reconstruction: map each node to the node it can most efficiently be reached from.
         const cameFrom = new Map<Tile, Tile>();
 
+        let closestTile: Tile = start;
+        let closestDistance = heuristic(closestTile, end);
+
         while (openSet.size > 0) {
             // Get the node in openSet having the lowest fScore
             let current: Tile | null = null;
@@ -34,6 +37,12 @@ namespace Pathfinding {
             }
             if (!current) break;
 
+            const dist = heuristic(current, end);
+            if (closestDistance < dist) {
+                closestTile = current;
+                closestDistance = dist;
+            }
+
             // If we’ve reached the goal, reconstruct and return the path.
             if (current === end) {
                 return reconstructPath(cameFrom, current);
@@ -41,7 +50,7 @@ namespace Pathfinding {
 
             openSet.delete(current);
 
-            if (current !== start && current.items.length > 0) continue;
+            if (current !== start && !forEnemy && current.items.length > 0) continue;
 
             for (const neighbor of current.activeConnections) {
                 // tentative gScore is current’s gScore plus cost to move to neighbor
@@ -60,6 +69,10 @@ namespace Pathfinding {
         }
 
         // Open set is empty but goal was never reached
+        if (forEnemy) {
+            return reconstructPath(cameFrom, closestTile);
+        }
+
         return [];
     }
 

src/games/zombies/player.ts

@@ -35,10 +35,6 @@ export default class Player extends Character {
         return this.type === ItemType.CHAR_NURSE ? 2 : 1;
     }
 
-    get moveBonus() {
-        return this.type === ItemType.CHAR_RUNNER ? 1 : 0;
-    }
-
     get isDead() {
         return this.health <= 0;
     }
@@ -59,6 +55,14 @@ export default class Player extends Character {
         return this.inventory.find(i => i.type === ItemType.WEAPON_ROCKET_LAUNCHER);
     }
 
+    get keys() {
+        return this.inventory.find(i => i.type === ItemType.ITEM_KEYS);
+    }
+
+    get fuel() {
+        return this.inventory.find(i => i.type === ItemType.ITEM_FUEL);
+    }
+
     public heal(player: Player) {
         player.health += this.healingAmount;
     }
@@ -77,11 +81,11 @@ export default class Player extends Character {
         return false;
     }
 
-    public hasItem(item: Item | null | undefined): boolean {
+    public hasItem(item: Item | ItemTypeImage | null | undefined): boolean {
         if (!item) {
             return false;
         }
-        const itemIndex = this.inventory.findIndex(i => i === item);
+        const itemIndex = this.inventory.findIndex(i => i === item || i.type === item);
 
         return itemIndex >= 0;
     }
@@ -97,10 +101,10 @@ export default class Player extends Character {
                 return true;
 
             case SpinnerAction.MELEE:
-                return this.meleeWeapon != null && !this.tile.enemy?.isBoss;
+                return !this.tile.enemy?.isBoss && this.meleeWeapon != null;
 
             case SpinnerAction.SHOOT:
-                return this.removeItem(this.gun) && !this.tile.enemy?.isBoss;
+                return !this.tile.enemy?.isBoss && this.removeItem(this.gun);
         }
     }
 }

src/games/zombies/spinner.ts

@@ -92,12 +92,20 @@ export default class Spinner extends Entity {
     }
 
     public override onClick() {
+        this.spin();
+    }
+
+    public spin() {
         if (!this.fired) return;
 
         this.fired = false;
         this.nextAngle = this.angle + (randInt(5, 10) + Math.random()) * 2 * Math.PI;
     }
 
+    public stop() {
+        this.fired = true;
+    }
+
     public addListener(listener: SpinnerListener) {
         this.listeners.add(listener);
     }

src/games/zombies/tile.ts

@@ -1,7 +1,7 @@
+import type Character from "./character";
 import Entity from "./entity";
 import type Item from "./item";
-
-import planks from './assets/items/planks.jpg';
+import { ItemType } from "./item";
 
 export enum TileType {
     NORMAL,
@@ -46,7 +46,17 @@ export default class Tile extends Entity {
         if (this.items.length > 0) {
             if (this.isOpen) {
                 const item = this.enemy ?? this.items[0];
-                ctx.drawImage(item.type, 0.1, 0.1, 0.8, 0.8);
+
+                if ('displayPosition' in item) {
+                    const character = item as Character;
+                    const [x, y] = character.displayPosition;
+                    const offsetX = (x - this.centerX) / this.width;
+                    const offsetY = (y - this.centerY) / this.height;
+
+                    ctx.drawImage(character.type, offsetX + 0.1, offsetY + 0.1, 0.8, 0.8);
+                } else {
+                    ctx.drawImage(item.type, 0.1, 0.1, 0.8, 0.8);
+                }
 
                 if (this.items.length > 1) {
                     ctx.fillStyle = 'black';
@@ -69,12 +79,12 @@ export default class Tile extends Entity {
                 y += (Number(this.top < doorway.top) - Number(doorway.top < this.top)) * 0.5;
             }
 
-            ctx.drawImage(planks, x - 0.2, y - 0.2, 0.4, 0.4);
+            ctx.drawImage(ItemType.ITEM_PLANKS, x - 0.2, y - 0.2, 0.4, 0.4);
         }
     }
 
-    get enemy() {
-        return this.items.find(i => i.isEnemy);
+    get enemy(): Character | undefined {
+        return this.items.find(i => i.isEnemy) as Character;
     }
 
     get activeConnections() {

src/games/zombies/tilemap.ts

@@ -1,10 +1,11 @@
-import { range, shuffle, zip } from "@common/utils";
+import { enumerate, randInt, range, shuffle, zip } from "@common/utils";
 import Entity from "./entity";
 import Tile, { TileType } from "./tile";
 import Pathfinding from "./pathfinding";
 import Item, { ItemType } from "./item";
 import Player, { Players } from "./player";
-import { SpinnerAction } from "./spinner";
+import Spinner, { SpinnerAction } from "./spinner";
+import Character from "./character";
 
 enum GameState {
     NORMAL,
@@ -20,9 +21,21 @@ export default class TileMap extends Entity {
     private state = GameState.NORMAL;
     private availableTiles: Tile[] = [];
 
-    constructor(position: [number, number], private mapSize: number, private tileSize: number, numPlayers: number = 2) {
+    public keysFound = false;
+    public fuelFound = false;
+    public bossKilled = false;
+    public readonly foundPlayers: Set<Player>;
+
+    constructor(
+        position: [number, number],
+        private mapSize: number,
+        private tileSize: number,
+        private spinner: Spinner,
+        numPlayers: number = 2,
+    ) {
         super(position, [mapSize * tileSize, mapSize * tileSize]);
         this.players = shuffle(Object.values(Players)).slice(0, numPlayers);
+        this.foundPlayers = new Set(this.players);
         this.startTile = this.createMap();
         this.findAvailableTiles();
     }
@@ -159,7 +172,14 @@ export default class TileMap extends Entity {
 
         for (const [type, amount] of itemsMap.entries()) {
             for (const _ in range(amount)) {
-                const item = new Item(type);
+                const Constructor = [
+                    ItemType.ENEMY_BOSS,
+                    ItemType.ENEMY_DOG,
+                    ItemType.ENEMY_SPIDER,
+                    ItemType.ENEMY_ZOMBIE,
+                ].includes(type) ? Character : Item;
+
+                const item = new Constructor(type);
                 items.push(item);
             }
         }
@@ -187,10 +207,16 @@ export default class TileMap extends Entity {
 
         for (const [tile, item] of zip(fillableTiles, shuffle(items))) {
             tile.items.push(item);
-            if (item instanceof Player) {
+            if (item instanceof Character) {
                 item.tile = tile;
             }
-        };
+        }
+
+        for (const tile of this.tiles) {
+            if (tile.items.length === 0) {
+                tile.isOpen = true;
+            }
+        }
     }
 
     get player() {
@@ -206,6 +232,15 @@ export default class TileMap extends Entity {
         ));
     }
 
+    private get enemies() {
+        return this.tiles.filter(
+            (tile) =>
+                tile.isOpen
+                && tile.enemy
+                && tile.items.length === 1
+        )
+    }
+
     public override handleMouseMove(x: number, y: number): void {
         this.activeTiles.forEach(tile => tile.handleMouseMove(x - this.left, y - this.top));
     }
@@ -218,6 +253,7 @@ export default class TileMap extends Entity {
             if (tile.isPointInBounds(x - this.left, y - this.top)) {
                 const path = Pathfinding.findPath(this.player.tile, tile);
                 if (path.length > 1) {
+                    this.spinner.stop();
                     this.player.lastDoor = path.find(t => t.type === TileType.DOOR);
                     this.player.moveTo(tile, path);
                     tile.open();
@@ -230,8 +266,10 @@ export default class TileMap extends Entity {
                         } else if (item instanceof Player) {
                             tile.removeItem(item);
                             this.players.push(item);
+                            this.foundPlayers.add(item);
                         } else if (item.isBoss && this.player.removeItem(this.player.rocketLauncher)) {
                             tile.killEnemy();
+                            this.bossKilled = true;
                         } else if (item.isEnemy) {
                             this.state = GameState.FIGHT;
                             break;
@@ -239,6 +277,14 @@ export default class TileMap extends Entity {
                             alert(`Unknown item found: ${item}`);
                         }
                     }
+                    if (tile.type === TileType.END) {
+                        if (this.player.removeItem(this.player.fuel)) {
+                            this.fuelFound = true;
+                        }
+                        if (this.player.removeItem(this.player.keys)) {
+                            this.keysFound = true;
+                        }
+                    }
                     if (this.state === GameState.NORMAL) {
                         this.nextPlayer();
                     }
@@ -265,6 +311,8 @@ export default class TileMap extends Entity {
                                 this.players.splice(this.currentPlayerIdx, 1);
                                 this.currentPlayerIdx = this.currentPlayerIdx % this.players.length;
                                 this.setNormalState();
+                            } else if (!this.player.grenade) {
+                                this.spinner.spin();
                             }
                             break;
                         case SpinnerAction.MELEE:
@@ -273,8 +321,11 @@ export default class TileMap extends Entity {
                             break;
                         case SpinnerAction.RUN:
                             this.setNormalState();
+                            this.spinner.spin();
                             break;
                     }
+                } else if (!this.player.grenade) {
+                    this.spinner.spin();
                 }
                 break;
         }
@@ -311,7 +362,54 @@ export default class TileMap extends Entity {
     }
 
     private nextPlayer() {
+        this.spinner.stop();
         this.currentPlayerIdx = (this.currentPlayerIdx + 1) % this.players.length;
+        if (this.win) {
+            const endTile = this.tiles.findLast(t => t.type === TileType.END);
+            if (endTile) {
+                for (const player of this.players) {
+                    const path = Pathfinding.findPath(player.tile, endTile);
+                    player.moveTo(endTile, path);
+                }
+            }
+            setTimeout(alert, 2000, "🎉🎉🎉 ПОБЕДА! 🚗 🎉🎉🎉");
+        } else if (this.currentPlayerIdx === 0 && this.players.length < this.foundPlayers.size) { // if someone is dead
+            const enemies = this.enemies;
+
+            loop:
+            for (const enemyTile of shuffle(enemies)) {
+                const moves = Pathfinding.findPossibleMoves(enemyTile, 5);
+
+                for (const move of shuffle(moves)) {
+                    if (move.items.length > 0) continue;
+
+                    for (const [playerIndex, player] of enumerate(this.players)) {
+                        if (player.tile === move) {
+                            const enemy = enemyTile.enemy!;
+                            const allowedSteps = randInt(1, 5) + enemy.moveBonus;
+
+                            console.log({enemy, allowedSteps});
+                            if (allowedSteps <= 0) continue;
+
+                            const path = Pathfinding.findPath(enemyTile, player.tile, true);
+
+                            const targetTile = path[allowedSteps] ?? player.tile;
+
+                            enemyTile.removeItem(enemy);
+                            targetTile.items.push(enemy);
+                            enemy.moveTo(targetTile, path.slice(0, allowedSteps + 1));
+
+                            if (targetTile === player.tile) {
+                                this.state = GameState.FIGHT;
+                                this.currentPlayerIdx = playerIndex;
+                            }
+
+                            break loop;
+                        }
+                    }
+                }
+            }
+        }
     }
 
     private killEnemy() {
@@ -326,6 +424,28 @@ export default class TileMap extends Entity {
         this.setNormalState();
     }
 
+    private get win() {
+        if (!this.keysFound || !this.fuelFound || !this.bossKilled) {
+            return false;
+        }
+        const endTiles = this.tiles.filter(t => t.type === TileType.END);
+        for (const tile of endTiles) {
+            if (tile.items.length !== 0) return false;
+        }
+        for (const player of Object.values(Players)) {
+            if (!this.foundPlayers.has(player)) return false;
+            if (player.isDead) continue;
+
+            if (endTiles.every((tile) => {
+                const path = Pathfinding.findPath(player.tile, tile);
+                return path.length === 0;
+            })) {
+                return false;
+            }
+        }
+        return true;
+    }
+
     protected draw(ctx: CanvasRenderingContext2D): void {
         ctx.scale(1 / this.width, 1 / this.height);
 
@@ -350,9 +470,50 @@ export default class TileMap extends Entity {
         ctx.strokeStyle = 'yellow';
 
         ctx.strokeRect(this.player.tile.centerX - w / 2, this.player.tile.centerY - w / 2, w, w);
+
+        let x = this.width + this.tileSize / 2 + 10;
+        let y = this.height - this.tileSize / 2;
+        for (const player of Object.values(Players)) {
+            this.drawItem(ctx, player.type, x, y, w, this.foundPlayers.has(player));
+            x += this.tileSize;
+        }
+
+        x = this.width + this.tileSize / 2 + 10;
+        y = this.height - 3 * this.tileSize / 2;
+        for (const [item, found] of zip(
+            [ItemType.ITEM_KEYS, ItemType.ITEM_FUEL, ItemType.ENEMY_BOSS],
+            [this.keysFound, this.fuelFound, this.bossKilled],
+        )) {
+            this.drawItem(ctx, item, x, y, w, found);
+            x += this.tileSize;
+        }
+
+        x = this.width + this.tileSize / 2 + 10;
+        y = this.height - 5 * this.tileSize / 2;
+        for (const tile of this.tiles) {
+            if (tile.type !== TileType.END) continue;
+
+            this.drawItem(ctx, ItemType.ENEMY_ZOMBIE, x, y, w, tile.items.length === 0);
+            x += this.tileSize;
+        }
+    }
+
+    private drawItem(
+        ctx: CanvasRenderingContext2D,
+        img: HTMLImageElement,
+        x: number, y: number, w: number,
+        found: boolean,
+    ) {
+        ctx.drawImage(img, x - w / 2, y - w / 2, w, w);
+
+        if (!found) {
+            ctx.fillStyle = `rgba(255, 255, 255, 0.6)`;
+            ctx.fillRect(x - w / 2, y - w / 2, w, w);
+        }
     }
 
     public update(dt: number) {
         this.players.forEach((player) => player.update(dt));
+        this.enemies.forEach((tile) => tile.enemy!.update(dt));
     }
 }