import $ from "jquery";
import { Vec2 } from "./vector";
import { EventType, type SetControllableEvent, type Event } from "./event";
import { MouseController } from "./mouse_controller";

$(document).ready(async () => {
  const session_id = await fetch("/assign", {
    credentials: "include",
  })
    .then((res) => res.json())
    .then(({ session }) => session);

  const controllable_entities = new Set<string>();
  const control_callback = (movement: Vec2) => {
    for (const id of controllable_entities) {
      const message = JSON.stringify({
        event_type: EventType.ENTITY_POSITION_UPDATE,
        data: { id, position: movement },
      });
      ws.send(message);
    }
  };
  const mouse_controller = new MouseController(control_callback);
  $(document).on("mousemove", (event) => {
    mouse_controller.move(event.clientX, event.clientY);
  });
  mouse_controller.start();

  const ws = new WebSocket("/ws");
  await new Promise<void>((resolve) => {
    ws.onopen = () => {
      console.log("connected");
      resolve();
    };
  });
  ws.onmessage = ({ data }) => {
    const [event_type, event_data] = JSON.parse(data);
    const message = { event_type, data: event_data } as Event;

    console.log("Received message", message);
    if (message.event_type === EventType.SET_CONTROLLABLE) {
      const event = message as SetControllableEvent;
      if (event.data.client_id === session_id) {
        controllable_entities.add(event.data.id);
      }
    }
  };
  ws.onclose = () => {
    controllable_entities.clear();
  };
});