Align checkbox with buttons, move status below, add download button
This commit is contained in:
@@ -117,13 +117,14 @@
|
|||||||
<button class="btn btn-secondary" id="gen-only-btn" onclick="generateOnly()" style="display:none;">
|
<button class="btn btn-secondary" id="gen-only-btn" onclick="generateOnly()" style="display:none;">
|
||||||
<span id="gen-spinner" class="spin" style="display:none;"></span> Generate Only
|
<span id="gen-spinner" class="spin" style="display:none;"></span> Generate Only
|
||||||
</button>
|
</button>
|
||||||
<label style="display:inline-flex;align-items:center;gap:0.3rem;margin-left:0.75rem;cursor:pointer;">
|
<label style="display:inline-flex;align-items:center;gap:0.3rem;cursor:pointer;">
|
||||||
<input type="checkbox" id="post-to-discord" checked> <span class="muted" style="font-size:0.85rem;">Post to Discord</span>
|
<input type="checkbox" id="post-to-discord" checked> <span class="muted" style="font-size:0.85rem;">Post to Discord</span>
|
||||||
</label>
|
</label>
|
||||||
<span id="tts-status" class="muted"></span>
|
|
||||||
</div>
|
</div>
|
||||||
<div id="tts-result" style="margin-top:0.75rem;display:none;">
|
<div id="tts-status" class="muted" style="margin-top:0.5rem;"></div>
|
||||||
<audio id="tts-audio" controls></audio>
|
<div id="tts-result" style="margin-top:0.75rem;display:none;align-items:center;gap:0.75rem;">
|
||||||
|
<audio id="tts-audio" controls style="flex:1;"></audio>
|
||||||
|
<a id="tts-download" class="btn btn-secondary" href="#" download="ttstoy.mp3" style="font-size:0.85rem;padding:0.4rem 0.75rem;">Download</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -304,7 +305,8 @@ async function submitTTS() {
|
|||||||
spinner.style.display = 'none';
|
spinner.style.display = 'none';
|
||||||
status.textContent = 'Playing in VC — posted to Discord channel.';
|
status.textContent = 'Playing in VC — posted to Discord channel.';
|
||||||
document.getElementById('tts-audio').src = `/api/tts/${job_id}/audio`;
|
document.getElementById('tts-audio').src = `/api/tts/${job_id}/audio`;
|
||||||
result.style.display = 'block';
|
document.getElementById('tts-download').href = `/api/tts/${job_id}/audio`;
|
||||||
|
result.style.display = 'flex';
|
||||||
} else if (job.status === 'error') {
|
} else if (job.status === 'error') {
|
||||||
clearInterval(poll);
|
clearInterval(poll);
|
||||||
spinner.style.display = 'none';
|
spinner.style.display = 'none';
|
||||||
@@ -336,7 +338,8 @@ async function generateOnly() {
|
|||||||
spinner.style.display = 'none';
|
spinner.style.display = 'none';
|
||||||
status.textContent = post_to_discord ? 'Audio ready — posted to Discord channel.' : 'Audio ready.';
|
status.textContent = post_to_discord ? 'Audio ready — posted to Discord channel.' : 'Audio ready.';
|
||||||
document.getElementById('tts-audio').src = `/api/tts/${job_id}/audio`;
|
document.getElementById('tts-audio').src = `/api/tts/${job_id}/audio`;
|
||||||
result.style.display = 'block';
|
document.getElementById('tts-download').href = `/api/tts/${job_id}/audio`;
|
||||||
|
result.style.display = 'flex';
|
||||||
} else if (job.status === 'error') {
|
} else if (job.status === 'error') {
|
||||||
clearInterval(poll);
|
clearInterval(poll);
|
||||||
spinner.style.display = 'none';
|
spinner.style.display = 'none';
|
||||||
|
|||||||
Reference in New Issue
Block a user