diff --git a/web_app/static/index.html b/web_app/static/index.html index 0d56371..0c737c4 100644 --- a/web_app/static/index.html +++ b/web_app/static/index.html @@ -143,10 +143,6 @@

Poster

- diff --git a/web_app/static/script.js b/web_app/static/script.js index 441a4ed..cae300d 100644 --- a/web_app/static/script.js +++ b/web_app/static/script.js @@ -20,7 +20,6 @@ const startLineInput = document.getElementById('startLine'); const endLineInput = document.getElementById('endLine'); const themeInput = document.getElementById('themeInput'); const fontInput = document.getElementById('fontInput'); -const loadingOverlay = document.getElementById('loadingOverlay'); let currentMetadata = null; let searchDebounceTimer = null; @@ -613,7 +612,8 @@ function handleLyricLineClick(lineNumber) { async function generatePoster() { if (!currentMetadata) return; - loadingOverlay.style.display = 'flex'; + generateBtn.disabled = true; + generateBtn.textContent = 'Generating...'; const indexingToggle = document.getElementById('indexingToggle'); const accentToggle = document.getElementById('accentToggle'); @@ -628,15 +628,15 @@ async function generatePoster() { }; if (payload.type === 'track') { - // Lyrics Logic (Same as before) const startVal = parseInt(startLineInput.value) || 1; const endVal = parseInt(endLineInput.value) || 1; const start = startVal - 1; const end = endVal; if (isNaN(start) || isNaN(end) || start >= end) { - loadingOverlay.style.display = 'none'; showToast("Please enter a valid range (Start must be less than End).", "error"); + generateBtn.disabled = false; + generateBtn.textContent = 'Generate Poster'; return; } @@ -644,7 +644,6 @@ async function generatePoster() { payload.lyrics_end = end; } else { - // Album Logic payload.indexing = indexingToggle ? indexingToggle.checked : false; } @@ -669,13 +668,20 @@ async function generatePoster() { posterContainer.innerHTML = ''; posterContainer.appendChild(img); showDownloadButton(imageUrl, data.filename); - loadingOverlay.style.display = 'none'; + generateBtn.disabled = false; + generateBtn.textContent = 'Generate Poster'; + }; + img.onerror = () => { + showToast("Error: Failed to load the generated poster image.", "error"); + generateBtn.disabled = false; + generateBtn.textContent = 'Generate Poster'; }; } catch (error) { console.error("Generation failed", error); showToast(`Error: ${error.message}`, "error"); - loadingOverlay.style.display = 'none'; + generateBtn.disabled = false; + generateBtn.textContent = 'Generate Poster'; } }