An offline-first single html-file page that follows your train across Finland and records how good the mobile connection is along the way, so the next trip on the same line can tell you when the connection comes back.
- Download or clone this repository.
- Double-click
start.commandon a Mac, or run./start.shon Linux. It serves the folder onhttp://localhost:8080/and opens it in your browser. Openingindex.htmlstraight from the file works too, with one difference: browsers forget notification permission for a file-opened page, so alerts then show only inside the page. - Pick your departure and arrival stations. The train fills itself in, or type one, as
IC 63,IC63or63. With changes on the way, press "Add a connecting train" for each change and give its stations and train, asKiskobussi 429from the ticket or just429; the page follows the first train, switches to the next when it arrives, and tells you the onward train and its track before each change.
That is all it needs. The page tells you on screen if something is missing. The map background wants a free key from CARTO: copy config.example.js to config.js, paste the key in and reload.
A trip can also be preset in the address: index.html?train=63&from=PM&to=OL, with Digitraffic's station codes.
🚆 Follows your train live, with speed, the real track and every stop, and keeps the map pinned to it.
🔁 Handles journeys with changes: enter every train at once, and the page switches at each change and names the onward train and its track.
📶 Measures latency every 5 seconds and bandwidth every 2 minutes, from a web worker that keeps going in a hidden tab.
🗺️ Paints the track and 1.2 km hexagons by connection quality, green, yellow, orange, red for offline and grey for time with no samples, with the measured median in each hexagon's tooltip.
🔮 Forecasts the connection ahead: dead zones, when it comes back, when it gets faster, in minutes at the train's speed, from your own trips first and Speedtest data where you have none.
📈 Gets more precise with every trip on a line, in either direction; trips older than 30 days fold into the coverage map so storage never fills.
🔔 Alerts for dead zones ahead, drops, recoveries, slowdowns, bandwidth, next stop, arrival and delay changes, each with its own tone, a card on the page, the tab title and a system banner.
🗼 Shows every mapped mast in Finland as a beacon, coloured by operator where OpenCelliD knows it, the Speedtest coverage around them, and the nearest mast to the train.
📍 Route line at the bottom with all stops, the next one with its time, the delay, and the connection quality of every stretch travelled, plus the best and worst stretch of the trip.
⏱️ Counts down to the destination to the second, and shows bandwidth and speed in the tab title with a tab icon that glows with the connection.
📴 Works offline: Leaflet, the station list, the timetable, the track, the samples and the map tiles along the route are kept in the browser.
💾 Keeps every trip in the browser, asks you to export on arrival, and imports the file back into a cleared browser or another computer.
Every 5 seconds the page sends a 300-byte request to Cloudflare and times the answer. Two unanswered requests in a row count as offline. Coming back takes more than one answer: two 50 KB downloads in a row have to finish within 6 seconds each, so a link that answers pings but cannot load a page still counts as offline, and a one-second blip does not set off a drop and a recovery alert. Every 2 minutes it downloads 2 MB from Cloudflare to measure bandwidth, because the browser's own estimate stops at 10 Mbps. The measuring runs in a web worker, which Chrome does not slow down in a hidden tab, so samples, the tab icon and alerts keep going while you browse elsewhere. The one thing that can stop it is Chrome's Memory Saver discarding the tab after a long time unused; turn Memory Saver off or add the page to its exceptions under chrome://settings/performance if you leave the page hidden for an hour or more.
The train's position and speed come from Digitraffic every 15 seconds. While offline, the position is moved along the track at the last known speed, so dead zones are painted roughly where they happened. The track is the same train's GPS trail from an earlier day, fetched once per train.
The forecast reads two things: the 1.2 km hexagons built from every trip logged in this browser, and under them Ookla's Speedtest results for Finland in 610 m tiles, merged from the last four quarters and shipped in data/fi-mobile.js. Your own trips win wherever they exist, and the forecast line says which source it used. Where no one has run a Speedtest within 3 km of the track, the forecast expects no signal.
Press "Alerts" to choose which ones you want; the same panel has an "Enable system notifications" button and a test button. Every alert shows a card on the page, plays a short tone, puts its text in the tab title for 20 seconds, and the panel keeps the last one together with what became of the system banner. A system banner comes on top of that once notifications are allowed, which sticks when the page was started with start.command or start.sh; a browser forgets the grant for a page opened straight from the file.
The alerts are: a dead zone 3 minutes ahead and again under a minute ahead, the connection dropping, when it is expected back, when it is back, when it is slow for half a minute, when it gets faster, when faster coverage is 2 minutes ahead, bandwidth collapsing under 1 Mbps or recovering, the next stop 2 minutes out, the destination 10 and 2 minutes out, the train's delay changing by 3 minutes or more, and arrival. Bad news falls in tone, good news rises, information is two even notes.
Two things on the computer decide whether you see the banners. On macOS the browser must be allowed under System Settings, Notifications, and a Focus mode such as Do Not Disturb hides them unless the browser is on that Focus mode's allowed list; a web page cannot get past Focus by itself.
Leaflet is in the repository, and the station list, timetable, track and samples are kept in the browser, so a trip that was set up once comes back without a connection. While online, the page fetches the map tiles along every train of the journey at zooms 8 to 13, and the view one zoom in and out whenever the map moves, six at a time so the downloads do not crowd the connection. Started with start.command or start.sh, a service worker keeps the page and every tile it has seen; opened straight from the file, tiles rely on the browser's own cache instead.
After cloning, run git config core.hooksPath .githooks once. A pre-commit hook then keeps version.js in step with the changelog. The page shows the version bottom right, with the checked-out commit when it is served from the folder. Every batch of changes gets a changelog entry, and a push that touches CHANGELOG.md publishes the release.
- Train positions, timetables and the track: Fintraffic Digitraffic, CC BY 4.0.
- Map tiles: CARTO on OpenStreetMap data.
- Latency and bandwidth:
cp.cloudflare.comandspeed.cloudflare.com. - Coverage baseline: Speedtest by Ookla Global Mobile Network Performance Maps, CC BY-NC-SA 4.0, in
data/fi-mobile.js. - Masts: every communication mast mapped in OpenStreetMap, ODbL, with cell data from OpenCelliD, CC BY-SA 4.0, attached where a cell was seen within 1.2 km, in
data/fi-cells.js. A mast with cell data pulses in its operator's colour, Elisa blue, Telia purple, DNA pink; a mast without it pulses grey; a cell seen from the road with no mapped mast near it sits dim and still. Hover a mast for the operator, the technologies and how far away it has been measured from. It is what volunteers and app users have recorded, so it is far from every base station in the country.
Those licences cover the two data files only; the code is MIT. Nothing else leaves the browser. Every trip stays in the browser's storage for the address you use and sharpens the forecast on that line the next time. On arrival the page asks you to export: the file holds every trip logged so far, and Import on the first screen puts it all back.