The smokesignal.events web application
1/**
2 * Quick Event Form Feature
3 *
4 * Handles the quick event creation form on the homepage.
5 * Supports both authenticated (direct API) and unauthenticated (localStorage) flows.
6 */
7
8import { authPostJson, SessionExpiredError } from '../../core/auth'
9
10const STORAGE_KEY = 'smokesignal_quick_event'
11
12export function initQuickEventForm(): void {
13 const form = document.getElementById('quick-event-form') as HTMLFormElement | null
14 if (!form) return
15
16 // Check authentication status from data attribute
17 const isAuthenticated = form.dataset.authenticated === 'true'
18
19 form.addEventListener('submit', (e) => {
20 e.preventDefault()
21
22 const titleInput = document.getElementById('home-quick-event-title') as HTMLInputElement | null
23 const descriptionInput = document.getElementById(
24 'home-quick-event-description'
25 ) as HTMLTextAreaElement | null
26 const startsInput = document.getElementById(
27 'home-quick-event-starts'
28 ) as HTMLInputElement | null
29
30 if (!titleInput || !descriptionInput || !startsInput) return
31
32 if (isAuthenticated) {
33 // Get the datetime-local value and convert to UTC
34 const localDateTime = startsInput.value
35 if (!localDateTime) {
36 alert('Please select a start time')
37 return
38 }
39
40 // Convert datetime-local to UTC ISO string
41 const localDate = new Date(localDateTime)
42 const utcISOString = localDate.toISOString()
43
44 // Create JSON payload for the API
45 const eventData = {
46 name: titleInput.value,
47 description: descriptionInput.value,
48 starts_at: utcISOString,
49 status: 'scheduled',
50 mode: 'inperson',
51 locations: [],
52 links: [],
53 require_confirmed_email: false,
54 send_notifications: true,
55 }
56
57 // Disable submit button
58 const submitButton = form.querySelector('button[type="submit"]') as HTMLButtonElement | null
59 if (submitButton) {
60 submitButton.disabled = true
61 submitButton.innerHTML =
62 '<span class="icon"><i class="fas fa-spinner fa-pulse"></i></span><span>Creating...</span>'
63 }
64
65 const resetButton = () => {
66 if (submitButton) {
67 submitButton.disabled = false
68 submitButton.innerHTML = '<strong>Create Event</strong>'
69 }
70 }
71
72 authPostJson('/event', eventData)
73 .then(async (response) => {
74 const data = await response.json()
75 if (response.ok && data.url) {
76 // Redirect to the created event
77 window.location.href = data.url
78 } else {
79 // Show error
80 alert(data.error || 'Failed to create event. Please try again.')
81 resetButton()
82 }
83 })
84 .catch((error) => {
85 if (error instanceof SessionExpiredError) {
86 alert(error.message)
87 } else {
88 console.error('Error creating event:', error)
89 alert('Failed to create event. Please try again.')
90 }
91 resetButton()
92 })
93 } else {
94 // User is not authenticated, save to localStorage and redirect
95 const data = {
96 name: titleInput.value,
97 description: descriptionInput.value,
98 starts_at: startsInput.value,
99 }
100 localStorage.setItem(STORAGE_KEY, JSON.stringify(data))
101 window.location.href = '/quick-event'
102 }
103 })
104}