Build photo.html with vite

showbits-thermal-printer-ui/photo.html

@@ -137,39 +137,39 @@
         flip.setAttribute("href", `?facing=${facingOpposite}`);
       }
 
-      await initStream(facing);
+      initStream(facing).then(() => {
-
+        async function waitAtLeast(duration, since) {
-      async function waitAtLeast(duration, since) {
+          const now = Date.now();
-        const now = Date.now();
+          const wait = duration - (now - since);
-        const wait = duration - (now - since);
+          if (wait > 0) {
-        if (wait > 0) {
+            await new Promise((resolve) => setTimeout(resolve, wait));
-          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);
           }
-          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");
+          });
         });
       });
     </script>

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" },