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

Lock customer page after choice, archive files on revision, add file checkboxes for delivery

Browse source
This commit is contained in:
Troll (Hermes Agent) 2026-08-01 21:10:57 +00:00
parent 51d1b4a4d9
commit 0f6b68cf5d
4 changed files with 144 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

58
templates/player.html
View file

@ -8,7 +8,9 @@
/*
Private customer player page.
Shows two audio players for Version A and Version B,
plus approval buttons and a revision note form.
plus approval buttons or a revision note form.
After the customer makes a choice, the controls are hidden
and a confirmation/waiting message is shown instead.
*/
body{
font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
@ -45,6 +47,7 @@
font-weight:700;
cursor:pointer;
}
button:disabled{background:#374151;color:#9ca3af;cursor:not-allowed;}
button.selected{background:#10b981;}
button.both{background:#8b5cf6;}
button.revision{background:#f59e0b;color:#000;}
@ -66,6 +69,15 @@
margin-top:1rem;
}
.status.waiting{background:#3f3f46;}
.locked{
margin-top:1rem;
padding:1rem;
background:#111827;
border-radius:.5rem;
border:1px solid #374151;
}
.locked h2{margin-top:0;color:#fbbf24;}
.locked p{margin:.3rem 0;}
</style>
</head>
<body>
@ -85,14 +97,36 @@
<audio controls src="{{ url_for('audio', token=req.player_token, version='b') }}"></audio>
</div>
{% if req.status in ['songs_uploaded','revisions_requested','awaiting_payment','paid','delivered'] %}
{% if req.status == 'revisions_requested' %}
<!-- Customer asked for changes; lock the page and tell them to wait -->
<div class="locked waiting">
<h2>📝 Revision Requested</h2>
<p>You asked for changes. We will generate a new version and update this page.</p>
<p><strong>Your note:</strong> {{ req.revision_note }}</p>
</div>
{% elif req.status in ['awaiting_payment','paid','delivered'] %}
<!-- Customer already picked a version; show their choice and payment instruction -->
<div class="locked">
<h2>✅ Choice Received</h2>
<p>You selected:</span> <strong>{% if req.customer_approved == 'both' %}Both Versions{% else %}Version {{ req.customer_approved.upper() }}{% endif %}</strong></p>
{% if req.status == 'awaiting_payment' %}
<p>Please return to the booth to finalize payment and collect your files.</p>
{% elif req.status == 'paid' %}
<p>Payment recorded. Your files are being prepared.</p>
{% elif req.status == 'delivered' %}
<p>Delivered! Check your email for the MP3 attachment(s).</p>
{% endif %}
</div>
{% else %}
<!-- Approval form: customer picks A, B, or both -->
<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>
<button type="submit" onclick="document.getElementById('choice').value='a'">I want Version A</button>
<button type="submit" onclick="document.getElementById('choice').value='b'">I want Version B</button>
<button type="submit" class="both" onclick="document.getElementById('choice').value='both'">I want both</button>
</div>
</form>
@ -106,20 +140,6 @@
</form>
{% endif %}
{% if req.status == 'awaiting_payment' %}
<!-- Shown after customer approves a version -->
<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' %}
<!-- Shown after operator marks paid and delivers -->
<div class="status">
<strong>Delivered! ✅</strong> Check your email for the MP3 attachment(s).
</div>
{% endif %}
</div>
</body>
</html>