const fields = ["scene", "motion", "camera", "duration", "sound"].map((id) => document.getElementById(id));
const output = document.getElementById("prompt-output");
const status = document.getElementById("copy-status");
const imageInput = document.getElementById("image-input");
const preview = document.getElementById("image-preview");
const dropCopy = document.getElementById("drop-copy");
const clearImage = document.getElementById("clear-image");

function values() { return { scene: fields[0].value.trim(), motion: fields[1].value.trim(), camera: fields[2].value, duration: fields[3].value, sound: fields[4].value.trim() }; }
function buildPrompt() {
  const v = values();
  if (!v.scene && !v.motion && !v.sound) return "Start describing your scene to build a prompt.";
  const parts = [];
  if (v.scene) parts.push(`Opening frame: ${v.scene}`);
  if (v.motion) parts.push(`Action sequence: ${v.motion}`);
  parts.push(`Camera: ${v.camera.toLowerCase()} over approximately ${v.duration}.`);
  if (v.sound) parts.push(`Audio: ${v.sound}`);
  parts.push("Natural motion, stable composition, coherent anatomy, cinematic detail. No timestamps. Plain English scene direction.");
  return parts.join("\n\n");
}
function refresh() { output.textContent = buildPrompt(); status.textContent = ""; }
fields.forEach((field) => field.addEventListener("input", refresh));
fields.slice(2).forEach((field) => field.addEventListener("change", refresh));

document.querySelectorAll("[data-preset]").forEach((button) => button.addEventListener("click", () => {
  const presets = {
    cinematic: ["A close portrait of a traveler in a red coat on a misty coastal path at dawn.", "They turn toward the ocean, take two slow steps forward, and the coat moves naturally in the sea breeze.", "Soft surf and distant gulls."],
    nature: ["A bright orange monarch butterfly rests on a purple flower in a sunlit meadow.", "The butterfly opens and closes its wings, then lifts off as surrounding wildflowers sway in a light breeze.", "Gentle wind through grass and faint birdsong."],
    product: ["A handcrafted ceramic cup sits on a pale stone table in warm window light.", "The camera makes a slow orbit as a hand gently rotates the cup, revealing its glaze and texture.", "Quiet room tone and a soft ceramic touch."],
  };
  const p = presets[button.dataset.preset];
  fields[0].value = p[0]; fields[1].value = p[1]; fields[4].value = p[2]; refresh();
}));
imageInput.addEventListener("change", () => { const file = imageInput.files[0]; if (!file) return; preview.src = URL.createObjectURL(file); preview.hidden = false; dropCopy.hidden = true; clearImage.hidden = false; });
clearImage.addEventListener("click", () => { imageInput.value = ""; preview.removeAttribute("src"); preview.hidden = true; dropCopy.hidden = false; clearImage.hidden = true; });
document.getElementById("copy-prompt").addEventListener("click", async () => { try { await navigator.clipboard.writeText(buildPrompt()); status.textContent = "Prompt copied."; } catch { status.textContent = "Copy unavailable — select the text above."; } });
document.getElementById("download-pack").addEventListener("click", () => { const pack = { model: "TenStrip/LTX2.3-10Eros", generated_at: new Date().toISOString(), input_image_selected: Boolean(imageInput.files[0]), settings: values(), prompt: buildPrompt() }; const link = document.createElement("a"); link.href = URL.createObjectURL(new Blob([JSON.stringify(pack, null, 2)], { type: "application/json" })); link.download = "10eros-prompt-pack.json"; link.click(); URL.revokeObjectURL(link.href); status.textContent = "Prompt pack downloaded."; });