From 2dbc684fb128b53f7a3a001960dfb422bcb78dc8 Mon Sep 17 00:00:00 2001 From: Said Turksever Date: Fri, 25 Sep 2026 18:13:53 +0100 Subject: [PATCH] refactor(street-level): rename the Mapillary layer to street-level Pure move: the layer id, panel id, CSS prefix, classes, exports and config paths become provider-neutral (street-level, #street-level-panel, sl-); the Mapillary-specific modules move under providers/mapillary/. Behaviour is unchanged. The two sprite collections now register under distinct ids instead of overwriting each other under 'mapillary'. Co-Authored-By: Claude Fable 5.1 --- package.json | 6 +- scripts/format-scope.json | 40 ++--- scripts/package-boundaries.json | 89 ++++++----- .../{qa-mapillary.mjs => qa-street-level.mjs} | 60 +++---- src/app/catalog.js | 2 +- src/app/catalog.test.mjs | 2 +- src/app/constructCatalog.js | 4 +- .../layers/{mapillary.js => streetLevel.js} | 8 +- src/data/layerState.js | 6 +- .../{mapillary => streetLevel}/glyphs.js | 0 .../{mapillary => streetLevel}/index.js | 22 +-- .../providers}/mapillary/coverage.js | 2 +- .../providers}/mapillary/decode.js | 2 +- .../providers}/mapillary/policy.js | 2 +- .../providers}/mapillary/sequences.js | 15 +- .../providers}/mapillary/source.js | 0 .../providers}/mapillary/source.test.mjs | 0 .../providers/mapillary/viewer.js} | 0 .../{mapillary => streetLevel}/selection.js | 9 +- .../{mapillary => streetLevel}/state.js | 0 .../{mapillary => streetLevel}/tileMath.js | 0 .../tileMath.test.mjs | 0 src/standalone/layerSources.js | 2 +- ...up.test.mjs => streetLevelMarkup.test.mjs} | 45 +++--- ...laryQa.test.mjs => streetLevelQa.test.mjs} | 6 +- src/ui/applicationShell.js | 30 ++-- src/ui/layerPanel.js | 4 +- src/ui/panelChrome.js | 6 +- src/ui/panelLayoutController.js | 6 +- src/ui/shellElements.js | 2 +- ...laryControls.js => streetLevelControls.js} | 121 +++++++------- ...entation.js => streetLevelPresentation.js} | 2 +- ...t.mjs => streetLevelPresentation.test.mjs} | 41 ++--- src/ui/styles/layers.css | 18 ++- src/ui/styles/responsive.css | 8 +- .../{mapillary.css => street-level.css} | 150 +++++++++--------- src/ui/templates/layer-panels.html | 70 ++++---- style.css | 2 +- 38 files changed, 401 insertions(+), 381 deletions(-) rename scripts/{qa-mapillary.mjs => qa-street-level.mjs} (85%) rename src/app/layers/{mapillary.js => streetLevel.js} (56%) rename src/layers/{mapillary => streetLevel}/glyphs.js (100%) rename src/layers/{mapillary => streetLevel}/index.js (93%) rename src/layers/{ => streetLevel/providers}/mapillary/coverage.js (99%) rename src/layers/{ => streetLevel/providers}/mapillary/decode.js (98%) rename src/layers/{ => streetLevel/providers}/mapillary/policy.js (97%) rename src/layers/{ => streetLevel/providers}/mapillary/sequences.js (96%) rename src/layers/{ => streetLevel/providers}/mapillary/source.js (100%) rename src/layers/{ => streetLevel/providers}/mapillary/source.test.mjs (100%) rename src/layers/{mapillary/viewerBridge.js => streetLevel/providers/mapillary/viewer.js} (100%) rename src/layers/{mapillary => streetLevel}/selection.js (93%) rename src/layers/{mapillary => streetLevel}/state.js (100%) rename src/layers/{mapillary => streetLevel}/tileMath.js (100%) rename src/layers/{mapillary => streetLevel}/tileMath.test.mjs (100%) rename src/{mapillaryMarkup.test.mjs => streetLevelMarkup.test.mjs} (64%) rename src/tooling/{mapillaryQa.test.mjs => streetLevelQa.test.mjs} (87%) rename src/ui/{mapillaryControls.js => streetLevelControls.js} (75%) rename src/ui/{mapillaryPresentation.js => streetLevelPresentation.js} (98%) rename src/ui/{mapillaryPresentation.test.mjs => streetLevelPresentation.test.mjs} (83%) rename src/ui/styles/{mapillary.css => street-level.css} (77%) diff --git a/package.json b/package.json index ffd687376..a7a857df9 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,7 @@ "opensky:import": "./scripts/opensky-import-client.sh", "preview": "vite preview", "qa:map-source-tray": "node scripts/qa-map-source-tray.mjs", - "qa:mapillary": "node scripts/qa-mapillary.mjs", + "qa:street-level": "node scripts/qa-street-level.mjs", "qa:transit": "node scripts/qa-transit.mjs", "test": "node scripts/run-unit-tests.mjs", "test:track": "node scripts/track-regression.mjs" @@ -254,7 +254,7 @@ "./server/providers/mapillary": { "node": "./server/providers/mapillary.js" }, - "./layers/mapillary": "./src/layers/mapillary/index.js", - "./layers/mapillary/source": "./src/layers/mapillary/source.js" + "./layers/street-level": "./src/layers/streetLevel/index.js", + "./layers/street-level/mapillary/source": "./src/layers/streetLevel/providers/mapillary/source.js" } } diff --git a/scripts/format-scope.json b/scripts/format-scope.json index c8af86387..9d9b5f8a9 100644 --- a/scripts/format-scope.json +++ b/scripts/format-scope.json @@ -840,30 +840,30 @@ "src/ui/recentImagery.test.mjs", "src/layers/recentImagery/testDoubles.mjs", "scripts/qa-recent-imagery.mjs", - "src/ui/mapillaryControls.js", - "src/ui/mapillaryPresentation.js", - "src/ui/mapillaryPresentation.test.mjs", - "src/app/layers/mapillary.js", + "src/ui/streetLevelControls.js", + "src/ui/streetLevelPresentation.js", + "src/ui/streetLevelPresentation.test.mjs", + "src/app/layers/streetLevel.js", "src/tooling/mapillaryProvider.test.mjs", - "src/layers/mapillary/source.test.mjs", - "src/mapillaryMarkup.test.mjs", - "src/layers/mapillary/index.js", - "src/layers/mapillary/state.js", - "src/layers/mapillary/policy.js", - "src/layers/mapillary/coverage.js", - "src/layers/mapillary/sequences.js", - "src/layers/mapillary/glyphs.js", - "src/layers/mapillary/decode.js", - "src/layers/mapillary/tileMath.js", - "src/layers/mapillary/selection.js", - "src/layers/mapillary/viewerBridge.js", - "src/layers/mapillary/source.js", + "src/layers/streetLevel/providers/mapillary/source.test.mjs", + "src/streetLevelMarkup.test.mjs", + "src/layers/streetLevel/index.js", + "src/layers/streetLevel/state.js", + "src/layers/streetLevel/providers/mapillary/policy.js", + "src/layers/streetLevel/providers/mapillary/coverage.js", + "src/layers/streetLevel/providers/mapillary/sequences.js", + "src/layers/streetLevel/glyphs.js", + "src/layers/streetLevel/providers/mapillary/decode.js", + "src/layers/streetLevel/tileMath.js", + "src/layers/streetLevel/selection.js", + "src/layers/streetLevel/providers/mapillary/viewer.js", + "src/layers/streetLevel/providers/mapillary/source.js", "server/providers/mapillary.js", "server/providers/mapillary/routes.js", "server/providers/mapillary/constants.js", "server/providers/mapillary/tiles.js", "server/providers/mapillary/trim.js", - "src/layers/mapillary/tileMath.test.mjs", - "scripts/qa-mapillary.mjs", - "src/tooling/mapillaryQa.test.mjs" + "src/layers/streetLevel/tileMath.test.mjs", + "scripts/qa-street-level.mjs", + "src/tooling/streetLevelQa.test.mjs" ] diff --git a/scripts/package-boundaries.json b/scripts/package-boundaries.json index 0b06dab85..e5853cd1e 100644 --- a/scripts/package-boundaries.json +++ b/scripts/package-boundaries.json @@ -182,7 +182,7 @@ "server/providers/mapillary/constants.js", "server/providers/mapillary/tiles.js", "server/providers/mapillary/trim.js", - "src/layers/mapillary/tileMath.js", + "src/layers/streetLevel/tileMath.js", "server/providers/common/request.js", "src/sources/rateLimit.js", "server/providers/common/rate-limit.js" @@ -628,8 +628,8 @@ "src/ui/layerBindings.js", "src/ui/displayBindings.js", "src/ui/shellFacade.js", - "src/ui/mapillaryControls.js", - "src/ui/mapillaryPresentation.js", + "src/ui/streetLevelControls.js", + "src/ui/streetLevelPresentation.js", "src/ui/localSdrControls.js", "src/layers/localAdsb/feedNames.js", "src/ui/localSdrPresentation.js" @@ -1114,21 +1114,24 @@ ], "external": ["hls.js", "cesium"] }, - "mapillary-layer": { - "exports": ["./layers/mapillary", "./layers/mapillary/source"], + "street-level-layer": { + "exports": [ + "./layers/street-level", + "./layers/street-level/mapillary/source" + ], "modules": [ - "src/layers/mapillary/index.js", - "src/layers/mapillary/state.js", - "src/layers/mapillary/policy.js", - "src/layers/mapillary/coverage.js", - "src/layers/mapillary/sequences.js", - "src/layers/mapillary/glyphs.js", - "src/layers/mapillary/decode.js", - "src/layers/mapillary/tileMath.js", - "src/layers/mapillary/selection.js", - "src/layers/mapillary/viewerBridge.js", - "src/layers/mapillary/source.js", - "scripts/qa-mapillary.mjs" + "src/layers/streetLevel/index.js", + "src/layers/streetLevel/state.js", + "src/layers/streetLevel/providers/mapillary/policy.js", + "src/layers/streetLevel/providers/mapillary/coverage.js", + "src/layers/streetLevel/providers/mapillary/sequences.js", + "src/layers/streetLevel/glyphs.js", + "src/layers/streetLevel/providers/mapillary/decode.js", + "src/layers/streetLevel/tileMath.js", + "src/layers/streetLevel/selection.js", + "src/layers/streetLevel/providers/mapillary/viewer.js", + "src/layers/streetLevel/providers/mapillary/source.js", + "scripts/qa-street-level.mjs" ], "external": ["cesium", "pbf", "@mapbox/vector-tile", "mapillary-js"] }, @@ -1992,20 +1995,20 @@ "src/maps/imageryHost.js", "src/ui/recentImagery.js", "src/ui/imageryBoxTool.js", - "src/ui/mapillaryControls.js", - "src/ui/mapillaryPresentation.js", - "src/layers/mapillary/index.js", - "src/layers/mapillary/state.js", - "src/layers/mapillary/policy.js", - "src/layers/mapillary/coverage.js", - "src/layers/mapillary/sequences.js", - "src/layers/mapillary/glyphs.js", - "src/layers/mapillary/decode.js", - "src/layers/mapillary/tileMath.js", - "src/layers/mapillary/selection.js", - "src/layers/mapillary/viewerBridge.js", - "src/layers/mapillary/source.js", - "src/app/layers/mapillary.js" + "src/ui/streetLevelControls.js", + "src/ui/streetLevelPresentation.js", + "src/layers/streetLevel/index.js", + "src/layers/streetLevel/state.js", + "src/layers/streetLevel/providers/mapillary/policy.js", + "src/layers/streetLevel/providers/mapillary/coverage.js", + "src/layers/streetLevel/providers/mapillary/sequences.js", + "src/layers/streetLevel/glyphs.js", + "src/layers/streetLevel/providers/mapillary/decode.js", + "src/layers/streetLevel/tileMath.js", + "src/layers/streetLevel/selection.js", + "src/layers/streetLevel/providers/mapillary/viewer.js", + "src/layers/streetLevel/providers/mapillary/source.js", + "src/app/layers/streetLevel.js" ], "external": [ "hls.js", @@ -2467,18 +2470,18 @@ "src/layers/recentImagery/rendering.js", "src/layers/recentImagery/thumbnails.js", "src/maps/imageryHost.js", - "src/layers/mapillary/index.js", - "src/layers/mapillary/state.js", - "src/layers/mapillary/policy.js", - "src/layers/mapillary/coverage.js", - "src/layers/mapillary/sequences.js", - "src/layers/mapillary/glyphs.js", - "src/layers/mapillary/decode.js", - "src/layers/mapillary/tileMath.js", - "src/layers/mapillary/selection.js", - "src/layers/mapillary/viewerBridge.js", - "src/layers/mapillary/source.js", - "src/app/layers/mapillary.js" + "src/layers/streetLevel/index.js", + "src/layers/streetLevel/state.js", + "src/layers/streetLevel/providers/mapillary/policy.js", + "src/layers/streetLevel/providers/mapillary/coverage.js", + "src/layers/streetLevel/providers/mapillary/sequences.js", + "src/layers/streetLevel/glyphs.js", + "src/layers/streetLevel/providers/mapillary/decode.js", + "src/layers/streetLevel/tileMath.js", + "src/layers/streetLevel/selection.js", + "src/layers/streetLevel/providers/mapillary/viewer.js", + "src/layers/streetLevel/providers/mapillary/source.js", + "src/app/layers/streetLevel.js" ], "external": [ "hls.js", diff --git a/scripts/qa-mapillary.mjs b/scripts/qa-street-level.mjs similarity index 85% rename from scripts/qa-mapillary.mjs rename to scripts/qa-street-level.mjs index 4b00edfbc..490870c0b 100644 --- a/scripts/qa-mapillary.mjs +++ b/scripts/qa-street-level.mjs @@ -1,8 +1,8 @@ #!/usr/bin/env node /** - * Browser QA for the Street Level (Mapillary) layer against a running dev + * Browser QA for the Street Level layer against a running dev * server: the panel's place in the right rail, the keyless gate, coverage, - * the embedded viewer and its expanded dialog. Run with `npm run qa:mapillary -- --url http://localhost:4173`. + * the embedded viewer and its expanded dialog. Run with `npm run qa:street-level -- --url http://localhost:4173`. * Without MAPILLARY_CLIENT_TOKEN on the server only the keyless steps run. */ import assert from 'node:assert/strict'; @@ -20,7 +20,7 @@ export const RAIL_ORDER = Object.freeze([ 'cctv-panel', 'weather-panel', 'recent-imagery-panel', - 'mapillary-panel', + 'street-level-panel', 'global-context-panel', ]); @@ -79,10 +79,10 @@ async function main() { el.remove(); }); const module = () => - window.__godsEyeView.dataManager.layers.get('mapillary').module; + window.__godsEyeView.dataManager.layers.get('street-level').module; const panel = () => page.evaluate(() => { - const el = document.getElementById('mapillary-panel'); + const el = document.getElementById('street-level-panel'); const rail = document.getElementById('right-context-rail'); const box = el.getBoundingClientRect(); return { @@ -90,9 +90,9 @@ async function main() { classes: [...el.classList], width: Math.round(box.width), right: Math.round(box.right), - status: document.getElementById('mly-status').textContent, - controlsDisabled: document.getElementById('mly-controls').disabled, - bodyDisplay: getComputedStyle(document.getElementById('mly-body')) + status: document.getElementById('sl-status').textContent, + controlsDisabled: document.getElementById('sl-controls').disabled, + bodyDisplay: getComputedStyle(document.getElementById('sl-body')) .display, }; }); @@ -115,7 +115,7 @@ async function main() { } await page.setViewport(VIEWPORTS[0]); await page.click( - '.panel-collapse-btn[data-collapse-target="mapillary-panel"]', + '.panel-collapse-btn[data-collapse-target="street-level-panel"]', ); await sleep(500); await step( @@ -126,7 +126,7 @@ async function main() { assert.equal(info.bodyDisplay, 'flex'); assert.equal( await page.evaluate( - () => document.querySelectorAll('#mly-legend li').length, + () => document.querySelectorAll('#sl-legend li').length, ), 4, ); @@ -137,7 +137,7 @@ async function main() { 'keyless install gates the controls and reports KEY REQUIRED', async () => { await page.evaluate(() => - window.__godsEyeView.dataManager.setEnabled('mapillary', true, { + window.__godsEyeView.dataManager.setEnabled('street-level', true, { origin: 'user', }), ); @@ -179,14 +179,14 @@ async function main() { 'enabling draws coverage and registers the on-globe credit', async () => { await page.evaluate(() => - window.__godsEyeView.dataManager.setEnabled('mapillary', true, { + window.__godsEyeView.dataManager.setEnabled('street-level', true, { origin: 'user', }), ); await page.waitForFunction( () => { const u = window.__godsEyeView.dataManager.layers - .get('mapillary') + .get('street-level') .module.getUIState(); return u.coverage.sequences > 0 && !u.coverage.loading; }, @@ -206,13 +206,13 @@ async function main() { async () => { await page.evaluate(() => window.__godsEyeView.dataManager.layers - .get('mapillary') + .get('street-level') .module.openNearest(), ); await page.waitForFunction( () => { const s = window.__godsEyeView.dataManager.layers - .get('mapillary') + .get('street-level') .module.getUIState().street; return s.imageId || s.error; }, @@ -221,7 +221,7 @@ async function main() { const street = await page.evaluate( () => window.__godsEyeView.dataManager.layers - .get('mapillary') + .get('street-level') .module.getUIState().street, ); assert.equal(street.error, null, `viewer error: ${street.error}`); @@ -229,20 +229,20 @@ async function main() { try { await page.waitForFunction( () => - document.getElementById('mly-image-when').textContent.trim() + document.getElementById('sl-image-when').textContent.trim() .length > 0, { timeout: 30_000 }, ); } catch (error) { const dump = await page.evaluate(() => { const u = window.__godsEyeView.dataManager.layers - .get('mapillary') + .get('street-level') .module.getUIState(); return { street: u.street, - wrapHidden: document.getElementById('mly-viewer-wrap').hidden, + wrapHidden: document.getElementById('sl-viewer-wrap').hidden, collapsed: document - .getElementById('mapillary-panel') + .getElementById('street-level-panel') .classList.contains('collapsed'), }; }); @@ -252,10 +252,10 @@ async function main() { ); } const view = await page.evaluate(() => ({ - hidden: document.getElementById('mly-viewer-wrap').hidden, - when: document.getElementById('mly-image-when').textContent.trim(), + hidden: document.getElementById('sl-viewer-wrap').hidden, + when: document.getElementById('sl-image-when').textContent.trim(), width: Math.round( - document.getElementById('mly-viewer').getBoundingClientRect().width, + document.getElementById('sl-viewer').getBoundingClientRect().width, ), })); assert.equal(view.hidden, false); @@ -266,10 +266,10 @@ async function main() { await step( 'EXPAND opens a modal dialog and Esc returns focus to the button', async () => { - await page.click('#mly-viewer-expand'); + await page.click('#sl-viewer-expand'); await sleep(600); const dialog = await page.evaluate(() => { - const wrap = document.getElementById('mly-viewer-wrap'); + const wrap = document.getElementById('sl-viewer-wrap'); return { role: wrap.getAttribute('role'), modal: wrap.getAttribute('aria-modal'), @@ -287,21 +287,21 @@ async function main() { await page .evaluate(() => ({ expanded: document - .getElementById('mly-viewer-wrap') - .classList.contains('mly-viewer-wrap-expanded'), + .getElementById('sl-viewer-wrap') + .classList.contains('sl-viewer-wrap-expanded'), focus: document.activeElement?.id, })) .then((r) => `${r.expanded}:${r.focus}`), - 'false:mly-viewer-expand', + 'false:sl-viewer-expand', ); }, ); await step('Γ— closes the image and deselects it on the globe', async () => { - await page.click('#mly-viewer-close'); + await page.click('#sl-viewer-close'); await sleep(500); const after = await page.evaluate(() => { const u = window.__godsEyeView.dataManager.layers - .get('mapillary') + .get('street-level') .module.getUIState(); return { open: u.street.open, sequence: u.sequence.selectedId }; }); diff --git a/src/app/catalog.js b/src/app/catalog.js index 9a1a954ef..9dc641fef 100644 --- a/src/app/catalog.js +++ b/src/app/catalog.js @@ -4,7 +4,7 @@ const CONTROL_LAYER_IDS = Object.freeze({ militaryFlightsLayer: 'military', satellitesLayer: 'satellites', cctvLayer: 'cctv', - mapillaryLayer: 'mapillary', + streetLevelLayer: 'street-level', radioLayer: 'radio', bikeshareLayer: 'bikeshare', transitLayer: 'transit', diff --git a/src/app/catalog.test.mjs b/src/app/catalog.test.mjs index 446b92257..fc51c7fcd 100644 --- a/src/app/catalog.test.mjs +++ b/src/app/catalog.test.mjs @@ -93,7 +93,7 @@ test('controls bind catalog instances rather than similarly named defaults', () 'military-awareness', 'military-installations', 'rocket-launches', - 'mapillary', + 'street-level', 'local-adsb', ]; const layers = ids.map((id) => ({ id })); diff --git a/src/app/constructCatalog.js b/src/app/constructCatalog.js index 00e17ff46..cb7b98183 100644 --- a/src/app/constructCatalog.js +++ b/src/app/constructCatalog.js @@ -25,7 +25,7 @@ import { createApplicationFirms } from './layers/firms.js'; import { createApplicationEarthquakes } from './layers/earthquakes.js'; import { createApplicationFirePerimeters } from './layers/perimeters.js'; import { createApplicationCables } from './layers/submarineCables.js'; -import { createApplicationMapillary } from './layers/mapillary.js'; +import { createApplicationStreetLevel } from './layers/streetLevel.js'; import { createInfrastructureLayers } from '../data/infrastructure.js'; import { localGeoJsonServices } from './localGeojsonServices.js'; import { createBhoteKoshiEventLayer } from '../data/bhoteKoshiEvent.js'; @@ -156,7 +156,7 @@ export function createApplicationCatalog({ source: sources['fire-perimeters'], }), createApplicationAlpr({ surface, source: sources.alpr }), - createApplicationMapillary({ surface, source: sources.mapillary }), + createApplicationStreetLevel({ surface, source: sources.mapillary }), satellites, createApplicationLaunches({ source: sources.launches, satellites }), createApplicationTraffic({ source: sources.traffic }), diff --git a/src/app/layers/mapillary.js b/src/app/layers/streetLevel.js similarity index 56% rename from src/app/layers/mapillary.js rename to src/app/layers/streetLevel.js index 311caf517..f0e729b3f 100644 --- a/src/app/layers/mapillary.js +++ b/src/app/layers/streetLevel.js @@ -1,12 +1,12 @@ -import { createMapillaryLayer } from '../../layers/mapillary/index.js'; +import { createStreetLevelLayer } from '../../layers/streetLevel/index.js'; import * as sprites from '../../data/spriteOrder.js'; import * as picking from '../../data/pickRegistry.js'; import * as input from '../../data/inputOwnership.js'; import * as render from '../../renderGovernor.js'; -/** Construct the Mapillary layer using the application scene owners and a supplied source. */ -export function createApplicationMapillary({ surface, source }) { - return createMapillaryLayer({ +/** Construct the Street Level layer using the application scene owners and a supplied source. */ +export function createApplicationStreetLevel({ surface, source }) { + return createStreetLevelLayer({ source, services: { sprites, diff --git a/src/data/layerState.js b/src/data/layerState.js index a81aba243..7dccd3699 100644 --- a/src/data/layerState.js +++ b/src/data/layerState.js @@ -498,7 +498,6 @@ export const LAYER_STATE_REGISTRY = Object.freeze([ disposition: 'enabled-only', }), Object.freeze({ id: 'local-firms', token: 'w', disposition: 'enabled-only' }), - Object.freeze({ id: 'mapillary', token: '3', disposition: 'enabled-only' }), Object.freeze({ id: 'military', token: 'm', @@ -538,6 +537,11 @@ export const LAYER_STATE_REGISTRY = Object.freeze([ disposition: 'enabled+options', optionOwner: 'satellites', }), + Object.freeze({ + id: 'street-level', + token: '3', + disposition: 'enabled-only', + }), Object.freeze({ id: 'telegeography-submarine-cables', token: 'u', diff --git a/src/layers/mapillary/glyphs.js b/src/layers/streetLevel/glyphs.js similarity index 100% rename from src/layers/mapillary/glyphs.js rename to src/layers/streetLevel/glyphs.js diff --git a/src/layers/mapillary/index.js b/src/layers/streetLevel/index.js similarity index 93% rename from src/layers/mapillary/index.js rename to src/layers/streetLevel/index.js index 565cdf623..18b934635 100644 --- a/src/layers/mapillary/index.js +++ b/src/layers/streetLevel/index.js @@ -1,7 +1,7 @@ import { createState } from './state.js'; -import { createCoverage, visibleBbox } from './coverage.js'; -import { createSequences } from './sequences.js'; -import { createViewerBridge } from './viewerBridge.js'; +import { createCoverage, visibleBbox } from './providers/mapillary/coverage.js'; +import { createSequences } from './providers/mapillary/sequences.js'; +import { createViewerBridge } from './providers/mapillary/viewer.js'; import { createSelection } from './selection.js'; import * as Cesium from 'cesium'; import { @@ -9,12 +9,12 @@ import { COVERAGE_RECENT_DAYS, MAPILLARY_CREDIT_HTML, MAPILLARY_KEY_ID, - MAPILLARY_LAYER_ID, + STREET_LEVEL_LAYER_ID, NEAREST_LIMIT, NEAREST_RADIUS_M, -} from './policy.js'; +} from './providers/mapillary/policy.js'; -export { MAPILLARY_LAYER_ID } from './policy.js'; +export { STREET_LEVEL_LAYER_ID } from './providers/mapillary/policy.js'; const SOURCE_METHODS = [ 'getStatus', @@ -30,7 +30,7 @@ const SOURCE_METHODS = [ * are injected; nothing here reads the DOM except the viewer host the UI * hands over. */ -export function createMapillaryLayer({ source, services = {} }) { +export function createStreetLevelLayer({ source, services = {} }) { if (!SOURCE_METHODS.every((method) => typeof source?.[method] === 'function')) throw new TypeError('A Mapillary source is required'); const state = createState({ services }); @@ -72,7 +72,7 @@ export function createMapillaryLayer({ source, services = {} }) { try { listener(snapshot); } catch (error) { - console.warn('[Data:Mapillary] listener error:', error); + console.warn('[Data:StreetLevel] listener error:', error); } } }); @@ -174,7 +174,7 @@ export function createMapillaryLayer({ source, services = {} }) { } const layer = { - id: MAPILLARY_LAYER_ID, + id: STREET_LEVEL_LAYER_ID, name: 'Street Level', icon: 'πŸ“·', source: 'Mapillary', @@ -184,13 +184,13 @@ export function createMapillaryLayer({ source, services = {} }) { init(viewer) { if (state.initialized) - throw new Error('Mapillary layer is already initialized'); + throw new Error('Street Level layer is already initialized'); state.viewer = viewer; state.initialized = true; parts.sequences.ensureCollections(viewer); parts.sequences.setVisible(false); refreshStatus(); - console.log('[Data:Mapillary] Initialized'); + console.log('[Data:StreetLevel] Initialized'); }, enable(viewer) { diff --git a/src/layers/mapillary/coverage.js b/src/layers/streetLevel/providers/mapillary/coverage.js similarity index 99% rename from src/layers/mapillary/coverage.js rename to src/layers/streetLevel/providers/mapillary/coverage.js index a66ed683e..04e8f4c77 100644 --- a/src/layers/mapillary/coverage.js +++ b/src/layers/streetLevel/providers/mapillary/coverage.js @@ -4,7 +4,7 @@ import { coverageZoomForHeight, overviewZoomForHeight, tilesForBbox, -} from './tileMath.js'; +} from '../../tileMath.js'; import { COLORS, COVERAGE_LINE_WIDTH_PX, diff --git a/src/layers/mapillary/decode.js b/src/layers/streetLevel/providers/mapillary/decode.js similarity index 98% rename from src/layers/mapillary/decode.js rename to src/layers/streetLevel/providers/mapillary/decode.js index 8a2a9b847..dfdb9be4f 100644 --- a/src/layers/mapillary/decode.js +++ b/src/layers/streetLevel/providers/mapillary/decode.js @@ -1,6 +1,6 @@ import { PbfReader } from 'pbf'; import { VectorTile } from '@mapbox/vector-tile'; -import { tileLocalToLonLat } from './tileMath.js'; +import { tileLocalToLonLat } from '../../tileMath.js'; /** * Decode a Mapillary coverage tile (`mly1_public`) in the browser. diff --git a/src/layers/mapillary/policy.js b/src/layers/streetLevel/providers/mapillary/policy.js similarity index 97% rename from src/layers/mapillary/policy.js rename to src/layers/streetLevel/providers/mapillary/policy.js index 57a69ca21..e0b488a00 100644 --- a/src/layers/mapillary/policy.js +++ b/src/layers/streetLevel/providers/mapillary/policy.js @@ -1,5 +1,5 @@ /** Identity and tuning for the Mapillary street-level layer. */ -export const MAPILLARY_LAYER_ID = 'mapillary'; +export const STREET_LEVEL_LAYER_ID = 'street-level'; export const MAPILLARY_KEY_ID = 'mapillary'; export const MAPILLARY_GRAPH_HOST = 'https://graph.mapillary.com'; diff --git a/src/layers/mapillary/sequences.js b/src/layers/streetLevel/providers/mapillary/sequences.js similarity index 96% rename from src/layers/mapillary/sequences.js rename to src/layers/streetLevel/providers/mapillary/sequences.js index 96b7c1513..74e593b50 100644 --- a/src/layers/mapillary/sequences.js +++ b/src/layers/streetLevel/providers/mapillary/sequences.js @@ -1,5 +1,5 @@ import * as Cesium from 'cesium'; -import { imageConeGlyph } from './glyphs.js'; +import { imageConeGlyph } from '../../glyphs.js'; import { passesImageryFilter } from './coverage.js'; import { COLORS, @@ -64,7 +64,7 @@ export function createSequences({ state, source, parts }) { }); viewer.scene.primitives.add(state.sequence.collection); sprites?.registerSpriteCollection?.( - 'mapillary', + 'street-level:mapillary-cones', state.sequence.collection, ); } @@ -74,7 +74,7 @@ export function createSequences({ state, source, parts }) { }); viewer.scene.primitives.add(state.street.markerCollection); sprites?.registerSpriteCollection?.( - 'mapillary', + 'street-level:marker', state.street.markerCollection, ); } @@ -199,7 +199,7 @@ export function createSequences({ state, source, parts }) { id: PICK_PREFIX.position, position: cartesian, image: (id) => - import('./glyphs.js').then((m) => + import('../../glyphs.js').then((m) => m.positionMarkerGlyph({ color: COLORS.position }), ), imageId: 'mly-position', @@ -232,14 +232,17 @@ export function createSequences({ state, source, parts }) { for (const key of ['collection']) { const collection = state.sequence[key]; if (collection) { - sprites?.unregisterSpriteCollection?.('mapillary', collection); + sprites?.unregisterSpriteCollection?.( + 'street-level:mapillary-cones', + collection, + ); viewer?.scene?.primitives?.remove(collection); state.sequence[key] = null; } } if (state.street.markerCollection) { sprites?.unregisterSpriteCollection?.( - 'mapillary', + 'street-level:marker', state.street.markerCollection, ); viewer?.scene?.primitives?.remove(state.street.markerCollection); diff --git a/src/layers/mapillary/source.js b/src/layers/streetLevel/providers/mapillary/source.js similarity index 100% rename from src/layers/mapillary/source.js rename to src/layers/streetLevel/providers/mapillary/source.js diff --git a/src/layers/mapillary/source.test.mjs b/src/layers/streetLevel/providers/mapillary/source.test.mjs similarity index 100% rename from src/layers/mapillary/source.test.mjs rename to src/layers/streetLevel/providers/mapillary/source.test.mjs diff --git a/src/layers/mapillary/viewerBridge.js b/src/layers/streetLevel/providers/mapillary/viewer.js similarity index 100% rename from src/layers/mapillary/viewerBridge.js rename to src/layers/streetLevel/providers/mapillary/viewer.js diff --git a/src/layers/mapillary/selection.js b/src/layers/streetLevel/selection.js similarity index 93% rename from src/layers/mapillary/selection.js rename to src/layers/streetLevel/selection.js index 5494f8031..b65e0e80a 100644 --- a/src/layers/mapillary/selection.js +++ b/src/layers/streetLevel/selection.js @@ -1,5 +1,8 @@ import * as Cesium from 'cesium'; -import { MAPILLARY_LAYER_ID, PICK_PREFIX } from './policy.js'; +import { + STREET_LEVEL_LAYER_ID, + PICK_PREFIX, +} from './providers/mapillary/policy.js'; /** Click handling for coverage lines and image cones. */ export function createSelection({ state, parts }) { @@ -90,7 +93,7 @@ export function createSelection({ state, parts }) { Cesium.ScreenSpaceEventType.MOUSE_MOVE, ); document.addEventListener('keydown', onKeyDown); - picking?.registerPickOwner?.(MAPILLARY_LAYER_ID, ownsPick); + picking?.registerPickOwner?.(STREET_LEVEL_LAYER_ID, ownsPick); } function uninstall() { @@ -102,7 +105,7 @@ export function createSelection({ state, parts }) { state.clickHandler.destroy(); state.clickHandler = null; document.removeEventListener('keydown', onKeyDown); - picking?.unregisterPickOwner?.(MAPILLARY_LAYER_ID); + picking?.unregisterPickOwner?.(STREET_LEVEL_LAYER_ID); } return { install, uninstall, ownsPick }; diff --git a/src/layers/mapillary/state.js b/src/layers/streetLevel/state.js similarity index 100% rename from src/layers/mapillary/state.js rename to src/layers/streetLevel/state.js diff --git a/src/layers/mapillary/tileMath.js b/src/layers/streetLevel/tileMath.js similarity index 100% rename from src/layers/mapillary/tileMath.js rename to src/layers/streetLevel/tileMath.js diff --git a/src/layers/mapillary/tileMath.test.mjs b/src/layers/streetLevel/tileMath.test.mjs similarity index 100% rename from src/layers/mapillary/tileMath.test.mjs rename to src/layers/streetLevel/tileMath.test.mjs diff --git a/src/standalone/layerSources.js b/src/standalone/layerSources.js index ea16c25d1..f824c8d51 100644 --- a/src/standalone/layerSources.js +++ b/src/standalone/layerSources.js @@ -16,7 +16,7 @@ import { createWeatherSource } from '../layers/weather/source.js'; import { createCycloneSource } from '../layers/cyclones/source.js'; import { createWindSource } from '../layers/wind/source.js'; import { createFirmsSource } from '../layers/firms/source.js'; -import { createMapillarySource } from '../layers/mapillary/source.js'; +import { createMapillarySource } from '../layers/streetLevel/providers/mapillary/source.js'; import { createReferenceSources } from '../sources/reference.js'; export { createReferenceSources as createStandaloneReferenceSources } from '../sources/reference.js'; diff --git a/src/mapillaryMarkup.test.mjs b/src/streetLevelMarkup.test.mjs similarity index 64% rename from src/mapillaryMarkup.test.mjs rename to src/streetLevelMarkup.test.mjs index 1a2a07b03..253989f7a 100644 --- a/src/mapillaryMarkup.test.mjs +++ b/src/streetLevelMarkup.test.mjs @@ -13,66 +13,69 @@ const html = expandApplicationHtml(read('index.html')); const css = readStylesheet(path.join(ROOT, 'style.css')); const panelChrome = read('src/ui/panelChrome.js'); const layoutController = read('src/ui/panelLayoutController.js'); -const mapillaryCss = read('src/ui/styles/mapillary.css'); -const controls = read('src/ui/mapillaryControls.js'); +const panelCss = read('src/ui/styles/street-level.css'); +const controls = read('src/ui/streetLevelControls.js'); test('Street Level is an ordinary collapsible GEV panel that starts collapsed', () => { assert.match( html, - /