Use arrow keys to move the collector

Pokemon Game

This is a simple game where the collector has to capture creatures.

How to play

Use arrow keys to move the collector. The collector can capture by clicking on the capture button.

Rules

The collector can't move outside the board. The collector can't capture a creature that is not in the same cell.The collector can't capture a creature that is not in the 10x10 range.

import type Collector from "./Collector";
import type Creature from "./Creature";
class Cell {
  public x: number;
  public y: number;
  public occupied: boolean = false;
  public occupant: Creature | Collector | null = null;

  constructor(x: number, y: number) {
    this.x = x;
    this.y = y;
  }

  public occupy(occupant: Creature | Collector) {
    this.occupied = true;
    this.occupant = occupant;
  }

  public unoccupy() {
    this.occupied = false;
    this.occupant = null;
  }

  public isOccupied() {
    return this.occupied;
  }

  public isFree() {
    return !this.occupied;
  }
}

export default Cell;

And Board:

import Cell from "./Cell";
class Board {
  private boardSize = 20;
  private cells: Cell[][] = [];

  constructor() {
    for (let i = 0; i < this.boardSize; i++) {
      this.cells[i] = [];
      for (let j = 0; j < this.boardSize; j++) {
        this.cells[i][j] = new Cell(i, j);
      }
    }
  }

  public getCell(x: number, y: number) {
    if (x < 0 || x >= this.boardSize || y < 0 || y >= this.boardSize) {
      return null;
    }
    return this.cells[x][y];
  }

  public getCells() {
    return this.cells;
  }

  public getBoardSize() {
    return this.boardSize;
  }
}

export default Board;

import type Board from "./Board";
import Creature from "./Creature";

class Collector {
  public name: string = "👤";
  public x: number;
  public y: number;
  private inventory: Creature[] = [];
  private board: Board;

  constructor(board: Board, x: number, y: number) {
    this.x = x;
    this.y = y;
    this.board = board;
    board.getCell(x, y)?.occupy(this);
  }

  public setPosition(x: number, y: number) {
    this.x = x;
    this.y = y;
  }

  public getPosition() {
    return { x: this.x, y: this.y };
  }

  public getName() {
    return this.name;
  }

  public findNearestCreature() {
    let nearestCreature = null;
    let nearestDistance = Infinity;
    for (let i = this.x - 5; i <= this.x + 5; i++) {
      for (let j = this.y - 5; j <= this.y + 5; j++) {
        const cell = this.board.getCell(i, j);
        if (cell && cell.occupied && cell.occupant instanceof Creature) {
          const distance = Math.abs(this.x - i) + Math.abs(this.y - j);
          if (distance < nearestDistance) {
            nearestCreature = cell.occupant;
            nearestDistance = distance;
          }
        }
      }
    }
    return nearestCreature;
  }

  public searchAndCapture() {
    const creature = this.findNearestCreature();
    if (creature) {
      const creatureCell = this.board.getCell(creature.x, creature.y);
      const collectorCell = this.board.getCell(this.x, this.y);
      if (creatureCell) {
        this.inventory.push(creature);
        collectorCell?.unoccupy();
        this.setPosition(creature.x, creature.y);
        creature.capture();
        creatureCell.occupy(this);
      }
      return true;
    }
    return false;
  }

  public canIMove(newPosition: { x: number; y: number }) {
    const cell = this.board.getCell(newPosition.x, newPosition.y);
    return cell?.isFree();
  }

  public move(direction: string) {
    let newPosition = { x: this.x, y: this.y };
    switch (direction) {
      case "up":
        newPosition.y++;
        break;
      case "down":
        newPosition.y--;
        break;
      case "left":
        newPosition.x--;
        break;
      case "right":
        newPosition.x++;
        break;
    }
    if (this.canIMove(newPosition)) {
      this.board.getCell(this.x, this.y)?.unoccupy();
      this.setPosition(newPosition.x, newPosition.y);
      this.board.getCell(newPosition.x, newPosition.y)?.occupy(this);
    }
  }
}

export default Collector;

And Finally Creature:

enum Ability {
  FLY = "fly",
  SWIM = "swim",
  WALK = "walk",
}

class Creature {
  public ability: Ability;
  public x: number;
  public y: number;
  public name: string;
  public captured: boolean = false;

  constructor(name: string, x: number, y: number, ability: Ability) {
    this.name = name;
    this.ability = ability;
    this.x = x;
    this.y = y;
  }
  setX(x: number) {
    this.x = x;
  }

  setY(y: number) {
    this.y = y;
  }
  getX() {
    return this.x;
  }
  getY() {
    return this.y;
  }
  getName() {
    return this.name;
  }
  getAbility() {
    return this.ability;
  }
  public capture() {
    this.captured = true;
  }
}

class Bird extends Creature {
  constructor(x: number, y: number) {
    super("🐦", x, y, Ability.FLY);
  }
}

class Fish extends Creature {
  constructor(x: number, y: number) {
    super("🐟", x, y, Ability.SWIM);
  }
}
class Dog extends Creature {
  constructor(x: number, y: number) {
    super("🐕", x, y, Ability.WALK);
  }
}

export default Creature;
export { Bird, Fish, Dog };
export { Ability };