\n \n \n \n",[],[104,133],"18a9a9a0-56a1-11f0-a86a-f69ea79377d9","favicon.svg","76f9d322-9a95-4790-9983-c7d9525e6afc",["D",1751391035109],"\n",[],[104,141],"18a9a842-56a1-11f0-a86a-f69ea79377d9","components","daeac15d-5b80-4e94-8a9d-bc3d737aeec7",["D",1751391035109],[153],[104,148],{"_36":154,"_13":155,"_61":156,"_63":149,"_64":65,"_66":157,"_68":69,"_38":158,"_17":159,"_72":128,"_73":160,"_75":51,"_76":-5,"_89":161,"_18":162},"56228e96-6ebb-11f0-b647-0224a6c84d84","App.tsx","04da3ad1-5aa9-4054-8911-79b025f3f24c",20,["D",1754041133135],13,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\n\ninterface TimeRemaining {\n days: number;\n hours: number;\n minutes: number;\n seconds: number;\n}\n\ninterface TimeElapsed {\n days: number;\n hours: number;\n minutes: number;\n}\n\nexport function App() {\n const [timeRemaining, setTimeRemaining] = useState(null);\n const [timeElapsed, setTimeElapsed] = useState(null);\n const [targetTime, setTargetTime] = useState(null);\n const [error, setError] = useState(\"\");\n const [isExpired, setIsExpired] = useState(false);\n const [showInstructions, setShowInstructions] = useState(false);\n const [showTimeInput, setShowTimeInput] = useState(false);\n const [timeInput, setTimeInput] = useState(\"\");\n\n // Parse query string to get target time\n useEffect(() => {\n const urlParams = new URLSearchParams(window.location.search);\n const timeParam = urlParams.get('time');\n\n if (!timeParam) {\n setShowTimeInput(true);\n return;\n }\n\n try {\n let parsedTime: Date;\n\n // Check if it's a Unix timestamp (all digits)\n if (/^\\d+$/.test(timeParam)) {\n const timestamp = parseInt(timeParam);\n // Handle both seconds and milliseconds timestamps\n parsedTime = new Date(timestamp < 10000000000 ? timestamp * 1000 : timestamp);\n } else {\n // Try to parse as ISO date string\n parsedTime = new Date(timeParam);\n }\n\n if (isNaN(parsedTime.getTime())) {\n setError(\"Invalid time format. Please use ISO date format with timezone (YYYY-MM-DDTHH:MM:SSZ) or Unix timestamp.\");\n return;\n }\n\n setTargetTime(parsedTime);\n setError(\"\");\n } catch (err) {\n setError(\"Failed to parse the provided time. Please check the format.\");\n }\n }, []);\n\n // Update countdown every second\n useEffect(() => {\n if (!targetTime) return;\n\n const updateCountdown = () => {\n const now = new Date();\n const difference = targetTime.getTime() - now.getTime();\n\n if (difference <= 0) {\n setIsExpired(true);\n setTimeRemaining({ days: 0, hours: 0, minutes: 0, seconds: 0 });\n\n // Calculate elapsed time since target\n const elapsed = now.getTime() - targetTime.getTime();\n const elapsedDays = Math.floor(elapsed / (1000 * 60 * 60 * 24));\n const elapsedHours = Math.floor((elapsed % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));\n const elapsedMinutes = Math.floor((elapsed % (1000 * 60 * 60)) / (1000 * 60));\n\n setTimeElapsed({ days: elapsedDays, hours: elapsedHours, minutes: elapsedMinutes });\n return;\n }\n\n const days = Math.floor(difference / (1000 * 60 * 60 * 24));\n const hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));\n const minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));\n const seconds = Math.floor((difference % (1000 * 60)) / 1000);\n\n setTimeRemaining({ days, hours, minutes, seconds });\n setIsExpired(false);\n };\n\n // Update immediately\n updateCountdown();\n\n // Set up interval to update every second\n const interval = setInterval(updateCountdown, 1000);\n\n return () => clearInterval(interval);\n }, [targetTime]);\n\n const handleTimeSubmit = (e: React.FormEvent) => {\n e.preventDefault();\n if (!timeInput.trim()) return;\n\n // Redirect to the same page with the time parameter\n const newUrl = new URL(window.location.href);\n newUrl.searchParams.set('time', timeInput.trim());\n window.location.href = newUrl.toString();\n };\n\n // Time input state\n if (showTimeInput) {\n return (\n

⏱️

Set Countdown Timer

Enter a target date and time to start your countdown:

\n\n

\n \n Target Time\n \n setTimeInput(e.target.value)}\n placeholder=\"2025-12-31T23:59:59Z or 1735689600000\"\n className=\"w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2 transition-colors\"\n style={{\n borderColor: '#dce0e8',\n backgroundColor: '#e6e9ef',\n color: '#4c4f69'\n }}\n onFocus={(e) => {\n e.target.style.borderColor = '#8839ef';\n e.target.style.boxShadow = '0 0 0 2px rgba(136, 57, 239, 0.2)';\n }}\n onBlur={(e) => {\n e.target.style.borderColor = '#dce0e8';\n e.target.style.boxShadow = 'none';\n }}\n />\n

\n\n (e.target as HTMLElement).style.backgroundColor = '#7c3aed'}\n onMouseLeave={(e) => (e.target as HTMLElement).style.backgroundColor = '#8839ef'}\n >\n Start Countdown\n \n \n\n

Supported formats:

• ISO with timezone: 2025-12-31T23:59:59Z

• ISO with offset: 2025-12-31T18:59:59-05:00

• ISO local time: 2025-12-31T23:59:59

• Unix timestamp: 1735689600000

\n );\n }\n\n // Error state\n if (error) {\n return (\n

⚠️

Error

{error}

Examples:

?time=2025-12-31T23:59:59Z (UTC)

?time=2025-12-31T18:59:59-05:00 (EST)

?time=2025-12-31T23:59:59 (local time)

?time=1735689600000 (Unix timestamp)

\n );\n }\n\n // Expired state\n if (isExpired) {\n const formatElapsedTime = (elapsed: TimeElapsed) => {\n const parts = [];\n if (elapsed.days > 0) parts.push(`${elapsed.days} day${elapsed.days !== 1 ? 's' : ''}`);\n if (elapsed.hours > 0) parts.push(`${elapsed.hours} hour${elapsed.hours !== 1 ? 's' : ''}`);\n if (elapsed.minutes > 0) parts.push(`${elapsed.minutes} minute${elapsed.minutes !== 1 ? 's' : ''}`);\n\n if (parts.length === 0) return 'just now';\n if (parts.length === 1) return parts[0];\n if (parts.length === 2) return `${parts[0]} and ${parts[1]}`;\n return `${parts[0]}, ${parts[1]}, and ${parts[2]}`;\n };\n\n return (\n

⏰

Time's Up!

The countdown has reached zero.

\n {targetTime && (\n

\n Target time was: {targetTime.toLocaleString()}\n

\n {timeElapsed && (\n

\n {formatElapsedTime(timeElapsed)} ago\n

\n )}\n

\n );\n }\n\n // Loading state\n if (!timeRemaining) {\n return (\n

Loading countdown...

\n );\n }\n\n // Main countdown display\n return (\n

\n Countdown Timer\n

\n\n {targetTime && (\n

\n Counting down to: {targetTime.toLocaleString()}\n

\n UTC: {targetTime.toISOString()} | Local: {targetTime.toLocaleString()}\n

\n )}\n\n

\n {timeRemaining.days.toString().padStart(2, '0')}\n

\n Days\n

\n\n

\n {timeRemaining.hours.toString().padStart(2, '0')}\n

\n Hours\n

\n\n

\n {timeRemaining.minutes.toString().padStart(2, '0')}\n

\n Minutes\n

\n\n

\n {timeRemaining.seconds.toString().padStart(2, '0')}\n

\n Seconds\n

\n\n

\n setShowInstructions(!showInstructions)}\n className=\"inline-flex items-center text-sm font-medium transition-colors duration-200\"\n style={{ color: '#9ca0b0' }}\n onMouseEnter={(e) => (e.target as HTMLElement).style.color = '#6c6f85'}\n onMouseLeave={(e) => (e.target as HTMLElement).style.color = '#9ca0b0'}\n >\n How does this work?\n \n ▼\n \n \n\n {showInstructions && (\n

Setting a Target Time

Add a target time to the URL using the ?time= parameter:

\n\n

\n ?time=2025-07-26T00:00:00Z\n

UTC timezone

\n\n

\n ?time=2025-07-26T00:00:00-05:00\n

With timezone offset

\n\n

\n ?time=1735689600000\n

Unix timestamp

\n )}\n

\n );\n}",[],[104,148,155],"18a9a504-56a1-11f0-a86a-f69ea79377d9","backend","23687c0b-674e-4116-873e-b719d0a3e852",["D",1751391035109],[169],[164],{"_36":170,"_13":171,"_61":172,"_63":165,"_64":65,"_66":95,"_68":69,"_38":173,"_17":71,"_72":174,"_73":175,"_75":51,"_76":176,"_89":177,"_18":178},"18a9a054-56a1-11f0-a86a-f69ea79377d9","index.ts","0a9fcfa3-39c8-41b9-b6ff-d5f90bb6b495",["D",1751391035109],"http","import { serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport { Hono } from \"npm:hono\";\n\nconst app = new Hono();\n\n// Serve index.html at the root /\napp.get(\"/\", async c => {\n return serveFile(\"/frontend/index.html\", import.meta.url);\n});\n\n// Serve all /frontend files\napp.get(\"/frontend/**/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Add your API routes here\n// app.get(\"/api/data\", c => c.json({ hello: \"world\" }));\n\n// Unwrap and rethrow Hono errors as the original error\n// If you delete this, all errors will be \"Internal Server Error\"\napp.onError((err, c) => {\n throw err;\n});\n\n// HTTP vals expect an exported \"fetch handler\"\n// This is how you \"run the server\" in Val Town with Hono\nexport default app.fetch;","countdown",[],[164,171],"18a05c10-56a1-11f0-a86a-f69ea79377d9",["D",1751391035109],"legacyEnvVars","httpPrivacy","description","URL-shareable countdown timer","imageUrl","userId","7537ab70-4dd9-11f0-af69-ad2d81fb9912","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","d95f9e62-1d7b-4f0c-9b4c-91e2bf8736e5","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_223":219},"org",{"_11":12,"_217":-5,"_218":219,"_186":-5,"_220":221,"_222":69},"branch",{"_17":157,"_13":16,"_36":65,"_42":179,"_45":37,"_46":213,"_214":53,"_215":43,"_216":57,"_58":14,"_54":12},67,"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","displayName","avatar","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/a879b34a-e7a4-4fd4-0f43-db7c3cde6200/square512?exp=1789588799&sig=4797bf29e0b1814794881bdaf03df439ca4e9a8dd6595b9a5447466eba7ea78a","tier","business","canRestrictVals","profileImageUrl","adoptOrgId",{"_36":179,"_13":14,"_38":297,"_49":-5,"_181":51,"_52":53,"_182":53,"_183":184,"_185":-5,"_186":187,"_188":172,"_189":69,"_190":69,"_191":-5,"_192":71,"_56":193,"_194":-5,"_195":-5,"_196":-5,"_197":-5,"_198":199,"_200":199,"_201":202,"_203":202,"_204":202,"_205":199,"_206":199,"_207":298,"_209":299,"_211":300,"_50":51},[261,263,270,271,272],"files",[261,262,263,264,265,266,267,268,269,270,271,272],"counts",{"_252":71,"_253":95,"_254":71,"_35":255,"_256":257},[],{"_36":60,"_13":19,"_61":62,"_63":-5,"_64":65,"_66":67,"_68":69,"_38":70,"_17":71,"_72":24,"_73":74,"_75":51,"_76":-5,"_18":251},"upstreamProject",{"_36":43,"_13":59,"_183":247,"_185":248,"_52":53,"_207":249},"upstreamBranch",{"_36":37,"_38":245,"_40":246,"_13":16,"_42":43,"_17":44,"_45":-5,"_46":-5,"_47":48,"_49":-5,"_50":51,"_52":53,"_54":55,"_56":57,"_58":59},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1740674013689],["D",1785420707976],"Starter template with client-side React & Hono server","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/64dc00cc-94d9-47dd-81b1-dde02610d900/square512?exp=1789588799&sig=cc8cae5a3b06d460bba0e0803182f7ba2bd6e8f6e4c645b92fb51aa03192ad01",{"_11":55,"_223":250},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789588799&sig=6ce4a653b65ad390b6349a1b0a383cb839cc380a1beaf91551581c108538875d",[19],"pulls","branches","forks",{"_258":71,"_260":71},"connections",{"_258":71,"_259":71},"count","unfilledCount","emptyCount",{"_36":163,"_13":164,"_61":165,"_63":-5,"_64":65,"_66":95,"_68":69,"_38":166,"_17":71,"_72":107,"_73":-5,"_75":51,"_76":-5,"_89":295,"_18":296},{"_36":170,"_13":171,"_61":172,"_63":165,"_64":65,"_66":95,"_68":69,"_38":173,"_17":71,"_72":174,"_73":175,"_75":51,"_76":176,"_89":293,"_18":294},{"_36":103,"_13":104,"_61":105,"_63":-5,"_64":65,"_66":95,"_68":69,"_38":106,"_17":71,"_72":107,"_73":-5,"_75":51,"_76":-5,"_89":291,"_18":292},{"_36":147,"_13":148,"_61":149,"_63":105,"_64":65,"_66":95,"_68":69,"_38":150,"_17":71,"_72":107,"_73":-5,"_75":51,"_76":-5,"_89":289,"_18":290},{"_36":154,"_13":155,"_61":156,"_63":149,"_64":65,"_66":157,"_68":69,"_38":158,"_17":159,"_72":128,"_73":160,"_75":51,"_76":-5,"_89":287,"_18":288},{"_36":140,"_13":141,"_61":142,"_63":105,"_64":65,"_66":95,"_68":69,"_38":143,"_17":71,"_72":24,"_73":144,"_75":51,"_76":-5,"_89":285,"_18":286},{"_36":132,"_13":133,"_61":134,"_63":105,"_64":65,"_66":135,"_68":69,"_38":136,"_17":95,"_72":24,"_73":137,"_75":51,"_76":-5,"_89":283,"_18":284},{"_36":123,"_13":124,"_61":125,"_63":105,"_64":65,"_66":126,"_68":69,"_38":127,"_17":67,"_72":128,"_73":129,"_75":51,"_76":-5,"_89":281,"_18":282},{"_36":115,"_13":116,"_61":117,"_63":105,"_64":65,"_66":118,"_68":69,"_38":119,"_17":95,"_72":24,"_73":120,"_75":51,"_76":-5,"_89":279,"_18":280},{"_36":60,"_13":19,"_61":62,"_63":-5,"_64":65,"_66":67,"_68":69,"_38":100,"_17":71,"_72":24,"_73":74,"_75":51,"_76":-5,"_89":277,"_18":278},{"_36":92,"_13":93,"_61":94,"_63":-5,"_64":65,"_66":95,"_68":69,"_38":96,"_17":71,"_72":24,"_73":97,"_75":51,"_76":-5,"_89":275,"_18":276},{"_36":83,"_13":84,"_61":85,"_63":-5,"_64":65,"_66":86,"_68":69,"_38":87,"_17":71,"_72":24,"_73":88,"_75":51,"_76":-5,"_89":273,"_18":274},[],[84],[],[93],[],[19],[],[104,116],[],[104,124],[],[104,133],[],[104,141],[],[104,148,155],[265],[104,148],[264,266,267,268,269],[104],[],[164,171],[262],[164],["D",1751391035109],{"_11":12,"_223":219},{"_11":12,"_217":-5,"_218":219,"_186":-5,"_220":221,"_222":69},{"_17":157,"_13":16,"_36":65,"_42":179,"_45":37,"_46":213,"_214":53,"_215":43,"_216":57,"_58":14,"_54":12},"ctx",{"_207":-5,"_242":334,"_335":336,"_337":338,"_339":51,"_340":51,"_341":51,"_342":69,"_343":-5,"_344":-7,"_345":-7,"_346":71,"_347":51,"_348":51,"_349":-5,"_350":51,"_351":51,"_352":51,"_353":-5},"ENV",{"_305":306,"_307":308,"_309":16,"_310":311,"_312":313,"_314":315,"_316":317,"_318":319,"_320":321,"_322":323,"_324":325,"_326":327,"_328":329,"_330":331,"_332":333},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","fdb67791413f4386b4dbf18f354029a617f6160f","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"]