import { Entity, EntityNames } from ".";
import {
  BoundingBox,
  Colliding,
  ComponentNames,
  Grid,
  Highlight,
  Interactable,
  Modal,
  Sprite,
} from "../components";
import { IMAGES, SPRITE_SPECS, SpriteSpec, Sprites } from "../config";
import { Coord2D } from "../interfaces";

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

  constructor(
    private readonly text: string,
    gridPosition: Coord2D,
  ) {
    super(EntityNames.Sign);

    const dimension = {
      width: Sign.spriteSpec.width,
      height: Sign.spriteSpec.height,
    };

    this.addComponent(
      new Sprite(
        IMAGES.get(Sign.spriteSpec.sheet)!,
        { x: 0, y: 0 },
        dimension,
        Sign.spriteSpec.msPerFrame,
        Sign.spriteSpec.frames,
      ),
    );

    this.addComponent(
      new BoundingBox(
        {
          x: 0,
          y: 0,
        },
        dimension,
        0,
      ),
    );

    this.addComponent(new Grid(gridPosition));

    this.addComponent(new Colliding());

    this.addComponent(
      new Highlight(this.onHighlight.bind(this), this.onUnhighlight.bind(this)),
    );
  }

  private onHighlight() {
    this.addComponent(new Interactable(this.interaction.bind(this)));
  }

  private onUnhighlight() {
    this.removeComponent(ComponentNames.Modal);
    this.removeComponent(ComponentNames.Interactable);
  }

  private interaction() {
    if (this.hasComponent(ComponentNames.Modal)) {
      this.removeComponent(ComponentNames.Modal);
      return;
    }
    this.addComponent(
      new Modal({
        type: "CONTENT",
        contentInit: {
          content: `<p>${this.text}</p>`,
        },
      }),
    );
  }
}