[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_201":202,"_203":204},"routes/_app.x.$handle.$name",{"_95":94,"_32":45,"_103":85,"_27":104,"_13":14,"_105":-5,"_11":106,"_107":108,"_109":110,"_111":112,"_113":114,"_20":-5,"_115":-5,"_116":-5,"_117":25,"_118":119,"_120":121,"_122":-5,"_123":-5,"_124":125},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_43":44,"_32":45,"_38":46,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":-5,"_18":55,"_56":-5,"_57":25,"_58":-5,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":78,"_79":80,"_81":82,"_83":25},"version",8,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":37,"_35":36,"_38":39,"_40":14,"_41":42,"_24":25},"previous",{"_30":31,"_32":28,"_33":34,"_35":36},"deleted",false,"deletedHere","path","server.js","latestPath","fileId","9537c33c-31a6-11f0-ae66-569c3dd06744","name","fileType","script","content","import { readFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n\nexport default async function(req) {\n const url = new URL(req.url);\n const path = url.pathname;\n \n try {\n // Serve the main HTML file for the root path\n if (path === \"/\" || path === \"\") {\n const html = await readFile(\"/index.html\", import.meta.url);\n return new Response(html, {\n headers: {\n \"Content-Type\": \"text/html; charset=utf-8\"\n }\n });\n }\n \n // Serve CSS file\n if (path === \"/style.css\") {\n const css = await readFile(\"/style.css\", import.meta.url);\n return new Response(css, {\n headers: {\n \"Content-Type\": \"text/css; charset=utf-8\"\n }\n });\n }\n \n // Serve JavaScript file\n if (path === \"/script.js\") {\n const js = await readFile(\"/script.js\", import.meta.url);\n return new Response(js, {\n headers: {\n \"Content-Type\": \"application/javascript; charset=utf-8\"\n }\n });\n }\n \n // Return 404 for any other paths\n return new Response(\"Not Found\", {\n status: 404,\n headers: {\n \"Content-Type\": \"text/plain\"\n }\n });\n } catch (error) {\n console.error(\"Error serving file:\", error);\n return new Response(`Server Error: ${error.message}`, {\n status: 500,\n headers: {\n \"Content-Type\": \"text/plain\"\n }\n });\n }\n}","http","createdAt",["D",1747325208864],"branchVersion","branchId","1ab6fee8-31a6-11f0-b87b-569c3dd06744","id","1ab6a74a-31a6-11f0-b87b-569c3dd06744","worldclock",["D",1747324993095],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","A simple, interactive world clock","imageUrl","3a4facd0-197a-11f0-a97f-49be2029e0a3","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","9659b6c6-5985-4ad1-8fef-2b6e8ce6def7","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_95":94,"_102":98},"org",{"_95":94,"_96":-5,"_97":98,"_18":55,"_99":100,"_101":25},"branch",{"_13":84,"_32":85,"_43":42,"_86":44,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":45,"_93":94},"isOwned",19,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","evilmathwalnuts","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18ydmpuSzVwNEtyblBsUW9MNjZrUFFpbEdkdEYifQ","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_43":44,"_32":45,"_38":197,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":-5,"_18":55,"_56":-5,"_57":25,"_58":-5,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":198,"_79":199,"_81":200,"_83":25},"tree",[176,177,178,179,180],"files",[176,177,178,179,180],"counts",{"_166":61,"_167":143,"_168":61,"_169":170,"_171":172},"contents",[126,127,128,129,130],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles",true,"grants","orgs","customDomains",{},{"_43":159,"_32":160,"_30":161,"_134":-5,"_41":42,"_40":162,"_136":25,"_38":163,"_13":61,"_33":20,"_35":164,"_24":25,"_139":-5,"_27":165},{"_43":152,"_32":153,"_30":154,"_134":-5,"_41":42,"_40":155,"_136":121,"_38":156,"_13":135,"_33":20,"_35":157,"_24":25,"_139":-5,"_27":158},{"_43":145,"_32":146,"_30":147,"_134":-5,"_41":42,"_40":148,"_136":121,"_38":149,"_13":61,"_33":34,"_35":150,"_24":25,"_139":-5,"_27":151},{"_43":141,"_32":28,"_30":31,"_134":-5,"_41":42,"_40":14,"_136":25,"_38":142,"_13":143,"_33":37,"_35":36,"_24":25,"_139":-5,"_27":144},{"_43":131,"_32":132,"_30":133,"_134":-5,"_41":42,"_40":135,"_136":121,"_38":137,"_13":61,"_33":20,"_35":138,"_24":25,"_139":-5,"_27":140},"4e2126b4-31a6-11f0-b87b-569c3dd06744","style.css","4e212772-31a6-11f0-b87b-569c3dd06744","parentId",2,"latest",["D",1747325079355],"/* Additional custom styles beyond Tailwind */\n#clock {\n font-feature-settings: \"tnum\";\n letter-spacing: 0.05em;\n}\n\n.timezone-option-group {\n font-weight: bold;\n color: #4a5568;\n}\n\n/* Animation for clock updates */\n@keyframes pulse {\n 0% { opacity: 1; }\n 50% { opacity: 0.7; }\n 100% { opacity: 1; }\n}\n\n.time-update {\n animation: pulse 0.5s ease-in-out;\n}","label",[132],"9b532d06-31a6-11f0-a61a-569c3dd06744",["D",1747325208864],1,[28],"5c27cbdc-31a6-11f0-8d22-569c3dd06744","script.js","5c27ccb8-31a6-11f0-8d22-569c3dd06744",3,["D",1747325102881],"document.addEventListener('DOMContentLoaded', () => {\n const clockElement = document.getElementById('clock');\n const dateElement = document.getElementById('date');\n const timezoneElement = document.getElementById('timezone-display');\n const timezoneSelect = document.getElementById('timezone');\n \n // Common timezone groups\n const timezoneGroups = {\n 'Popular': [\n 'America/New_York',\n 'America/Los_Angeles',\n 'Europe/London',\n 'Europe/Paris',\n 'Asia/Tokyo',\n 'Australia/Sydney',\n 'Asia/Dubai',\n 'Asia/Shanghai'\n ],\n 'North America': [\n 'America/New_York',\n 'America/Chicago',\n 'America/Denver',\n 'America/Los_Angeles',\n 'America/Anchorage',\n 'America/Halifax',\n 'America/Toronto',\n 'America/Vancouver'\n ],\n 'Europe': [\n 'Europe/London',\n 'Europe/Paris',\n 'Europe/Berlin',\n 'Europe/Rome',\n 'Europe/Madrid',\n 'Europe/Moscow',\n 'Europe/Athens',\n 'Europe/Istanbul'\n ],\n 'Asia': [\n 'Asia/Tokyo',\n 'Asia/Shanghai',\n 'Asia/Hong_Kong',\n 'Asia/Singapore',\n 'Asia/Dubai',\n 'Asia/Kolkata',\n 'Asia/Seoul',\n 'Asia/Bangkok'\n ],\n 'Pacific': [\n 'Pacific/Honolulu',\n 'Pacific/Auckland',\n 'Pacific/Fiji',\n 'Pacific/Guam'\n ],\n 'Australia': [\n 'Australia/Sydney',\n 'Australia/Melbourne',\n 'Australia/Perth',\n 'Australia/Brisbane'\n ],\n 'South America': [\n 'America/Sao_Paulo',\n 'America/Buenos_Aires',\n 'America/Santiago',\n 'America/Lima'\n ],\n 'Africa': [\n 'Africa/Cairo',\n 'Africa/Johannesburg',\n 'Africa/Lagos',\n 'Africa/Nairobi'\n ]\n };\n\n // Populate timezone dropdown with optgroups\n function populateTimezoneSelect() {\n // Clear existing options\n timezoneSelect.innerHTML = '';\n \n // Add user's local timezone at the top\n const localOption = document.createElement('option');\n localOption.value = 'local';\n localOption.textContent = 'Local Time';\n timezoneSelect.appendChild(localOption);\n \n // Add timezone groups\n for (const [group, timezones] of Object.entries(timezoneGroups)) {\n const optgroup = document.createElement('optgroup');\n optgroup.label = group;\n optgroup.className = 'timezone-option-group';\n \n timezones.forEach(timezone => {\n const option = document.createElement('option');\n option.value = timezone;\n \n // Format the timezone name for display\n const formattedName = timezone.replace('_', ' ').split('/').pop();\n \n // Get current time in this timezone for display\n const timeInZone = new Date().toLocaleTimeString('en-US', { \n timeZone: timezone,\n hour: '2-digit',\n minute: '2-digit',\n hour12: true\n });\n \n option.textContent = `${formattedName} (${timeInZone})`;\n optgroup.appendChild(option);\n });\n \n timezoneSelect.appendChild(optgroup);\n }\n }\n\n // Update the clock display\n function updateClock() {\n const selectedTimezone = timezoneSelect.value;\n const now = new Date();\n let timeOptions, dateOptions;\n \n // Apply the pulse animation\n clockElement.classList.add('time-update');\n setTimeout(() => {\n clockElement.classList.remove('time-update');\n }, 500);\n \n if (selectedTimezone === 'local') {\n // Local time\n timeOptions = { \n hour: '2-digit', \n minute: '2-digit', \n second: '2-digit',\n hour12: false\n };\n \n dateOptions = { \n weekday: 'long', \n year: 'numeric', \n month: 'long', \n day: 'numeric'\n };\n \n timezoneElement.textContent = `Local Time (${Intl.DateTimeFormat().resolvedOptions().timeZone})`;\n } else {\n // Specific timezone\n timeOptions = { \n timeZone: selectedTimezone,\n hour: '2-digit', \n minute: '2-digit', \n second: '2-digit',\n hour12: false\n };\n \n dateOptions = { \n timeZone: selectedTimezone,\n weekday: 'long', \n year: 'numeric', \n month: 'long', \n day: 'numeric'\n };\n \n timezoneElement.textContent = selectedTimezone.replace('_', ' ');\n }\n \n const timeString = now.toLocaleTimeString('en-US', timeOptions);\n const dateString = now.toLocaleDateString('en-US', dateOptions);\n \n clockElement.textContent = timeString;\n dateElement.textContent = dateString;\n }\n\n // Initialize the page\n populateTimezoneSelect();\n \n // Set initial timezone to local\n timezoneSelect.value = 'local';\n \n // Update clock immediately and then every second\n updateClock();\n setInterval(updateClock, 1000);\n \n // Handle timezone changes\n timezoneSelect.addEventListener('change', () => {\n updateClock();\n \n // Update all timezone options with current time\n const optgroups = timezoneSelect.querySelectorAll('optgroup');\n optgroups.forEach(optgroup => {\n const options = optgroup.querySelectorAll('option');\n options.forEach(option => {\n if (option.value !== 'local') {\n const timezone = option.value;\n const formattedName = timezone.replace('_', ' ').split('/').pop();\n \n const timeInZone = new Date().toLocaleTimeString('en-US', { \n timeZone: timezone,\n hour: '2-digit',\n minute: '2-digit',\n hour12: true\n });\n \n option.textContent = `${formattedName} (${timeInZone})`;\n }\n });\n });\n });\n});",[146],"9900eb9c-31a6-11f0-a334-569c3dd06744","index.html","4a7a4e82-31a6-11f0-92f1-569c3dd06744",7,["D",1747325204969],"\n\n\n \n \n World Clock\n \n \n \n\n\n

World Clock

\n \n

\n Select Timezone:\n \n

\n \n

00:00:00

Loading date...

Loading timezone...

\n \n \n \n \n\n",[153],"63080840-31a6-11f0-99fd-569c3dd06744","README.md","63080908-31a6-11f0-99fd-569c3dd06744",4,["D",1747325114421],"# World Clock\n\nA simple, interactive world clock web application that allows users to view the current time in different timezones around the world.\n\n## Features\n\n- Display current time and date\n- Select from a wide range of timezones organized by region\n- Real-time clock updates\n- Responsive design that works on mobile and desktop\n- Visual feedback when time updates\n\n## Implementation Details\n\nThis project is built with:\n\n- Vanilla JavaScript (no frameworks)\n- Tailwind CSS for styling (via CDN)\n- HTML5\n\nThe application uses the browser's built-in `Date` object and `Intl.DateTimeFormat` API to handle timezone conversions and formatting.\n\n## File Structure\n\n- `index.html` - Main HTML file with the clock display and timezone selector\n- `script.js` - JavaScript to handle the clock functionality and timezone selection\n- `style.css` - Additional CSS styles beyond Tailwind\n\n## How It Works\n\n1. The application loads with the user's local timezone selected by default\n2. Users can select a different timezone from the dropdown menu\n3. The clock updates every second to show the current time in the selected timezone\n4. The date and timezone information are also displayed\n\n## Future Improvements\n\n- Add ability to save favorite timezones\n- Add a dark mode toggle\n- Add a map visualization of the selected timezone\n- Add multiple clocks on the same page for comparison",[160],"pulls","branches","forks","envVars",{"_173":61,"_175":61},"connections",{"_173":61,"_174":61},"count","unfilledCount","emptyCount",{"_43":159,"_32":160,"_30":161,"_134":-5,"_41":42,"_40":162,"_136":25,"_38":194,"_13":61,"_33":20,"_35":164,"_24":25,"_139":-5,"_182":195,"_27":196},{"_43":152,"_32":153,"_30":154,"_134":-5,"_41":42,"_40":155,"_136":121,"_38":191,"_13":135,"_33":20,"_35":157,"_24":25,"_139":-5,"_182":192,"_27":193},{"_43":145,"_32":146,"_30":147,"_134":-5,"_41":42,"_40":148,"_136":121,"_38":188,"_13":61,"_33":34,"_35":150,"_24":25,"_139":-5,"_182":189,"_27":190},{"_43":141,"_32":28,"_30":31,"_134":-5,"_41":42,"_40":14,"_136":25,"_38":185,"_13":143,"_33":37,"_35":36,"_24":25,"_139":-5,"_182":186,"_27":187},{"_43":131,"_32":132,"_30":133,"_134":-5,"_41":42,"_40":135,"_136":121,"_38":181,"_13":61,"_33":20,"_35":138,"_24":25,"_139":-5,"_182":183,"_27":184},["D",1747325079355],"children",[],[132],["D",1747325208864],[],[28],["D",1747325102881],[],[146],["D",1747325204969],[],[153],["D",1747325114421],[],[160],["D",1747324993095],{"_95":94,"_102":98},{"_95":94,"_96":-5,"_97":98,"_18":55,"_99":100,"_101":25},{"_13":84,"_32":85,"_43":42,"_86":44,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":45,"_93":94},"ctx",{"_77":-5,"_123":234,"_235":236,"_237":238,"_239":25,"_240":25,"_241":25,"_242":121,"_243":-5,"_244":-7,"_245":-7,"_246":61,"_247":25,"_248":25,"_249":-5,"_250":25,"_251":25,"_252":25,"_253":-5},"ENV",{"_205":206,"_207":208,"_209":85,"_210":211,"_212":213,"_214":215,"_216":217,"_218":219,"_220":221,"_222":223,"_224":225,"_226":227,"_228":229,"_230":231,"_232":233},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","71c1b20804b3232a7e513be260cfffc1932a9e97","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"]

Diff · v8