• Townie
    AI
  • Blog
  • Docs
  • Pricing
  • We’re hiring!
Log inSign up
evilmathwalnuts

evilmathwalnuts

worldclock

A simple, interactive world clock
Public
Like
worldclock
Home
Code
9
MAP-FEATURE-README.md
README.md
index-with-map.html
index.html
script-with-map.js
script.js
server-backup.js
server.js
style.css
Branches
1
Pull requests
Remixes
History
Environment variables
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
Sign up now
Code
/
Code
/
Search
README.md

World Clock

A simple, interactive world clock web application that allows users to view the current time in different timezones around the world.

Features

  • Display current time and date
  • Select from a wide range of timezones organized by region
  • Real-time clock updates
  • Responsive design that works on mobile and desktop
  • Visual feedback when time updates

Implementation Details

This project is built with:

  • Vanilla JavaScript (no frameworks)
  • Tailwind CSS for styling (via CDN)
  • HTML5

The application uses the browser's built-in Date object and Intl.DateTimeFormat API to handle timezone conversions and formatting.

File Structure

  • index.html - Main HTML file with the clock display and timezone selector
  • script.js - JavaScript to handle the clock functionality and timezone selection
  • style.css - Additional CSS styles beyond Tailwind
  • server.js - Server-side code to handle HTTP requests and serve the static files

How It Works

  1. The application loads with the user's local timezone selected by default
  2. Users can select a different timezone from the dropdown menu
  3. The clock updates every second to show the current time in the selected timezone
  4. The date and timezone information are also displayed

Future Improvements

  • Add ability to save favorite timezones
  • Add a dark mode toggle
  • Add multiple clocks on the same page for comparison

Feature Branches

Map Visualization (In Progress)

A feature branch is in progress to add a map visualization of the selected timezone. This feature:

  • Shows an interactive map that highlights the selected timezone location
  • Updates the map view when a different timezone is selected
  • Provides a visual context for the time differences

To test this feature:

  • Access the application with ?map=true parameter
  • Or navigate to /map endpoint

See MAP-FEATURE-README.md for more details.

Code
MAP-FEATURE-README.mdREADME.mdindex-with-map.htmlindex.htmlscript-with-map.jsscript.jsserver-backup.jsserver.jsstyle.css
FeaturesVersion controlCode intelligenceCLI
Use cases
TeamsAI agentsSlackGTM
DocsShowcaseTemplatesNewestTrendingAPI examplesNPM packages
PricingNewsletterBlogAboutCareers
We’re hiring!
Brandhi@val.townStatus
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Terms of usePrivacy policyAbuse contact
© 2025 Val Town, Inc.