mirror of
https://github.com/Jeuners/astra-vision.git
synced 2026-09-09 15:02:35 +02:00
fix: show uploaded images inline instead of just the filename
Bilder wurden bisher nur als Textzeile "Hochgeladen: X" bestätigt, nie tatsächlich angezeigt. Zeigt jetzt sofort beim Auswählen eine lokale Vorschau im Transkript (data:-URL, passt bereits in die bestehende img-src-CSP), bevor der Upload überhaupt beim Server ankommt. Verifiziert per echtem Playwright-Browsertest inkl. fake mic/WebRTC: Bild landet als <img> im Transkript, keine Konsolenfehler. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01LVgSHNHdRx3UNTBodFmhRA
This commit is contained in:
parent
16786fd3fd
commit
9dcfa7d9f5
1 changed files with 27 additions and 0 deletions
27
web/app.js
27
web/app.js
|
|
@ -61,6 +61,29 @@ function addUploadNote(filename) {
|
|||
$("messages").append(article);
|
||||
$("messages").scrollTop = $("messages").scrollHeight;
|
||||
}
|
||||
function addUploadedImage(dataUrl, filename) {
|
||||
$("messages").querySelector(".empty")?.remove();
|
||||
const article = document.createElement("article");
|
||||
article.className = "message user";
|
||||
const speaker = document.createElement("span");
|
||||
speaker.className = "speaker";
|
||||
speaker.textContent = "Du";
|
||||
const img = document.createElement("img");
|
||||
img.className = "generated-image";
|
||||
img.src = dataUrl;
|
||||
img.alt = filename;
|
||||
article.append(speaker, img);
|
||||
$("messages").append(article);
|
||||
$("messages").scrollTop = $("messages").scrollHeight;
|
||||
}
|
||||
function fileToDataURL(file) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const reader = new FileReader();
|
||||
reader.onload = () => resolve(reader.result);
|
||||
reader.onerror = () => reject(reader.error);
|
||||
reader.readAsDataURL(file);
|
||||
});
|
||||
}
|
||||
function receive(event) {
|
||||
let message;
|
||||
try { message = JSON.parse(event.data); } catch { return; }
|
||||
|
|
@ -76,6 +99,10 @@ function receive(event) {
|
|||
}
|
||||
async function uploadFile(file) {
|
||||
if (!pcId) return;
|
||||
if (file.type.startsWith("image/")) {
|
||||
try { addUploadedImage(await fileToDataURL(file), file.name); }
|
||||
catch { /* preview failed to render; upload still proceeds below */ }
|
||||
}
|
||||
const body = new FormData();
|
||||
body.append("pc_id", pcId);
|
||||
body.append("file", file);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue