- MOBILIZATION-MAPS-LAPTOP.md: every map on the site, DX Life's own home, pray, adopt and country maps included, uses MapLibre by default (the Driver's rule); NUXT_PUBLIC_MAP_PROVIDER=mapbox with NUXT_PUBLIC_MAPBOX_TOKEN switches back to Mapbox as doxa.life uses it today. The dropped-in tree is DX Maps development cff06fb8e. - DX-MAPS-GALLERY.md: the Map engine paragraph said a token alone selects Mapbox, which stopped being true when the provider setting came in; now it gives the real switch. It names what comes from other hosts (the engine from jsDelivr, base-map tiles from OpenFreeMap and VersaTiles, one dashboard's figures from the World Bank API, the prayer API). The tree sha is cff06fb8e. - deep-research/index.vue: its comment no longer says "no third-party host" without qualification.
6.9 KiB
Deep Research (the Research Gallery) on a hidden page, and every map served from /dx-maps/
This branch adds the Deep Research page, /deep-research: the Research Gallery (the research
maps, dashboards and lists in one app), filling the page below the site header, on desktop and
phone. The page is hidden: it is in no menu, and robots are told not to index it; it is reached
by its address. The Research page is DX Life's own again, with the production simple map. Every map
on the site loads from the same build tree.
What changed
public/dx-maps/ |
The dx-maps output folder, dropped in (doxa-maps development cff06fb8e, public/dx-maps/, copied unchanged). Every map on this site loads from it, same-origin. |
app/pages/deep-research/index.vue |
Deep Research: the Research Gallery. The page loads one script (/dx-maps/doxa-maps-spa/doxa-maps-spa.js) and adds one element (<doxa-maps-spa>), sized to the viewport below the header; its tree-base is built at runtime from the page's own origin. It gives the gallery profile-config {"experimental": false}, so the gallery's Experimental folder is hidden (galleries built before that flag ignore it). Hidden: in no menu, robots: noindex. |
app/pages/research/index.vue |
The Research page, DX Life's own: the heading, the "By Region" link and the UUPG list, with the production simple map (doxa-simple-map) carrying the Engagement, Prayer and Adoption tabs, the same map the home, pray and adopt pages each show one tab of. |
app/pages/regions/index.vue, app/utils/nav.ts, nuxt.config.ts |
/regions is DX Life's own index again, with its menu item, and /countries goes to it (USE_LEGACY_REGIONS_PAGE and LEGACY_REGIONS_PAGE on). Set both off to send /regions to a gallery tab instead. |
app/composables/useDoxaMap.ts |
The home (engagement), pray (prayer) and adopt (adoption) maps now load /dx-maps/doxa-simple-map/doxa-simple-map.js; the research-map key loads /dx-maps/doxa-research-map/doxa-research-map.js. Mapbox GL moves from v3.3.0 to v3.24.0, the version the dx-maps bundles are built and tested with. |
app/components/DoxaMapSlot.vue |
With no Mapbox token configured, it asks the map for the keyless MapLibre engine (see Map engine). With a token, the config passes through unchanged. The map fills the slot's box, not the viewport (--profile-min-h: 0), so the slot never cuts off the map's attribution and bottom controls. |
public/embed/map/index.html, public/research/doxa-research-map.html |
The same: bundles from /dx-maps/, Mapbox GL v3.24.0. |
public/js/doxa-simple-map.js, public/js/doxa-research-map.js |
Kept, unused. No page loads them any more (every map loads from /dx-maps/), but they stay in place so nothing DX-life relied on is deleted. |
Unchanged on purpose: the element names (<doxa-map>, <doxa-research-map>, <doxa-maps-spa>)
and nuxt.config.ts (its isCustomElement lists only those names). public/js/pplr-data-maps.iife.js
and /research/pplr-data-maps.html are a separate showcase with no dx-maps equivalent, so they are
also unchanged.
Language. The gallery follows the site's language and the language switcher (all 11 locales; Arabic lays out right-to-left).
Map engine. Every map on the site (the Deep Research gallery and the home, pray, adopt, research
and country maps) uses the keyless MapLibre engine by default, so the whole site's maps work with no
secrets at all. To switch back to Mapbox, as doxa.life uses it today, set
NUXT_PUBLIC_MAP_PROVIDER=mapbox together with NUXT_PUBLIC_MAPBOX_TOKEN; a token alone does not
switch, and "mapbox" without a token falls back to MapLibre. The page loads only the map bundle; each
map loads its own engine, so nothing is fetched from api.mapbox.com unless Mapbox is chosen.
What comes from elsewhere. The map code and the data folder are this site's own (/dx-maps/). The
MapLibre engine comes from jsDelivr, the base-map tiles from OpenFreeMap and VersaTiles, one
dashboard's country figures from the World Bank API, and the maps' people-group data from the prayer
API (NUXT_PUBLIC_PRAY_BASE_URL, default https://pray.doxa.life).
One scrollbar. The gallery is a full-page app: it fills exactly the space between the header and the bottom of the screen. The Deep Research page has no footer and does not scroll itself, so the only scrollbar is the gallery's own.
Phone. The gallery opens straight on a map (Simple Research). Its list of views sits behind the ☰ button. Big Picture is marked Desktop only there (it needs a wide screen); every other view works on a phone.
Run it
bun install
bun run dev
Then open http://localhost:3000/deep-research/ (Nuxt prints the port if 3000 is taken). No database
or .env is needed for this page. Without DATABASE_URL, the dev server only logs
"skipping migrations".
- Arabic: http://localhost:3000/ar/deep-research/
- Open a specific view:
/deep-research/?tab=prayer-map(alsoresearch-map-plus-grid,regions-dashboard,upg-100, and so on). - The Research page with the simple map: http://localhost:3000/research/
- Share and embed links in the maps point at this site's own
/dx-maps/pages. - To run it against a local dx-maps, and to try all three ways a site can take the gallery (drop-in, CDN, subdomain) with the exact ports and settings: documentation/LAPTOP-6WAY.md.
Deployment method: the dx-maps output folder dropped in (this branch, mobilization-maps, from research-gallery-drop-in)
Identical to research-gallery-js (maps from the CDN), except that the dx-maps output folder is dropped into public/dx-maps/ and
every map loads same-origin from it: NUXT_PUBLIC_DX_MAPS_BASE defaults to empty, which means this
site's own /dx-maps/. That covers the Research Gallery, the home (engagement), pray (prayer) and adopt maps
(useDoxaMap, DoxaMapSlot), and the static pages public/embed/map/ and
public/research/doxa-research-map.html (which carry /dx-maps as a constant). Each map is told its
assetsBase in the tree. No iframe is used, and no other host is involved.
/embed-test
/embed-test embeds every web plugin in the dx-maps tree, as JavaScript (no iframe). The list is read
at runtime from the tree's manifest.json, never typed: section 1 is every profile with stage: production,
section 2 every other profile. A profile whose targets leave out web (a desktop-only plugin, such as
Rudder) is skipped. Each card loads its bundle's script and adds the element that bundle defines. A card
mounts its plugin when it scrolls into view and removes it when it leaves (browsers allow only a few WebGL
maps at once). ?only=<bundle>/<profile> (or a bundle name, comma-separated) shows just those.
Updating the maps
Replace public/dx-maps/ with a newer build of the tree, from the doxa-maps repo's public/dx-maps/.
No page needs to change.