Spaces:
Running
Running
| // ===== util ===== | |
| const toastEl = document.getElementById("toast"); | |
| function toast(msg){ | |
| toastEl.hidden = false; | |
| toastEl.textContent = msg; | |
| clearTimeout(toast._t); | |
| toast._t = setTimeout(()=>toastEl.hidden=true, 1400); | |
| } | |
| // ===== éléments ===== | |
| const promptInput = document.getElementById("promptInput"); | |
| const generateBtn = document.getElementById("generateBtn"); | |
| const micBtn = document.getElementById("micBtn"); | |
| const codeOutput = document.getElementById("codeOutput"); | |
| const copyBtn = document.getElementById("copyBtn"); | |
| const clearBtn = document.getElementById("clearBtn"); | |
| const colRight = document.getElementById("colRight"); | |
| const appTitle = document.getElementById("appTitle"); | |
| const appSubtitle = document.getElementById("appSubtitle"); | |
| const stage = document.getElementById("stage"); | |
| // ===== générateur de code (temporaire) ===== | |
| function fakeGenerate(prompt){ | |
| const p = (prompt || "").trim(); | |
| if(!p) return "// Écris une demande puis clique sur Générer ✨"; | |
| return `// ✅ Demande reçue : ${p} | |
| function main() { | |
| console.log("Hello Espace Codage!"); | |
| } | |
| main();`; | |
| } | |
| // ===== Rosalinda helpers ===== | |
| async function rosalindaGenerateImage(prompt) { | |
| const r = await fetch("http://localhost:3001/api/image", { | |
| method: "POST", | |
| headers: {"Content-Type":"application/json"}, | |
| body: JSON.stringify({ prompt, steps: 24 }) | |
| }); | |
| const data = await r.json(); | |
| if (!data.ok) throw new Error(data.error || "Erreur Rosalinda"); | |
| stage.innerHTML = ` | |
| <div style="font-weight:800;margin-bottom:10px;">Rosalinda — Image</div> | |
| <img src="${data.url}" style="width:100%;border-radius:14px;border:1px solid #1f2a44;" /> | |
| `; | |
| } | |
| async function rosalindaGenerateVideo(prompt) { | |
| const r = await fetch("http://localhost:3001/api/video", { | |
| method: "POST", | |
| headers: {"Content-Type":"application/json"}, | |
| body: JSON.stringify({ prompt }) | |
| }); | |
| const data = await r.json(); | |
| if (!data.ok) throw new Error(data.error || "Erreur Rosalinda"); | |
| stage.innerHTML = ` | |
| <div style="font-weight:800;margin-bottom:10px;">Rosalinda — Vidéo</div> | |
| <video src="${data.url}" controls style="width:100%;border-radius:14px;border:1px solid #1f2a44;"></video> | |
| `; | |
| } | |
| // ===== moteur de consignes UI (simple et efficace) ===== | |
| function isUiCommand(text){ | |
| const t = (text||"").toLowerCase(); | |
| return ["colonne","cache","affiche","vide","titre","sous-titre","espace codage"].some(k=>t.includes(k)); | |
| } | |
| function applyUiCommand(text){ | |
| const raw = text || ""; | |
| const t = raw.toLowerCase(); | |
| if(t.includes("cache") && (t.includes("colonne 3") || t.includes("colonne trois") || t.includes("droite"))){ | |
| colRight.style.display = "none"; | |
| toast("✅ Colonne 3 masquée"); | |
| return true; | |
| } | |
| if((t.includes("affiche") || t.includes("montre")) && (t.includes("colonne 3") || t.includes("droite"))){ | |
| colRight.style.display = ""; | |
| toast("✅ Colonne 3 affichée"); | |
| return true; | |
| } | |
| if(t.includes("colonne 3") && t.includes("vide")){ | |
| colRight.innerHTML = ""; | |
| colRight.style.display = ""; | |
| toast("✅ Colonne 3 vidée"); | |
| return true; | |
| } | |
| // Titre: ... | |
| const mTitle = raw.match(/(?:titre|nom)\s*[:=]\s*(.+)$/i); | |
| if(mTitle){ | |
| appTitle.textContent = mTitle[1].trim(); | |
| toast("✅ Titre mis à jour"); | |
| return true; | |
| } | |
| // Sous-titre: ... | |
| const mSub = raw.match(/(?:sous[-\s]?titre|description)\s*[:=]\s*(.+)$/i); | |
| if(mSub){ | |
| appSubtitle.textContent = mSub[1].trim(); | |
| toast("✅ Sous-titre mis à jour"); | |
| return true; | |
| } | |
| toast("ℹ️ Consigne non reconnue"); | |
| return false; | |
| } | |
| // ===== actions ===== | |
| generateBtn.addEventListener("click", ()=>{ | |
| const text = promptInput.value; | |
| if(isUiCommand(text)){ | |
| if(applyUiCommand(text)) return; | |
| } | |
| // Example: si tu écris "image: ..." -> image | |
| if (text.toLowerCase().startsWith("image:")) { | |
| rosalindaGenerateImage(text.slice(6).trim()).catch(err => { | |
| console.error(err); | |
| toast("❌ " + (err.message || "Erreur image")); | |
| }); | |
| return; | |
| } | |
| // Example: si tu écris "video: ..." -> video | |
| if (text.toLowerCase().startsWith("video:")) { | |
| rosalindaGenerateVideo(text.slice(6).trim()).catch(err => { | |
| console.error(err); | |
| toast("❌ " + (err.message || "Erreur vidéo")); | |
| }); | |
| return; | |
| } | |
| codeOutput.textContent = fakeGenerate(text); | |
| }); | |
| document.querySelectorAll(".chip").forEach(btn=>{ | |
| btn.addEventListener("click", ()=>{ | |
| const p = btn.dataset.prompt || ""; | |
| promptInput.value = p; | |
| codeOutput.textContent = fakeGenerate(p); | |
| }); | |
| }); | |
| copyBtn.addEventListener("click", async ()=>{ | |
| try{ | |
| await navigator.clipboard.writeText(codeOutput.textContent); | |
| toast("✅ Copié"); | |
| }catch{ | |
| alert("Copie impossible automatiquement."); | |
| } | |
| }); | |
| clearBtn.addEventListener("click", ()=>{ | |
| promptInput.value = ""; | |
| codeOutput.textContent = "// Le code généré apparaîtra ici…"; | |
| toast("✅ Effacé"); | |
| }); | |
| // Micro (si dispo) | |
| let recognition = null; | |
| if ("webkitSpeechRecognition" in window || "SpeechRecognition" in window) { | |
| const SR = window.SpeechRecognition || window.webkitSpeechRecognition; | |
| recognition = new SR(); | |
| recognition.lang = "fr-FR"; | |
| recognition.interimResults = true; | |
| recognition.onresult = (event) => { | |
| let transcript = ""; | |
| for (let i = event.resultIndex; i < event.results.length; i++) { | |
| transcript += event.results[i][0].transcript; | |
| } | |
| promptInput.value = transcript.trim(); | |
| }; | |
| } | |
| micBtn.addEventListener("click", ()=>{ | |
| if(!recognition){ alert("Micro non disponible sur ce navigateur."); return; } | |
| try{ recognition.start(); }catch{} | |
| }); | |
| // ✅ preuve que le JS charge | |
| toast("✅ Espace Codage prêt"); |