yrtria/theme-song-booth
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Initial prototype for theme song booth

Browse source
This commit is contained in:
Troll (Hermes Agent) 2026-07-31 19:47:52 +00:00
commit c16d48ee32
16 changed files with 898 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

68
templates/player.html Normal file
View file

@ -0,0 +1,68 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Your Theme Song</title>
<style>
body{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:#111827;color:#f3f4f6;margin:0;padding:1rem;line-height:1.5}
.container{max-width:640px;margin:0 auto;background:#1f2937;padding:1.5rem;border-radius:1rem}
h1{color:#60a5fa}
.player{background:#111827;padding:1rem;border-radius:.5rem;margin:1rem 0}
audio{width:100%;margin-top:.5rem}
.actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
button{flex:1;min-width:120px;padding:.8rem;border:none;border-radius:.5rem;background:#3b82f6;color:#fff;font-weight:700;cursor:pointer}
button.selected{background:#10b981}
button.both{background:#8b5cf6}
button.revision{background:#f59e0b;color:#000}
form{margin-top:1rem}
textarea{width:100%;padding:.6rem;border-radius:.5rem;border:1px solid #374151;background:#111827;color:#f3f4f6;box-sizing:border-box;min-height:80px}
.status{padding:.8rem;background:#064e3b;border-radius:.5rem;margin-top:1rem}
.status.waiting{background:#3f3f46}
</style>
</head>
<body>
<div class="container">
<h1>🎧 Your Custom Theme Song</h1>
<p>Hi {{ req.name }}! Listen to both versions and pick the one you want.</p>
<div class="player">
<h3>Version A</h3>
<audio controls src="{{ url_for('audio', token=req.player_token, version='a') }}"></audio>
</div>
<div class="player">
<h3>Version B</h3>
<audio controls src="{{ url_for('audio', token=req.player_token, version='b') }}"></audio>
</div>
{% if req.status in ['songs_uploaded','awaiting_payment','paid','delivered'] %}
<form method="POST" action="{{ url_for('approve', token=req.player_token) }}">
<input type="hidden" name="choice" id="choice">
<div class="actions">
<button type="submit" class="{% if req.customer_approved == 'a' %}selected{% endif %}" onclick="document.getElementById('choice').value='a'">I want Version A</button>
<button type="submit" class="{% if req.customer_approved == 'b' %}selected{% endif %}" onclick="document.getElementById('choice').value='b'">I want Version B</button>
<button type="submit" class="both {% if req.customer_approved == 'both' %}selected{% endif %}" onclick="document.getElementById('choice').value='both'">I want both</button>
</div>
</form>
<form method="POST" action="{{ url_for('revise', token=req.player_token) }}">
<label for="revision_note">Or ask for changes:</label>
<textarea id="revision_note" name="revision_note" placeholder="e.g. make the chorus louder, swap a lyric..."></textarea>
<div class="actions">
<button type="submit" class="revision">Request Changes</button>
</div>
</form>
{% endif %}
{% if req.status == 'awaiting_payment' %}
<div class="status waiting"><strong>Thanks for choosing {{ req.customer_approved.upper() }}!</strong> Please head to the booth to finalize payment and collect your files.</div>
{% endif %}
{% if req.status == 'delivered' %}
<div class="status"><strong>Delivered! ✅</strong> Check your email for the MP3 attachment(s).</div>
{% endif %}
</div>
</body>
</html>