Files
ryan d005080aca Add attendee cap with required login for capped events
Hosts can optionally cap total attendance (RSVPs + plus-ones) when
creating an event. Capped events require guests to log in via the
existing email code flow; RSVPs are tied to accounts and deduped per
user. The event page shows spots left and replaces the form with a
full notice when the cap is reached; the server rejects over-cap
RSVPs and edits with 409 as a race backstop.

Also threads a safeNext-validated ?next= param through the login and
name-setup flow so guests land back on the event after signing in.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-06-10 19:36:57 -04:00

79 lines
3.7 KiB
HTML

{{template "layout" .}}
{{define "title"}}bbq — create a potluck{{end}}
{{define "content"}}
<div class="event-header">
<div class="event-tag">New event</div>
<h1 class="event-title">Create a potluck</h1>
<p style="font-family:'DM Mono',monospace;font-size:0.8rem;color:#555;margin-top:8px;">
Set up what's needed and share the link. No sign-up required.
</p>
</div>
<div class="claim-form-wrapper">
<form method="POST" action="/events">
<div class="form-row">
<label>Event name</label>
<input type="text" name="title" placeholder="e.g. Prospect Park Summer Picnic" required>
</div>
<div class="form-row">
<label>Date</label>
<input type="text" name="date" placeholder="e.g. Saturday, June 14">
</div>
<div class="form-row">
<label>Time</label>
<input type="text" name="time" placeholder="e.g. 2:00 PM">
</div>
<div class="form-row">
<label>Location</label>
<input type="text" name="location" placeholder="e.g. Long Meadow, entrance at 9th St">
</div>
<div class="form-row">
<label>Description (optional, markdown supported)</label>
<textarea name="description" rows="4" placeholder="e.g. Bring your own blanket! We'll have a grill set up near the big oak tree." style="border:var(--border-w) solid var(--border);background:var(--cream);padding:10px 14px;font-family:'Bricolage Grotesque',sans-serif;font-size:0.95rem;resize:vertical;outline:none;"></textarea>
</div>
{{if .AuthEnabled}}
<div class="form-row">
<label>Attendee cap (optional — guests must log in to RSVP)</label>
<input type="number" name="attendee_cap" min="0" max="1000" placeholder="e.g. 30 — leave blank for unlimited">
</div>
{{end}}
<div class="section-label" style="margin:24px 0 16px">Slots</div>
<div id="slot-rows">
<div class="slot-row" style="display:flex;gap:8px;margin-bottom:12px;">
<div class="emoji-pick">
<input type="text" name="slot_emoji" placeholder="&#127834;" readonly style="border:var(--border-w) solid var(--border);background:var(--cream);padding:10px;font-size:0.95rem;">
</div>
<input type="text" name="slot_name" placeholder="Slot name" style="flex:1;border:var(--border-w) solid var(--border);background:var(--cream);padding:10px;font-family:'Bricolage Grotesque',sans-serif;font-size:0.95rem;">
<input type="number" name="slot_max" value="2" min="1" style="width:60px;border:var(--border-w) solid var(--border);background:var(--cream);padding:10px;font-size:0.95rem;text-align:center;">
</div>
</div>
<button type="button" onclick="addSlotRow()" class="btn-claim" style="margin-bottom:20px;">+ Add slot</button>
<button class="btn-submit" type="submit">Create event &#8599;</button>
</form>
</div>
<script>
function addSlotRow() {
const container = document.getElementById('slot-rows');
const row = document.createElement('div');
row.className = 'slot-row';
row.style.cssText = 'display:flex;gap:8px;margin-bottom:12px;';
row.innerHTML = `
<div class="emoji-pick">
<input type="text" name="slot_emoji" placeholder="\u{1F356}" readonly style="border:var(--border-w) solid var(--border);background:var(--cream);padding:10px;font-size:0.95rem;">
</div>
<input type="text" name="slot_name" placeholder="Slot name" style="flex:1;border:var(--border-w) solid var(--border);background:var(--cream);padding:10px;font-family:'Bricolage Grotesque',sans-serif;font-size:0.95rem;">
<input type="number" name="slot_max" value="2" min="1" style="width:60px;border:var(--border-w) solid var(--border);background:var(--cream);padding:10px;font-size:0.95rem;text-align:center;">
`;
container.appendChild(row);
initEmojiPickers();
}
</script>
{{end}}