Skip to content

Latest commit

 

History

24 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Tide Glass

A tide chart web app for NOAA tide prediction stations, built with Flask. It opens on station 9410580 — Newport Beach, Newport Bay Entrance, California (Pacific Time); the search box in the masthead switches to any of NOAA's ~3,500 prediction stations (/station/<id>). Predictions (6-minute curve + high/low events) come from the NOAA CO-OPS API.

Run

python3 -m venv .venv
./.venv/bin/pip install -r requirements.txt
./.venv/bin/python app.py   # serves on http://0.0.0.0:26725

Run the regression suite with:

TIDES_SKIP_WARM=1 MEMCACHED= ./.venv/bin/python -m unittest discover -s tests -v

The PWA icons are generated from artwork/icon-source.svg. After installing rsvg-convert (Debian package librsvg2-bin), rebuild them reproducibly with scripts/generate_icons.sh.

Features

  • Current conditions under the title, from Open-Meteo (no API key): sky, air temperature, wind, humidity, plus sea surface temperature and wave height/period from its marine model where available. Served via /api/weather?station=, cached 10 minutes per station, refreshed every 10 minutes in the page.

  • Station search with autocomplete (top right, or press /): matches on station name, state, and id against NOAA's station directory, which the server fetches once a day (/api/stations?q=). Picking a station navigates to /station/<id>; the page title, masthead, time zone, sunrise/sunset, and theme all follow the station. Subordinate stations only publish highs and lows, so their curve is a half-cosine fit between extremes (noted under the chart).

  • Animated three.js ocean background (vendored locally, no CDN): a low-poly shader sea whose swell follows the real tide — calmer near low tide, fuller near high tide. Theme-aware, pauses when the tab is hidden, renders a single static frame under prefers-reduced-motion, and degrades to a CSS sky gradient without WebGL.

  • The sky and water follow the actual sun at the station: the server computes sunrise/sunset (NOAA sunrise equation) and the scene blends through night, dawn, day, golden hour, and dusk in real time, with a sun glow that tracks the phase. Preview any phase with ?phase=night|dawn|day|golden|dusk; the dark theme deepens the palette without losing the hour.

  • Installable progressive web app with standalone display, safe-area-aware mobile layout, cached app shell and visited-station data, offline fallback, and automatic service-worker updates. Use the in-app Install button where supported, or the browser's Add to Home Screen action.

  • Branded 1200×675 PNG tide snapshots for the selected station and date range, including a timezone-correct curve, highs/lows, observed levels when available, NOAA attribution, and a safety disclaimer. The Share snapshot button opens the native file share sheet where supported and otherwise downloads the image. Heights in the image are labeled in feet above MLLW, and all dates and times use the selected station's timezone.

  • Today / 3-day / 7-day views (?days=1|3|7; last choice remembered). The light/dark theme follows real day and night at the station — dark once dusk settles, light before dawn (?theme=light|dark forces one for preview)

  • Smooth 6-minute prediction curve with labeled high/low markers, "Now" line, crosshair + tooltip (mouse or arrow keys), and a high/low table view

  • Slack water — when the tidal current stops and turns — at stations with a NOAA current prediction station within 2 miles (CURRENT_RADIUS_MI; about a quarter of tide stations, e.g. /station/8518699 → Corlears Hook). Slack is a property of the current, not the water level, and can land an hour or more off high/low, so it comes from NOAA's currents_predictions (interval=MAX_SLACK, near-surface bin) rather than the tide curve: a "Next slack water" tile, hollow rings on the curve, flood/ebb in the tooltip, and a slack & max-current table. Stations with no current station nearby (including the default, Newport Beach) show none of it.

  • Stat tiles: predicted height now (rising/falling), next high, next low, and today's range (or the latest observed water level vs. prediction, at stations with a live sensor)

  • Server-side caching of upstream responses (10 min predictions, 2 min observations, 10 min weather, 24 h station directories, 7 d station metadata) in memcached — MEMCACHED env, default 127.0.0.1:11211, set it empty to disable — so restarts don't refetch; a per-process dict fronts it and takes over if memcached is down. Data auto-refreshes every 5 minutes

Heights are in feet above MLLW; times are station-local. Not for navigation.

About

Tide chart for NOAA stations with live weather, liquid-glass UI, and an animated ocean

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages