diff --git a/showbits-thermal-printer-ui/public/photo.html b/showbits-thermal-printer-ui/photo.html similarity index 75% rename from showbits-thermal-printer-ui/public/photo.html rename to showbits-thermal-printer-ui/photo.html index 2e2ad6f..06f8b2f 100644 --- a/showbits-thermal-printer-ui/public/photo.html +++ b/showbits-thermal-printer-ui/photo.html @@ -137,39 +137,39 @@ flip.setAttribute("href", `?facing=${facingOpposite}`); } - await initStream(facing); - - async function waitAtLeast(duration, since) { - const now = Date.now(); - const wait = duration - (now - since); - if (wait > 0) { - await new Promise((resolve) => setTimeout(resolve, wait)); - } - } - - button.addEventListener("click", () => { - const canvas = document.createElement("canvas"); - const scale = 384 / video.videoWidth; - canvas.width = video.videoWidth * scale; - canvas.height = video.videoHeight * scale; - canvas - .getContext("2d") - .drawImage(video, 0, 0, canvas.width, canvas.height); - - canvas.toBlob(async (blob) => { - const form = new FormData(); - form.append("image", blob); - form.append("caption", new Date().toLocaleString()); - - const start = Date.now(); - cover.classList.remove("hidden"); - try { - await fetch("api/image", { method: "POST", body: form }); - } catch (e) { - console.error("Error uploading image:", e); + initStream(facing).then(() => { + async function waitAtLeast(duration, since) { + const now = Date.now(); + const wait = duration - (now - since); + if (wait > 0) { + await new Promise((resolve) => setTimeout(resolve, wait)); } - await waitAtLeast(500, start); - cover.classList.add("hidden"); + } + + button.addEventListener("click", () => { + const canvas = document.createElement("canvas"); + const scale = 384 / video.videoWidth; + canvas.width = video.videoWidth * scale; + canvas.height = video.videoHeight * scale; + canvas + .getContext("2d") + .drawImage(video, 0, 0, canvas.width, canvas.height); + + canvas.toBlob(async (blob) => { + const form = new FormData(); + form.append("image", blob); + form.append("caption", new Date().toLocaleString()); + + const start = Date.now(); + cover.classList.remove("hidden"); + try { + await fetch("api/image", { method: "POST", body: form }); + } catch (e) { + console.error("Error uploading image:", e); + } + await waitAtLeast(500, start); + cover.classList.add("hidden"); + }); }); }); diff --git a/showbits-thermal-printer-ui/vite.config.ts b/showbits-thermal-printer-ui/vite.config.ts index 12d2d89..0406bc1 100644 --- a/showbits-thermal-printer-ui/vite.config.ts +++ b/showbits-thermal-printer-ui/vite.config.ts @@ -1,14 +1,25 @@ import vue from "@vitejs/plugin-vue"; -import { fileURLToPath, URL } from "node:url"; +import { dirname, resolve } from "node:path"; +import { fileURLToPath } from "node:url"; import { defineConfig } from "vite"; import vueDevTools from "vite-plugin-vue-devtools"; +const root = dirname(fileURLToPath(import.meta.url)); +function path(to: string): string { + return resolve(root, to); +} + // https://vite.dev/config/ export default defineConfig({ plugins: [vue(), vueDevTools()], base: "", + build: { + rollupOptions: { + input: [path("index.html"), path("photo.html")], + }, + }, resolve: { - alias: { "@": fileURLToPath(new URL("./src", import.meta.url)) }, + alias: { "@": path("src") }, }, server: { proxy: { "/api": "http://localhost:8080" },