() => { function watchOutputs() { const resultContainer = document.getElementById('gradio-result'); const outBody = document.getElementById('output-image-container'); const outPh = document.getElementById('output-placeholder'); const dlBtn = document.getElementById('dl-btn-output'); if (!resultContainer || !outBody) { setTimeout(watchOutputs, 500); return; } if (dlBtn) { dlBtn.addEventListener('click', (e) => { e.stopPropagation(); const img = outBody.querySelector('img.modern-out-img'); if (img && img.src) { const a = document.createElement('a'); a.href = img.src; a.download = 'firered_output.png'; document.body.appendChild(a); a.click(); document.body.removeChild(a); } }); } function syncImage() { const resultImg = resultContainer.querySelector('img'); if (resultImg && resultImg.src) { if (outPh) outPh.style.display = 'none'; let existing = outBody.querySelector('img.modern-out-img'); if (!existing) { existing = document.createElement('img'); existing.className = 'modern-out-img'; outBody.appendChild(existing); } if (existing.src !== resultImg.src) { existing.src = resultImg.src; if (dlBtn) dlBtn.classList.add('visible'); if (window.__hideLoader) window.__hideLoader(); } } } const observer = new MutationObserver(syncImage); observer.observe(resultContainer, {childList:true, subtree:true, attributes:true, attributeFilter:['src']}); setInterval(syncImage, 800); } watchOutputs(); function watchSeed() { const seedContainer = document.getElementById('gradio-seed'); const seedSlider = document.getElementById('custom-seed'); const seedVal = document.getElementById('custom-seed-val'); if (!seedContainer || !seedSlider) { setTimeout(watchSeed, 500); return; } function sync() { const el = seedContainer.querySelector('input[type="range"],input[type="number"]'); if (el && el.value) { seedSlider.value = el.value; if (seedVal) seedVal.textContent = el.value; } } const obs = new MutationObserver(sync); obs.observe(seedContainer, {childList:true, subtree:true, attributes:true, attributeFilter:['value']}); setInterval(sync, 1000); } watchSeed(); function watchExampleResults() { const container = document.getElementById('example-result-data'); if (!container) { setTimeout(watchExampleResults, 500); return; } let lastProcessed = ''; function checkResult() { const el = container.querySelector('textarea') || container.querySelector('input'); if (!el) return; const val = el.value; if (!val || val === lastProcessed || val.length < 20) return; try { const data = JSON.parse(val); if (data.status === 'ok' && data.images && data.images.length > 0) { lastProcessed = val; if (window.__clearAll) window.__clearAll(); if (window.__setPrompt && data.prompt) window.__setPrompt(data.prompt); data.images.forEach((b64, i) => { if (b64 && window.__addImage) { const name = (data.names && data.names[i]) ? data.names[i] : ('example_' + (i+1) + '.jpg'); window.__addImage(b64, name); } }); document.querySelectorAll('.example-card.loading').forEach(c => c.classList.remove('loading')); if (window.__showToast) window.__showToast('Example loaded — ' + data.images.length + ' image(s)', 'info'); } else if (data.status === 'error') { document.querySelectorAll('.example-card.loading').forEach(c => c.classList.remove('loading')); if (window.__showToast) window.__showToast('Could not load example images', 'error'); } } catch(e) { console.error('Example parse error:', e); } } const obs = new MutationObserver(checkResult); obs.observe(container, {childList:true, subtree:true, characterData:true, attributes:true}); setInterval(checkResult, 500); } watchExampleResults(); }