Cities with Internet: on a phone the legend folds behind one button, like Gospel Resources'

Fully open, the legend took 297px of a 712px phone map, 86% of its width, with the India-by-state block and both caveats always showing, and there was no way to shut it. On a phone (under 700px, Gospel Resources' breakpoint) the title stays and the rest folds behind "Key & notes": folded by default, remembered for the session, and a remembered choice wins over the width default. Desktop is unchanged. Two new strings, in all eleven locales. Rebuilds cities-internet only, with its three pages and the two manifests.
2026-09-30 02:45:14 +00:00 · 2026-09-30 02:45:14 +00:00 · ed374bdb9f
commit ed374bdb9f
parent bff75e0995
18 changed files with 138 additions and 53 deletions
--- a/library/i18n/locales/ar/connectivity.json
+++ b/library/i18n/locales/ar/connectivity.json
@ -65,5 +65,9 @@
    "source": "المسح NFHS-5 (2019–2021)، الأشخاص من 15 إلى 49 عامًا: نسبة من سبق لهم استخدام الإنترنت. مسح للأشخاص، لا عدد للاشتراكات.",
    "missing": "لا توجد بعد حدود ولاية لـ {names}: أرقامها موجودة في البيانات، لا على الخريطة."
  },
-  "loading": "جارٍ رسم الخريطة…"
+  "loading": "جارٍ رسم الخريطة…",
+  "ui": {
+    "showKey": "المفتاح والملاحظات",
+    "hideKey": "إخفاء المفتاح والملاحظات"
+  }
 }
--- a/library/i18n/locales/de/connectivity.json
+++ b/library/i18n/locales/de/connectivity.json
@ -65,5 +65,9 @@
    "source": "NFHS-5 (2019–21), Personen im Alter von 15–49 Jahren: Anteil derer, die das Internet schon einmal genutzt haben. Eine Befragung von Menschen, keine Zählung von Anschlüssen.",
    "missing": "Noch keine Staatsgrenze für {names}: Ihre Werte stehen in den Daten, nicht auf der Karte."
  },
-  "loading": "Karte wird gezeichnet…"
+  "loading": "Karte wird gezeichnet…",
+  "ui": {
+    "showKey": "Legende & Hinweise",
+    "hideKey": "Legende & Hinweise ausblenden"
+  }
 }
--- a/library/i18n/locales/en/connectivity.json
+++ b/library/i18n/locales/en/connectivity.json
@ -65,5 +65,9 @@
    "source": "NFHS-5 (2019–21), people aged 15–49: the share who have ever used the internet. A survey of people, not a count of subscriptions.",
    "missing": "No state boundary yet for {names}: their figures are in the data, not on the map."
  },
-  "loading": "Drawing the map…"
+  "loading": "Drawing the map…",
+  "ui": {
+    "showKey": "Key & notes",
+    "hideKey": "Hide key & notes"
+  }
 }
--- a/library/i18n/locales/es/connectivity.json
+++ b/library/i18n/locales/es/connectivity.json
@ -65,5 +65,9 @@
    "source": "NFHS-5 (2019–21), personas de 15 a 49 años: proporción que ha usado internet alguna vez. Una encuesta a personas, no un recuento de suscripciones.",
    "missing": "Aún no hay límite estatal para {names}: sus cifras están en los datos, no en el mapa."
  },
-  "loading": "Dibujando el mapa…"
+  "loading": "Dibujando el mapa…",
+  "ui": {
+    "showKey": "Clave y notas",
+    "hideKey": "Ocultar clave y notas"
+  }
 }
--- a/library/i18n/locales/fr/connectivity.json
+++ b/library/i18n/locales/fr/connectivity.json
@ -65,5 +65,9 @@
    "source": "NFHS-5 (2019–21), personnes de 15 à 49 ans : part de celles qui ont déjà utilisé Internet. Une enquête auprès des personnes, pas un décompte d’abonnements.",
    "missing": "Pas encore de limite d’État pour {names} : leurs chiffres figurent dans les données, pas sur la carte."
  },
-  "loading": "Tracé de la carte…"
+  "loading": "Tracé de la carte…",
+  "ui": {
+    "showKey": "Légende et notes",
+    "hideKey": "Masquer la légende et les notes"
+  }
 }
--- a/library/i18n/locales/hi/connectivity.json
+++ b/library/i18n/locales/hi/connectivity.json
@ -65,5 +65,9 @@
    "source": "NFHS-5 (2019–21), 15–49 वर्ष के लोग: जिन्होंने कभी इंटरनेट का उपयोग किया है उनका प्रतिशत। यह लोगों का सर्वेक्षण है, सब्सक्रिप्शन की गिनती नहीं।",
    "missing": "{names} की राज्य सीमा अभी उपलब्ध नहीं है: उनके आँकड़े डेटा में हैं, नक्शे पर नहीं।"
  },
-  "loading": "मानचित्र बनाया जा रहा है…"
+  "loading": "मानचित्र बनाया जा रहा है…",
+  "ui": {
+    "showKey": "कुंजी और टिप्पणियाँ",
+    "hideKey": "कुंजी और टिप्पणियाँ छिपाएँ"
+  }
 }
--- a/library/i18n/locales/it/connectivity.json
+++ b/library/i18n/locales/it/connectivity.json
@ -65,5 +65,9 @@
    "source": "NFHS-5 (2019–21), persone di 15–49 anni: quota di chi ha mai usato internet. Un’indagine sulle persone, non un conteggio di abbonamenti.",
    "missing": "Ancora nessun confine statale per {names}: i loro dati sono nel dataset, non sulla mappa."
  },
-  "loading": "Disegno della mappa…"
+  "loading": "Disegno della mappa…",
+  "ui": {
+    "showKey": "Legenda e note",
+    "hideKey": "Nascondi legenda e note"
+  }
 }
--- a/library/i18n/locales/pt/connectivity.json
+++ b/library/i18n/locales/pt/connectivity.json
@ -65,5 +65,9 @@
    "source": "NFHS-5 (2019–21), pessoas de 15 a 49 anos: proporção que já usou a internet. Uma pesquisa com pessoas, não uma contagem de assinaturas.",
    "missing": "Ainda não há limite estadual para {names}: os números estão nos dados, não no mapa."
  },
-  "loading": "Desenhando o mapa…"
+  "loading": "Desenhando o mapa…",
+  "ui": {
+    "showKey": "Legenda e notas",
+    "hideKey": "Ocultar legenda e notas"
+  }
 }
--- a/library/i18n/locales/ro/connectivity.json
+++ b/library/i18n/locales/ro/connectivity.json
@ -65,5 +65,9 @@
    "source": "NFHS-5 (2019–21), persoane de 15–49 de ani: ponderea celor care au folosit vreodată internetul. Un sondaj despre oameni, nu o numărătoare de abonamente.",
    "missing": "Încă nu există limită de stat pentru {names}: cifrele lor sunt în date, nu pe hartă."
  },
-  "loading": "Se desenează harta…"
+  "loading": "Se desenează harta…",
+  "ui": {
+    "showKey": "Legendă și note",
+    "hideKey": "Ascunde legenda și notele"
+  }
 }
--- a/library/i18n/locales/ru/connectivity.json
+++ b/library/i18n/locales/ru/connectivity.json
@ -65,5 +65,9 @@
    "source": "NFHS-5 (2019–21), люди 15–49 лет: доля тех, кто когда-либо пользовался интернетом. Опрос людей, а не подсчёт подписок.",
    "missing": "Для {names} ещё нет границы штата: их данные есть в таблице, но не на карте."
  },
-  "loading": "Отрисовка карты…"
+  "loading": "Отрисовка карты…",
+  "ui": {
+    "showKey": "Легенда и примечания",
+    "hideKey": "Скрыть легенду и примечания"
+  }
 }
--- a/library/i18n/locales/zh/connectivity.json
+++ b/library/i18n/locales/zh/connectivity.json
@ -65,5 +65,9 @@
    "source": "NFHS-5（2019–21），15–49 岁人群：曾经使用过互联网的比例。这是对人的调查，而不是订阅数统计。",
    "missing": "{names} 尚无邦界：其数据在数据集中，但未显示在地图上。"
  },
-  "loading": "正在绘制地图…"
+  "loading": "正在绘制地图…",
+  "ui": {
+    "showKey": "图例和说明",
+    "hideKey": "隐藏图例和说明"
+  }
 }
--- a/plugin-designs/cities-internet/connectivity-map.vue
+++ b/plugin-designs/cities-internet/connectivity-map.vue
@ -228,6 +228,36 @@ function paintGroups(map) {
 // a placeholder for a NULL value where this fill() rendered the string "null".
 const t = useOptionalT('connectivity')

+// ── The legend folds on a phone (Gospel Resources' pattern) ──────────────────────────────────
+// Fully open, this legend took 297px of a 712px phone map, 86% of its width, with the India block
+// and both caveats always showing. On a phone the title stays and the rest folds behind one button:
+// folded, not deleted, because the caveats are what stop a national figure being read as a city's.
+// Desktop is unchanged: always open, no control. The choice is remembered for the SESSION
+// (sessionStorage, wrapped because a sandboxed embed throws on access), and a remembered choice
+// wins over the width default, so crossing the breakpoint never reopens what the reader closed.
+const narrow = ref(false)
+const legendOpen = ref(true)
+const LEGEND_KEY = 'ci.legendOpen'
+function rememberLegend(v) {
+  try { window.sessionStorage?.setItem(LEGEND_KEY, v ? '1' : '0') } catch (_) {}
+}
+function recallLegend() {
+  try { const v = window.sessionStorage?.getItem(LEGEND_KEY); return v == null ? null : v === '1' }
+  catch (_) { return null }
+}
+function toggleLegend() { legendOpen.value = !legendOpen.value; rememberLegend(legendOpen.value) }
+function syncNarrow() {
+  const n = typeof window !== 'undefined' && window.innerWidth < 700
+  if (n === narrow.value) return
+  narrow.value = n
+  const remembered = recallLegend()
+  legendOpen.value = remembered == null ? !n : remembered
+}
+if (typeof window !== 'undefined') {
+  syncNarrow()
+  window.addEventListener('resize', syncNarrow)
+}
+
 // Bands, not a continuous ramp: a reader can hold four categories, not a gradient.
 const BANDS = [
  { id: 'yes',     color: '#10b981' },
@ -455,6 +485,7 @@ onMounted(async () => {
  } catch (e) { err.value = String(e.message || e); loading.value = false }
 })
 onBeforeUnmount(() => {
+  if (typeof window !== 'undefined') window.removeEventListener('resize', syncNarrow)
  // ★ RELEASE THE TEST HOOKS. Each pins whatever it closes over — a map instance pins its
  // canvas, its sources, and through them the whole app — so every mount that leaves one behind
  // leaks another copy, measured at roughly 10 MB each.
@ -516,6 +547,10 @@ useShadowStyles(
  '@media(max-width:480px){.gm-legend{width:auto;inset-inline-end:46px}}' +
  '.is-dark .gm-legend{background:rgba(19,32,25,.95);color:#e5e7eb}' +
  '.gm-title{font-weight:700;font-size:12.5px;margin-bottom:5px}' +
+  // The phone fold button: Gospel Resources' .gm-fold, with its 44px touch target on a phone.
+  '.gm-fold{width:100%;margin:0 0 6px;border:1px solid #d1d4cd;background:#f3f3f1;color:#3b463d;font:600 11px inherit;padding:6px 10px;border-radius:8px;cursor:pointer;min-height:32px}' +
+  '.gm-fold:hover{background:#e9ebe6}' +
+  '@media(max-width:699px){.gm-fold{min-height:44px;font-size:12px}}' +
  '.gm-keys{display:flex;flex-wrap:wrap;gap:5px 12px}' +
  '.gm-key{display:flex;align-items:center;gap:5px;font-size:11px;white-space:nowrap}' +
  '.gm-sw{width:12px;height:12px;border-radius:3px;flex:none}' +
@ -581,6 +616,11 @@ useShadowStyles(

    <div v-show="!groupOpen" class="gm-legend">
      <div class="gm-title">{{ t('connectivity.title') }}</div>
+      <button v-if="narrow" type="button" class="gm-fold" @click="toggleLegend"
+              :aria-expanded="legendOpen ? 'true' : 'false'">
+        {{ legendOpen ? t('connectivity.ui.hideKey') : t('connectivity.ui.showKey') }}
+      </button>
+      <div v-show="!narrow || legendOpen" class="gm-body">
      <div class="gm-keys">
        <span v-for="b in BANDS" :key="b.id" class="gm-key">
          <i class="gm-sw" :style="{ background: b.color }"></i>{{ t('connectivity.bands.' + b.id) }}
@ -607,6 +647,7 @@ useShadowStyles(
        <div class="gm-caveat">{{ t('connectivity.adm1.source') }}</div>
        <div v-if="adm1Missing" class="gm-caveat">{{ t('connectivity.adm1.missing', { names: adm1Missing }) }}</div>
      </div>
+      </div>
    </div>

    <!-- An error REPLACES the wait, never stacks on it: v-else-if, so a failed load does not leave
--- a/public/dx-maps/cities-internet/cities-internet.js
+++ b/public/dx-maps/cities-internet/cities-internet.js
--- a/public/dx-maps/cities-internet/connectivity-list/index.html
+++ b/public/dx-maps/cities-internet/connectivity-list/index.html
@ -61,7 +61,7 @@

  <script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
  <!-- Bundle IIFE — registers the <cities-internet-map> custom element. -->
-  <script src="../cities-internet.js" integrity="sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z" crossorigin="anonymous"></script>
+  <script src="../cities-internet.js" integrity="sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C" crossorigin="anonymous"></script>

  <script>
    // Mapbox token resolution — the A3 ladder, in precedence order:
--- a/public/dx-maps/cities-internet/connectivity-map/index.html
+++ b/public/dx-maps/cities-internet/connectivity-map/index.html
@ -70,7 +70,7 @@

  <script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
  <!-- Bundle IIFE — registers the <cities-internet-map> custom element. -->
-  <script src="../cities-internet.js" integrity="sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z" crossorigin="anonymous"></script>
+  <script src="../cities-internet.js" integrity="sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C" crossorigin="anonymous"></script>

  <script>
    // Mapbox token resolution — the A3 ladder, in precedence order:
--- a/public/dx-maps/cities-internet/data-tables/index.html
+++ b/public/dx-maps/cities-internet/data-tables/index.html
@ -61,7 +61,7 @@

  <script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
  <!-- Bundle IIFE — registers the <cities-internet-map> custom element. -->
-  <script src="../cities-internet.js" integrity="sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z" crossorigin="anonymous"></script>
+  <script src="../cities-internet.js" integrity="sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C" crossorigin="anonymous"></script>

  <script>
    // Mapbox token resolution — the A3 ladder, in precedence order:
--- a/public/dx-maps/doxa-maps-spa/manifest.json
+++ b/public/dx-maps/doxa-maps-spa/manifest.json
@ -110,7 +110,7 @@
      "bundle": "cities-internet",
      "scriptUrl": "./cities-internet/cities-internet.js",
      "output": "dx-maps/cities-internet/cities-internet.js",
-      "integrity": "sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z",
+      "integrity": "sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C",
      "elements": [
        "cities-internet-map"
      ],
@ -129,7 +129,7 @@
          "scriptUrl": "./cities-internet/cities-internet.js",
          "embed": {
            "iframe": "<iframe src=\"./cities-internet/connectivity-list/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
-            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z\" crossorigin=\"anonymous\"></script>\n<!-- provider: \"maplibre\" is the default; change it to \"mapbox\" and fill tk to use Mapbox. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-list\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
+            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C\" crossorigin=\"anonymous\"></script>\n<!-- provider: \"maplibre\" is the default; change it to \"mapbox\" and fill tk to use Mapbox. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-list\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
          }
        },
        {
@ -145,8 +145,8 @@
          "scriptUrl": "./cities-internet/cities-internet.js",
          "embed": {
            "iframe": "<iframe src=\"./cities-internet/connectivity-map/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
-            "script": "<!-- MapLibre engine (the default), fetched early -->\n<link rel=\"preload\" as=\"script\" href=\"https://cdn.jsdelivr.net/npm/maplibre-gl@5.24.0/dist/maplibre-gl.js\" integrity=\"sha384-5+cfbwT0iiub6VsQAdn6yz16nr6sDiQoHx6tm4O8OVYXHYOxcffFmCJBL0dgdvGp\" crossorigin=\"anonymous\">\n<link rel=\"preload\" as=\"style\" href=\"https://cdn.jsdelivr.net/npm/maplibre-gl@5.24.0/dist/maplibre-gl.css\" integrity=\"sha384-uTttxo/aOKbdE5RlD/SPzSDoDmNvGlUYPjONi2MN/b7c9HPSvW07OIuyP7uL6jxK\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z\" crossorigin=\"anonymous\"></script>\n<!-- MapLibre draws this map and needs no token. For Mapbox, paste this map's embed.scriptMapbox from manifest.json instead: it sets \"provider\":\"mapbox\" and preloads the Mapbox engine; fill \"tk\" with your token. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-map\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>",
-            "scriptMapbox": "<!-- Mapbox engine, fetched early -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<link rel=\"preload\" as=\"style\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.css\" integrity=\"sha384-rp1X/jJ9MpWPef9OimfXhOaOc4Gzs87yQvF+ajwY6X2H4PTeHNycNlLWiWvj7ehV\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z\" crossorigin=\"anonymous\"></script>\n<!-- Mapbox draws this map: fill \"tk\" with your Mapbox token. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-map\",\"provider\":\"mapbox\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
+            "script": "<!-- MapLibre engine (the default), fetched early -->\n<link rel=\"preload\" as=\"script\" href=\"https://cdn.jsdelivr.net/npm/maplibre-gl@5.24.0/dist/maplibre-gl.js\" integrity=\"sha384-5+cfbwT0iiub6VsQAdn6yz16nr6sDiQoHx6tm4O8OVYXHYOxcffFmCJBL0dgdvGp\" crossorigin=\"anonymous\">\n<link rel=\"preload\" as=\"style\" href=\"https://cdn.jsdelivr.net/npm/maplibre-gl@5.24.0/dist/maplibre-gl.css\" integrity=\"sha384-uTttxo/aOKbdE5RlD/SPzSDoDmNvGlUYPjONi2MN/b7c9HPSvW07OIuyP7uL6jxK\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C\" crossorigin=\"anonymous\"></script>\n<!-- MapLibre draws this map and needs no token. For Mapbox, paste this map's embed.scriptMapbox from manifest.json instead: it sets \"provider\":\"mapbox\" and preloads the Mapbox engine; fill \"tk\" with your token. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-map\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>",
+            "scriptMapbox": "<!-- Mapbox engine, fetched early -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<link rel=\"preload\" as=\"style\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.css\" integrity=\"sha384-rp1X/jJ9MpWPef9OimfXhOaOc4Gzs87yQvF+ajwY6X2H4PTeHNycNlLWiWvj7ehV\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C\" crossorigin=\"anonymous\"></script>\n<!-- Mapbox draws this map: fill \"tk\" with your Mapbox token. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-map\",\"provider\":\"mapbox\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
          }
        },
        {
@ -162,7 +162,7 @@
          "scriptUrl": "./cities-internet/cities-internet.js",
          "embed": {
            "iframe": "<iframe src=\"./cities-internet/data-tables/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
-            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z\" crossorigin=\"anonymous\"></script>\n<!-- provider: \"maplibre\" is the default; change it to \"mapbox\" and fill tk to use Mapbox. -->\n<cities-internet-map profile-config='{\"profile\":\"data-tables\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
+            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C\" crossorigin=\"anonymous\"></script>\n<!-- provider: \"maplibre\" is the default; change it to \"mapbox\" and fill tk to use Mapbox. -->\n<cities-internet-map profile-config='{\"profile\":\"data-tables\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
          }
        }
      ]
--- a/public/dx-maps/manifest.json
+++ b/public/dx-maps/manifest.json
@ -110,7 +110,7 @@
      "bundle": "cities-internet",
      "scriptUrl": "./cities-internet/cities-internet.js",
      "output": "dx-maps/cities-internet/cities-internet.js",
-      "integrity": "sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z",
+      "integrity": "sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C",
      "elements": [
        "cities-internet-map"
      ],
@ -129,7 +129,7 @@
          "scriptUrl": "./cities-internet/cities-internet.js",
          "embed": {
            "iframe": "<iframe src=\"./cities-internet/connectivity-list/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
-            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z\" crossorigin=\"anonymous\"></script>\n<!-- provider: \"maplibre\" is the default; change it to \"mapbox\" and fill tk to use Mapbox. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-list\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
+            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C\" crossorigin=\"anonymous\"></script>\n<!-- provider: \"maplibre\" is the default; change it to \"mapbox\" and fill tk to use Mapbox. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-list\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
          }
        },
        {
@ -145,8 +145,8 @@
          "scriptUrl": "./cities-internet/cities-internet.js",
          "embed": {
            "iframe": "<iframe src=\"./cities-internet/connectivity-map/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
-            "script": "<!-- MapLibre engine (the default), fetched early -->\n<link rel=\"preload\" as=\"script\" href=\"https://cdn.jsdelivr.net/npm/maplibre-gl@5.24.0/dist/maplibre-gl.js\" integrity=\"sha384-5+cfbwT0iiub6VsQAdn6yz16nr6sDiQoHx6tm4O8OVYXHYOxcffFmCJBL0dgdvGp\" crossorigin=\"anonymous\">\n<link rel=\"preload\" as=\"style\" href=\"https://cdn.jsdelivr.net/npm/maplibre-gl@5.24.0/dist/maplibre-gl.css\" integrity=\"sha384-uTttxo/aOKbdE5RlD/SPzSDoDmNvGlUYPjONi2MN/b7c9HPSvW07OIuyP7uL6jxK\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z\" crossorigin=\"anonymous\"></script>\n<!-- MapLibre draws this map and needs no token. For Mapbox, paste this map's embed.scriptMapbox from manifest.json instead: it sets \"provider\":\"mapbox\" and preloads the Mapbox engine; fill \"tk\" with your token. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-map\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>",
-            "scriptMapbox": "<!-- Mapbox engine, fetched early -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<link rel=\"preload\" as=\"style\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.css\" integrity=\"sha384-rp1X/jJ9MpWPef9OimfXhOaOc4Gzs87yQvF+ajwY6X2H4PTeHNycNlLWiWvj7ehV\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z\" crossorigin=\"anonymous\"></script>\n<!-- Mapbox draws this map: fill \"tk\" with your Mapbox token. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-map\",\"provider\":\"mapbox\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
+            "script": "<!-- MapLibre engine (the default), fetched early -->\n<link rel=\"preload\" as=\"script\" href=\"https://cdn.jsdelivr.net/npm/maplibre-gl@5.24.0/dist/maplibre-gl.js\" integrity=\"sha384-5+cfbwT0iiub6VsQAdn6yz16nr6sDiQoHx6tm4O8OVYXHYOxcffFmCJBL0dgdvGp\" crossorigin=\"anonymous\">\n<link rel=\"preload\" as=\"style\" href=\"https://cdn.jsdelivr.net/npm/maplibre-gl@5.24.0/dist/maplibre-gl.css\" integrity=\"sha384-uTttxo/aOKbdE5RlD/SPzSDoDmNvGlUYPjONi2MN/b7c9HPSvW07OIuyP7uL6jxK\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C\" crossorigin=\"anonymous\"></script>\n<!-- MapLibre draws this map and needs no token. For Mapbox, paste this map's embed.scriptMapbox from manifest.json instead: it sets \"provider\":\"mapbox\" and preloads the Mapbox engine; fill \"tk\" with your token. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-map\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>",
+            "scriptMapbox": "<!-- Mapbox engine, fetched early -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<link rel=\"preload\" as=\"style\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.css\" integrity=\"sha384-rp1X/jJ9MpWPef9OimfXhOaOc4Gzs87yQvF+ajwY6X2H4PTeHNycNlLWiWvj7ehV\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C\" crossorigin=\"anonymous\"></script>\n<!-- Mapbox draws this map: fill \"tk\" with your Mapbox token. -->\n<cities-internet-map profile-config='{\"profile\":\"connectivity-map\",\"provider\":\"mapbox\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
          }
        },
        {
@ -162,7 +162,7 @@
          "scriptUrl": "./cities-internet/cities-internet.js",
          "embed": {
            "iframe": "<iframe src=\"./cities-internet/data-tables/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
-            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-UUUu/XaT+E2TP7NHwK+MyPuFuGhQWUpbe+WG+apGp+UgAQ0q0hs4bTlio1l+Z11z\" crossorigin=\"anonymous\"></script>\n<!-- provider: \"maplibre\" is the default; change it to \"mapbox\" and fill tk to use Mapbox. -->\n<cities-internet-map profile-config='{\"profile\":\"data-tables\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
+            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./cities-internet/cities-internet.js\" integrity=\"sha384-ondkGHW6nXb7Rr8LHtv0TFzrG26FK40lCgsMQ23oYAU67S+20ry+1Rci3uXC1E4C\" crossorigin=\"anonymous\"></script>\n<!-- provider: \"maplibre\" is the default; change it to \"mapbox\" and fill tk to use Mapbox. -->\n<cities-internet-map profile-config='{\"profile\":\"data-tables\",\"provider\":\"maplibre\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></cities-internet-map>"
          }
        }
      ]