\n \n\n",[],[251,261],"fabb7022-9caa-11f0-9ea4-0224a6c84d84","UploadForm.tsx","c60efba0-9caa-11f0-b194-0224a6c84d84","d9bbe8f3-b67c-4104-8aa9-40f795c3ef0f",19,["D",1759091861332],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from 'https://esm.sh/react@18.2.0';\nimport type { UploadResponse, ExtractedEvent } from '../../shared/types.ts';\n\ninterface UploadFormProps {\n onEventExtracted: (event: ExtractedEvent) => void;\n}\n\nexport default function UploadForm({ onEventExtracted }: UploadFormProps) {\n const [isUploading, setIsUploading] = useState(false);\n const [error, setError] = useState(null);\n const [dragOver, setDragOver] = useState(false);\n const fileInputRef = useRef(null);\n\n const handleFileSelect = async (file: File) => {\n if (!file.type.startsWith('image/')) {\n setError('Please select an image file');\n return;\n }\n\n setIsUploading(true);\n setError(null);\n\n try {\n // Resize image if it's too large\n const processedFile = await resizeImage(file);\n \n const formData = new FormData();\n formData.append('photo', processedFile);\n\n const response = await fetch('/api/upload', {\n method: 'POST',\n body: formData,\n });\n\n const result: UploadResponse = await response.json();\n\n if (result.success && result.event) {\n onEventExtracted(result.event);\n } else {\n setError(result.error || 'Failed to process image');\n }\n } catch (err) {\n console.error('Upload error:', err);\n setError('Failed to upload image. Please try again.');\n } finally {\n setIsUploading(false);\n }\n };\n\n const handleFileInputChange = (e: React.ChangeEvent) => {\n const file = e.target.files?.[0];\n if (file) {\n handleFileSelect(file);\n }\n };\n\n const handleDrop = (e: React.DragEvent) => {\n e.preventDefault();\n setDragOver(false);\n \n const file = e.dataTransfer.files[0];\n if (file) {\n handleFileSelect(file);\n }\n };\n\n const handleDragOver = (e: React.DragEvent) => {\n e.preventDefault();\n setDragOver(true);\n };\n\n const handleDragLeave = (e: React.DragEvent) => {\n e.preventDefault();\n setDragOver(false);\n };\n\n const handleClick = () => {\n fileInputRef.current?.click();\n };\n\n return (\n

\n 📅 Event Extractor\n

\n \n

\n Upload Event Flyer\n

\n \n \n \n \n {isUploading ? (\n

\n Analyzing image...\n

\n ) : (\n

📸

\n Take Photo or Upload Image\n

\n Upload a photo of an event flyer or poster\n

\n )}\n

\n\n {error && (\n

\n Error: {error}\n

\n )}\n\n

📱 Optimized for mobile • 🤖 AI-powered extraction

\n \n );\n}",[],[251,277,269],"components","d0c4dbc8-9caa-11f0-86b0-0224a6c84d84","EventDisplay.tsx","d0c4dc9a-9caa-11f0-86b0-0224a6c84d84",11,["D",1759091790904],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from 'https://esm.sh/react@18.2.0';\nimport type { ExtractedEvent, CalendarEvent } from '../../shared/types.ts';\n\ninterface EventDisplayProps {\n event: ExtractedEvent;\n onBack: () => void;\n}\n\nexport default function EventDisplay({ event, onBack }: EventDisplayProps) {\n const [isDownloading, setIsDownloading] = useState(false);\n\n const formatDate = (dateString: string) => {\n try {\n const date = new Date(dateString);\n return date.toLocaleDateString('en-US', {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric'\n });\n } catch {\n return dateString;\n }\n };\n\n const handleAddToCalendar = async () => {\n setIsDownloading(true);\n \n try {\n const calendarEvent: CalendarEvent = {\n title: event.title,\n date: event.date,\n photoUrl: event.photoUrl\n };\n\n const response = await fetch('/api/calendar/download', {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json',\n },\n body: JSON.stringify(calendarEvent),\n });\n\n if (response.ok) {\n const blob = await response.blob();\n const url = window.URL.createObjectURL(blob);\n const a = document.createElement('a');\n a.href = url;\n a.download = `${event.title.replace(/[^a-zA-Z0-9]/g, '_')}.ics`;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n window.URL.revokeObjectURL(url);\n } else {\n throw new Error('Failed to generate calendar file');\n }\n } catch (error) {\n console.error('Calendar download error:', error);\n alert('Failed to generate calendar file. Please try again.');\n } finally {\n setIsDownloading(false);\n }\n };\n\n return (\n

\n {/* Header */}\n

\n \n ← Back\n \n

Event Extracted! 🎉

\n\n {/* Event Details */}\n

\n {event.title}\n

\n 📅\n {formatDate(event.date)}\n

\n\n {/* Photo */}\n

\n Original Photo\n

\n \n

\n\n {/* Add to Calendar Button */}\n \n {isDownloading ? (\n \n

\n Generating...\n \n ) : (\n \n 📅 Add to Calendar\n \n )}\n \n\n

This will download an .ics file that you can open with your calendar app

\n\n {/* Instructions */}\n

📱 How to add to your calendar:

1. Tap \"Add to Calendar\" above
2. Open the downloaded .ics file
3. Choose your calendar app (iOS Calendar, Google Calendar, etc.)
4. Confirm to add the event

\n );\n}",[],[251,277,279],"d62fff7a-9caa-11f0-ab67-0224a6c84d84","App.tsx","d630002e-9caa-11f0-ab67-0224a6c84d84",12,["D",1759091800024],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from 'https://esm.sh/react@18.2.0';\nimport UploadForm from './UploadForm.tsx';\nimport EventDisplay from './EventDisplay.tsx';\nimport type { ExtractedEvent } from '../../shared/types.ts';\n\nexport default function App() {\n const [extractedEvent, setExtractedEvent] = useState(null);\n\n const handleEventExtracted = (event: ExtractedEvent) => {\n setExtractedEvent(event);\n };\n\n const handleBack = () => {\n setExtractedEvent(null);\n };\n\n return (\n

\n {extractedEvent ? (\n \n ) : (\n \n )}\n

\n );\n}",[],[251,277,287],"c60f0a78-9caa-11f0-b194-0224a6c84d84",10,["D",1759091772962],[212,213,214],[251,277],"b5ba3490-9caa-11f0-975e-0224a6c84d84",["D",1759091745567],[211,215,216,217],[251],"db94ee12-9caa-11f0-a02c-0224a6c84d84","index.ts",14,["D",1759091809071],"http","import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport upload from \"./routes/upload.ts\";\nimport calendar from \"./routes/calendar.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err) => Promise.reject(err));\n\n// API routes\napp.route(\"/api/upload\", upload);\napp.route(\"/api/calendar\", calendar);\napp.route(\"/api\", upload); // Also serve photos at /api/photo/:id\n\n// Serve static files\napp.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Serve main page\napp.get(\"/\", async c => {\n const html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\nexport default app.fetch;",[],[179,304],"e792874c-9caa-11f0-8336-0224a6c84d84","image.ts","87f8c558-9caa-11f0-99aa-0224a6c84d84","823a2978-450c-4904-b2d1-17c4f4a68ef8",15,["D",1759091829192],"/**\n * Convert ArrayBuffer to base64 string\n */\nexport function arrayBufferToBase64(buffer: ArrayBuffer): string {\n const bytes = new Uint8Array(buffer);\n let binary = '';\n for (let i = 0; i < bytes.byteLength; i++) {\n binary += String.fromCharCode(bytes[i]);\n }\n return btoa(binary);\n}\n\n/**\n * Check if image needs resizing based on file size\n * For now, we'll store images as-is and let the client handle resizing if needed\n */\nexport function shouldResizeImage(fileSize: number, maxSizeBytes: number = 5 * 1024 * 1024): boolean {\n return fileSize > maxSizeBytes;\n}",[],[179,320,312],"utils","8fb94c36-9caa-11f0-a38f-0224a6c84d84","ai.ts","8fb94cea-9caa-11f0-a38f-0224a6c84d84",4,["D",1759091681809],"import { OpenAI } from \"https://esm.town/v/std/openai\";\n\nexport interface EventExtraction {\n title: string | null;\n date: string | null; // ISO date string\n confidence: number;\n}\n\n/**\n * Extract event title and date from image using OpenAI Vision\n */\nexport async function extractEventFromImage(base64Image: string): Promise {\n const openai = new OpenAI();\n \n try {\n const response = await openai.chat.completions.create({\n model: \"gpt-4o-mini\",\n messages: [\n {\n role: \"user\",\n content: [\n {\n type: \"text\",\n text: `Analyze this image of a flyer or poster and extract the event information. \n \n Please provide:\n 1. The main title/name of the event\n 2. The date of the event (convert to ISO format YYYY-MM-DD if possible)\n \n Respond with a JSON object in this exact format:\n {\n \"title\": \"Event Title Here\",\n \"date\": \"2024-01-15\",\n \"confidence\": 0.9\n }\n \n If you cannot find clear title or date information, set those fields to null.\n Set confidence between 0-1 based on how clear the information is.`\n },\n {\n type: \"image_url\",\n image_url: {\n url: `data:image/jpeg;base64,${base64Image}`\n }\n }\n ]\n }\n ],\n max_tokens: 300,\n temperature: 0.1\n });\n\n const content = response.choices[0]?.message?.content;\n if (!content) {\n throw new Error(\"No response from OpenAI\");\n }\n\n // Parse JSON response\n const parsed = JSON.parse(content) as EventExtraction;\n \n // Validate the response structure\n if (typeof parsed.title !== 'string' && parsed.title !== null) {\n parsed.title = null;\n }\n if (typeof parsed.date !== 'string' && parsed.date !== null) {\n parsed.date = null;\n }\n if (typeof parsed.confidence !== 'number') {\n parsed.confidence = 0.5;\n }\n\n return parsed;\n } catch (error) {\n console.error(\"Error extracting event from image:\", error);\n return {\n title: null,\n date: null,\n confidence: 0\n };\n }\n}",[],[179,320,322],"87f8d07a-9caa-11f0-99aa-0224a6c84d84",3,["D",1759091668796],[207,208],[179,320],["D",1759091842322],[],[179,99,67],["D",1759091723368],[],[179,99,82],["D",1759091706931],[204,205],[179,99],"87f8cddc-9caa-11f0-99aa-0224a6c84d84",["D",1759091668796],[203,206,209],[179],["D",1759091285382],{"_11":12,"_149":73},{"_11":12,"_145":-5,"_72":73,"_31":71,"_146":147,"_148":30},{"_42":136,"_13":16,"_36":39,"_137":102,"_138":-5,"_139":-5,"_140":-5,"_141":-5,"_142":-5,"_143":14,"_144":12},"ctx",{"_55":-5,"_168":384,"_385":386,"_387":388,"_389":30,"_390":30,"_391":30,"_392":24,"_393":-5,"_394":-7,"_395":-7,"_396":26,"_397":30,"_398":30,"_399":-5,"_400":30,"_401":30,"_402":30,"_403":-5},"ENV",{"_355":356,"_357":358,"_359":16,"_360":361,"_362":363,"_364":365,"_366":367,"_368":369,"_370":371,"_372":373,"_374":375,"_376":377,"_378":379,"_380":381,"_382":383},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

History · routes