import { Elysia } from "elysia";
import pug from "pug";
import { join } from "path";

// Phase 1: a barebones Leaflet 2D viewer (see public/js/map.js). Phase 2 adds the Babylon 3D
// viewer (see public/js/mesh.js). Chat box, marker tool, and admin panel land in later phases.
const renderIndex = pug.compileFile(join(import.meta.dir, "views/index.pug"));
const renderScene3d = pug.compileFile(join(import.meta.dir, "views/scene3d.pug"));

const app = new Elysia()
  .get("/", () => new Response(renderIndex({}), { headers: { "Content-Type": "text/html" } }))
  .get("/3d", () => new Response(renderScene3d({}), { headers: { "Content-Type": "text/html" } }))
  .get("/health", () => ({ status: "ok" }))
  .get("/css/tailwind.css", () => Bun.file(join(import.meta.dir, "public/css/tailwind.css")))
  .get("/js/map.js", () => Bun.file(join(import.meta.dir, "public/js/map.js")))
  .get("/js/coords.js", () => Bun.file(join(import.meta.dir, "public/js/coords.js")))
  .get("/js/colors.js", () => Bun.file(join(import.meta.dir, "public/js/colors.js")))
  .get("/js/mesh.js", () => Bun.file(join(import.meta.dir, "public/js/mesh.js")))
  .get("/js/mesh-format.js", () => Bun.file(join(import.meta.dir, "public/js/mesh-format.js")))
  .listen(Number(process.env.PORT ?? 3001));

console.log(`[frontend] listening on :${app.server?.port}`);