diff --git a/docs/architecture.adoc b/docs/architecture.adoc index f06f4a2..ecff24d 100644 --- a/docs/architecture.adoc +++ b/docs/architecture.adoc @@ -59,9 +59,11 @@ view (`public/js/map.js`) offers two styles: `GET /api/offline-tiles` reports whether `data/offline.pmtiles` is present (`{"available": true|false}`); the frontend uses it once, on -load, to default to the offline style when local tile data exists — -otherwise it defaults to the online style. Either way, the layer -toggle in the top-left of the map lets the user switch manually. +load, to default to the offline style when local tile data exists. +When it doesn't, `LayerToggleControl#remove()` (`public/js/map.js`) +removes the Online/Offline sidebar icon entirely — a switch offering a +choice that can't work is worse than no switch at all — so it's only +ever shown on an install that actually has a PMTiles file to switch to. PMTiles is a single, self-indexed file, which is why this needs no tile-decoding logic on the server: `app.rb`'s `/tiles/offline.pmtiles` diff --git a/public/js/map.js b/public/js/map.js index 3ba1723..542e1a7 100644 --- a/public/js/map.js +++ b/public/js/map.js @@ -101,6 +101,14 @@ class LayerToggleControl { button.classList.toggle("active", button.dataset.style === name); }); } + + // Called once it's known there's no offline map to switch to (see the + // /api/offline-tiles check below) — an Online/Offline switch doesn't make + // sense to show at all when Offline was never going to work. + remove() { + this._container.remove(); + this._panel.hidden = true; + } } const map = new MaplibreMap({ @@ -145,12 +153,21 @@ function applyStyle(name) { } // If a local PMTiles file is present, prefer it as the default style — its -// presence signals the app is meant to be used offline here. +// presence signals the app is meant to be used offline here. If one isn't, +// the Online/Offline switch itself doesn't make sense (there's nothing to +// switch to), so it's removed entirely rather than left sitting there +// offering a choice that can't work. fetch("/api/offline-tiles") .then((response) => response.json()) .then(({ available }) => { - if (available) applyStyle("offline"); + if (available) { + applyStyle("offline"); + } else { + layerToggle.remove(); + } }) .catch(() => { - // Backend check failed; keep the online style. + // Backend check failed; keep the online style and leave the switch as + // is rather than guessing — this is the same-origin request itself + // failing, not evidence offline tiles are actually unavailable. });