diff --git a/templates/index.html b/templates/index.html index 3c026d3..49808d4 100644 --- a/templates/index.html +++ b/templates/index.html @@ -449,7 +449,6 @@ - @@ -636,7 +635,6 @@ const liveBadge = $("#live-badge"); const liveSpinner = $("#live-spinner"); const liveResult = $("#live-result"); - const liveVideo = $("#live-video"); const liveDownloadBtn = $("#live-download"); const livePreviewBtn = $("#live-preview"); @@ -672,9 +670,12 @@ livePreviewBtn.style.display = "inline-block"; liveDownloadBtn.onclick = () => window.open(`/api/download/${jobId}`); livePreviewBtn.onclick = () => { - liveVideo.src = `/api/preview/${jobId}`; - liveVideo.classList.remove("hidden"); - liveVideo.play(); + // Uporabi modal namesto inline video, da ne pokvari layout-a in + // ne blokira gumbov na desni strani (jobs list). + // Izvleci title iz job-a v jobs listu če obstaja + const jobCard = document.querySelector(`.job[data-id="${jobId}"]`); + const title = jobCard?.dataset.title || ""; + previewJob(jobId, title); }; } @@ -696,8 +697,6 @@ liveResult.classList.add("hidden"); liveDownloadBtn.style.display = "none"; livePreviewBtn.style.display = "none"; - liveVideo.classList.add("hidden"); - liveVideo.src = ""; } // Stage label mapping (server step → friendly slo + percent estimate) @@ -907,12 +906,14 @@ const el = document.createElement("div"); el.className = "job"; el.id = `job-${job.id}`; + el.dataset.id = job.id; const title = job.source_type === "youtube" ? (job.youtube_url || "YouTube") : (job.parsed_artist && job.parsed_title ? `${job.parsed_artist} — ${job.parsed_title}` : (job.filename || job.id)); + el.dataset.title = title; const sizeStr = job.output_size_mb ? `${job.output_size_mb} MB` : job.size_mb ? `${job.size_mb} MB` : "";