the-abstraction-engine/src/engine/entities/Player.ts

import { Entity, EntityNames } from ".";
import { IMAGES, SPRITE_SPECS, Sprites, type SpriteSpec } from "../config";
import {
  FacingDirection,
  Sprite,
  GridPosition,
  BoundingBox,
  Control,
} from "../components";
import { Direction } from "../interfaces/";

export class Player extends Entity {
  private static spriteSpec: SpriteSpec = SPRITE_SPECS.get(
    Sprites.PLAYER,
  ) as SpriteSpec;

  constructor() {
    super(EntityNames.Player);

    this.addComponent(
      new BoundingBox(
        {
          x: 200,
          y: 200,
        },
        { width: Player.spriteSpec.width, height: Player.spriteSpec.height },
        0,
      ),
    );

    this.addComponent(new Control());

    this.addComponent(new GridPosition(0, 0));
    this.addFacingDirectionComponents();
  }

  private addFacingDirectionComponents() {
    const facingDirectionComponent = new FacingDirection();
    [
      Direction.NONE,
      Direction.LEFT,
      Direction.RIGHT,
      Direction.UP,
      Direction.DOWN,
    ].forEach((direction) => {
      const sprite = new Sprite(
        IMAGES.get(Player.spriteSpec.states!.get(direction)!.sheet!)!,
        { x: 0, y: 0 },
        { width: Player.spriteSpec.width, height: Player.spriteSpec.height },
        Player.spriteSpec.msPerFrame,
        Player.spriteSpec.frames,
      );
      facingDirectionComponent.directionSprites.set(direction, sprite);
    });

    this.addComponent(facingDirectionComponent);
    this.addComponent(
      facingDirectionComponent.directionSprites.get(Direction.NONE)!,
    ); // face no direction by default
  }
}