feat: split diarization UI into separate project folder

2026-03-21 13:14:54 +01:00
commit 66d681279e
6 changed files with 97 additions and 0 deletions
--- a/index.html.template
+++ b/index.html.template
@@ -0,0 +1,50 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>Diarization + Whisper UI</title>
+  <style>
+    body { font-family: Arial, sans-serif; max-width: 980px; margin: 24px auto; padding: 0 12px; }
+    .row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
+    input[type=file] { padding:6px; }
+    button { padding:8px 14px; cursor:pointer; }
+    pre { white-space: pre-wrap; background:#111; color:#0f0; padding:12px; min-height:220px; border-radius:8px; }
+    .muted { color:#666; font-size:13px; }
+  </style>
+</head>
+<body>
+  <h2>Whisper + Sprechertrennung</h2>
+  <p class="muted">API: <span id="api"></span></p>
+  <div class="row">
+    <input id="f" type="file" accept="audio/*" />
+    <button onclick="go()">Verarbeiten</button>
+  </div>
+  <pre id="out"></pre>
+
+  <script>
+    const API_BASE = "__API_BASE__";
+    document.getElementById("api").textContent = API_BASE;
+
+    async function go() {
+      const fi = document.getElementById('f');
+      if (!fi.files.length) { alert('Bitte Datei wählen'); return; }
+      const fd = new FormData();
+      fd.append('file', fi.files[0]);
+      const out = document.getElementById('out');
+      out.textContent = 'Läuft...';
+      try {
+        const r = await fetch(`${API_BASE}/transcribe-diarize`, { method: 'POST', body: fd });
+        const j = await r.json();
+        if (!r.ok) {
+          out.textContent = `Fehler (${r.status}):\n` + JSON.stringify(j, null, 2);
+          return;
+        }
+        out.textContent = j.formatted_text || JSON.stringify(j, null, 2);
+      } catch (e) {
+        out.textContent = `Netzwerkfehler: ${e}`;
+      }
+    }
+  </script>
+</body>
+</html>