From d04939b813da2e9d5f4a0bc3e056616d78a57c90 Mon Sep 17 00:00:00 2001 From: Gaurav Patidar Date: Wed, 9 Sep 2026 13:23:59 +0530 Subject: [PATCH 01/30] fix:docs --- CONTRIBUTING.md | 19 +++++++++++++++++++ DATA_SOURCES.md | 30 ++++++++++++++++++++++++++++++ docs/KNOWN-ISSUES.md | 6 +++--- 3 files changed, 52 insertions(+), 3 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 6760dfdf1..029b53514 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -27,6 +27,25 @@ through Pinokio; the terminal path above remains the contributor path. Open `http://localhost:4173`. Before sending a PR run `npm run build`, `npm test`, and `npm run test:track` (dev server must be up) — **all three must stay green.** +### Test prerequisites + +- **`npm test`** — unit tests. Runs standalone; no dev server or credentials + required. Exit code is the gate. +- **`npm run test:track`** — the 3D flight-tracking regression harness. It + drives the **real app** in headless Chromium, so it **requires a running + dev server** on the default port (`http://localhost:4173`). Pass + `--url ` to point it at another instance (e.g. + `node scripts/track-regression.mjs --url http://localhost:4272`). It does not + depend on live OpenSky / adsb.lol / AISStream (those are optional or + rate-limited locally); it installs a persistent `fetch` shim that returns + synthetic aircraft in the exact upstream payload shapes the layers parse. +- **`npm run build`** — production Vite build. No server or credentials + required; it validates that the client bundle compiles cleanly. + +If you change runtime behavior, update `docs/CURRENT-STATE.md` and +`CHANGELOG.md` in the same PR. For a deeper catalog of what each harness +checks and what it needs to run, see [TESTING.md](TESTING.md). + ## Good first contributions The highest-leverage places to jump in: diff --git a/DATA_SOURCES.md b/DATA_SOURCES.md index faa351dca..bb0626117 100644 --- a/DATA_SOURCES.md +++ b/DATA_SOURCES.md @@ -125,6 +125,36 @@ the retrieval date (2026-07-30), exact download URL, license evidence, and the deterministic transform (`scripts/build-sf-neighborhoods.mjs`: `nhood` → `name`, ~2 m Douglas-Peucker simplification, 6-decimal rounding). +### Pilot CCTV source packs (`config/`) + +`config/cctv_sources.shinjuku.json` is a **demo source pack** (3 cameras: +Shinjuku Crossing, Shinjuku Station West, Shibuya Scramble) used for +projection-pipeline testing. The feeds are Google-hosted sample MP4 videos +(`storage.googleapis.com/gtv-videos-bucket/sample/`), not live public cameras. +Camera poses (coordinates, heading, pitch, FOV, mount height) are fabricated +priors placed at recognizable Tokyo intersections. + +Use the pack by setting: + +```bash +CCTV_SOURCES_FILE=config/cctv_sources.shinjuku.json npm run dev +``` + +Or equivalently, via `./scripts/dev-cctv.sh`: + +```bash +CCTV_SOURCES_FILE=config/cctv_sources.shinjuku.json ./scripts/dev-cctv.sh +``` + +The pack exercises the same CCTV registration and frustum-projection pipeline +as live city packs without requiring network access to a camera catalog. It is +**not** a live data source and carries no external attribution requirement. The +sample videos are publicly available Google test media. + +`config/cctv_sources.austin.json` is the reference live pack. Custom source +packs follow the same JSON schema (see either file); `CCTV_SOURCES_JSON` +accepts inline JSON as an alternative to a file path. + --- ## In-app attribution diff --git a/docs/KNOWN-ISSUES.md b/docs/KNOWN-ISSUES.md index 33c665f39..ca46d2ef0 100644 --- a/docs/KNOWN-ISSUES.md +++ b/docs/KNOWN-ISSUES.md @@ -57,9 +57,9 @@ Status: Open (owner-accepted 2026-07-08, documented) a few stragglers take one more poll. - **Born-grounded first poll:** a contact first seen on the ground with no altitude data renders at the geoid for ≤1 poll until its floor cell warms. -- Full context, improvement ideas, and the verification oracle - (`scripts/qa-floor-verify.mjs`): - `docs/superpowers/reports/2026-07-08-height-datum-handover.md`. +- Verify floor-placement behavior with `scripts/qa-floor-verify.mjs` against a + running local app; set `QA_BASE_URL` when it is not on the default port + (`http://localhost:4173`). --- From e3772f806f660ade51817707208250c7b7dd9a51 Mon Sep 17 00:00:00 2001 From: Gaurav Patidar Date: Fri, 11 Sep 2026 00:55:57 +0530 Subject: [PATCH 02/30] Clarify test:track command usage in CONTRIBUTING.md Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com> --- CONTRIBUTING.md | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 029b53514..eef422a84 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -33,9 +33,8 @@ Open `http://localhost:4173`. Before sending a PR run `npm run build`, `npm test required. Exit code is the gate. - **`npm run test:track`** — the 3D flight-tracking regression harness. It drives the **real app** in headless Chromium, so it **requires a running - dev server** on the default port (`http://localhost:4173`). Pass - `--url ` to point it at another instance (e.g. - `node scripts/track-regression.mjs --url http://localhost:4272`). It does not + dev server** (default `http://localhost:4173`). To target another instance, + run `npm run test:track -- --url ` (or `node scripts/track-regression.mjs --url `). depend on live OpenSky / adsb.lol / AISStream (those are optional or rate-limited locally); it installs a persistent `fetch` shim that returns synthetic aircraft in the exact upstream payload shapes the layers parse. From 8e68a29c5079a58fe133dd4589ea0ec764d4b701 Mon Sep 17 00:00:00 2001 From: Aliciawque <166712943+Aliciawque@users.noreply.github.com> Date: Mon, 12 Oct 2026 21:36:55 -0700 Subject: [PATCH 03/30] fix(cables): preserve feature ownership across multipart geometry Associate expanded cable and landing entities through a copied source index, retain one reference stem per feature, and cover duplicate IDs, bundled segments and frozen provider inputs with real Cesium regressions. --- CHANGELOG.md | 4 + docs/CURRENT-STATE.md | 8 + .../telegeographySubmarineCables.test.mjs | 249 ++++++++++++++++++ src/layers/submarineCables/ingestion.js | 34 ++- 4 files changed, 291 insertions(+), 4 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index b24ac95ed..f45d71d23 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,9 @@ # Changelog +- Keep every submarine-cable segment associated with its source feature after + Cesium expands multipart geometry, correcting segment colors, click destinations + and horizon culling while retaining one reference stem per feature. + - Treat explicitly current, complete empty vessel coverage as a successful update, clearing obsolete contacts while retaining stale or incomplete snapshots. diff --git a/docs/CURRENT-STATE.md b/docs/CURRENT-STATE.md index 26d56e66b..33e4c36b4 100644 --- a/docs/CURRENT-STATE.md +++ b/docs/CURRENT-STATE.md @@ -5002,6 +5002,14 @@ three Cesium data sources; enabling rebuilds from the accepted parsed cache, and destroying clears it. Load ownership prevents cancelled work from adding entities after teardown. +Multipart cable and landing-point geometry retains its source feature on every +Cesium entity, including generated IDs and IDs that collide with Cesium's +multipart suffixes. Each segment receives its own feature's styling, click +destination and horizon-culling reference; each source feature has one reference +stem. Source collections and their properties are not modified. The copied input +adds `__gevSourceFeatureIndex`, which remains observable in Cesium properties +and default descriptions. + Natural Earth regions and neighborhood polygon lookup are package exports. Their existing lazy loaders, retry behavior, bundled datasets and attribution are unchanged. The cable dataset remains CC BY-NC-SA 3.0 and is not covered by diff --git a/src/data/telegeographySubmarineCables.test.mjs b/src/data/telegeographySubmarineCables.test.mjs index 3850748dc..110f65f18 100644 --- a/src/data/telegeographySubmarineCables.test.mjs +++ b/src/data/telegeographySubmarineCables.test.mjs @@ -1754,3 +1754,252 @@ test('another GeoJSON source renders with its own label and rebuilds from accept env.layer.destroy(env.viewer); } }); + +function multipartCableFixture() { + return [ + { + type: 'Feature', + properties: { + id: 'alpha', + name: 'Alpha cable', + color: '#ff0000', + coordinates: [-40, 35], + }, + geometry: { + type: 'MultiLineString', + coordinates: [ + [ + [-40, 35], + [-39, 36], + ], + [ + [-38, 37], + [-37, 38], + ], + [ + [-36, 39], + [-35, 40], + ], + ], + }, + }, + { + type: 'Feature', + properties: { + id: 'beta', + name: 'Beta cable', + color: '#0000ff', + coordinates: [140, -35], + }, + geometry: { + type: 'LineString', + coordinates: [ + [140, -35], + [141, -34], + ], + }, + }, + ]; +} + +function geometrySource(cables, landingPoints = []) { + return { + label: 'Multipart test source', + async fetch() { + return { + cables: { type: 'FeatureCollection', features: cables }, + landingPoints: { type: 'FeatureCollection', features: landingPoints }, + }; + }, + }; +} + +test('multipart association accepts frozen provider collections without modifying properties', async () => { + const payload = { + cables: { type: 'FeatureCollection', features: multipartCableFixture() }, + landingPoints: { + type: 'FeatureCollection', + features: multipartCableFixture(), + }, + }; + payload.cables.features[0].properties.__gevSourceFeatureIndex = + 'provider value'; + const before = structuredClone(payload); + const freeze = (value) => { + if (value && typeof value === 'object') { + for (const child of Object.values(value)) freeze(child); + Object.freeze(value); + } + return value; + }; + freeze(payload); + const env = await createRealCableLayerHarness({ + source: { label: 'Frozen multipart source', fetch: async () => payload }, + }); + try { + for (const dataSource of env.dataSources.slice(0, 2)) { + assert.deepEqual( + dataSource.entities.values.map( + (entity) => entity.__gevTeleGeography?.label, + ), + ['Alpha cable', 'Alpha cable', 'Alpha cable', 'Beta cable'], + ); + } + assert.equal(env.dataSources[2].entities.values.length, 4); + assert.deepEqual(payload, before); + const entity = env.dataSources[0].entities.values[0]; + assert.equal(entity.properties.__gevSourceFeatureIndex.getValue(), 0); + assert.match(entity.description.getValue(), /__gevSourceFeatureIndex/); + } finally { + env.layer.destroy(env.viewer); + } +}); + +test('multipart cables retain their own styling, picking and culling on every segment', async () => { + const features = multipartCableFixture(); + const before = JSON.stringify(features); + const env = await createRealCableLayerHarness({ + source: geometrySource(features), + }); + try { + const entities = env.dataSources[0].entities.values; + assert.equal(entities.length, 4); + for (const [index, entity] of entities.entries()) { + const feature = features[index < 3 ? 0 : 1]; + const info = entity.__gevTeleGeography; + assert.equal(info?.label, feature.properties.name, entity.id); + assert.deepEqual(info.reference, { + lon: feature.properties.coordinates[0], + lat: feature.properties.coordinates[1], + }); + assert.deepEqual( + entity.polyline.material.color.getValue(), + Cesium.Color.fromCssColorString(feature.properties.color).withAlpha( + 0.92, + ), + ); + assert.equal(entity.polyline.width.getValue(), 2.5); + } + env.raiseSweep(); + assert.deepEqual( + entities.map((entity) => entity.show), + [true, true, true, false], + ); + assert.equal( + env.dataSources[2].entities.values.length, + 2, + 'one reference per feature', + ); + assert.equal( + JSON.stringify(features), + before, + 'source features stay unchanged', + ); + } finally { + env.layer.destroy(env.viewer); + } +}); + +test('multipart association supports missing and repeated IDs without guessing Cesium suffixes', async () => { + const features = multipartCableFixture(); + features[1].id = 'alpha_2'; + delete features[1].properties.id; + const generated = structuredClone(features[1]); + delete generated.id; + generated.properties.name = 'Generated cable'; + features.push(generated); + const repeated = structuredClone(features[1]); + repeated.properties.id = 'alpha'; + repeated.properties.name = 'Repeated ID cable'; + features.push(repeated); + const env = await createRealCableLayerHarness({ + source: geometrySource(features), + }); + try { + const entities = env.dataSources[0].entities.values; + assert.deepEqual( + entities.map((entity) => entity.id), + ['alpha', 'alpha_2', 'alpha_3', 'alpha_2_2', 'cable-2', 'alpha_4'], + ); + assert.deepEqual( + entities.map((entity) => entity.__gevTeleGeography?.label), + [ + 'Alpha cable', + 'Alpha cable', + 'Alpha cable', + 'Beta cable', + 'Generated cable', + 'Repeated ID cable', + ], + ); + assert.deepEqual( + env.dataSources[2].entities.values.map( + (entity) => entity.__gevTeleGeography.featureId, + ), + ['alpha', 'alpha_2', 'cable-2', 'alpha'], + ); + } finally { + env.layer.destroy(env.viewer); + } +}); + +test('multipart landing geometry keeps every pick with one reference per feature', async () => { + const features = multipartCableFixture(); + const env = await createRealCableLayerHarness({ + source: geometrySource([], features), + }); + try { + const entities = env.dataSources[1].entities.values; + assert.deepEqual( + entities.map((entity) => entity.__gevTeleGeography?.label), + ['Alpha cable', 'Alpha cable', 'Alpha cable', 'Beta cable'], + ); + assert.ok( + entities.every( + (entity) => entity.__gevTeleGeography.kind === 'landing-point', + ), + ); + assert.equal(env.dataSources[2].entities.values.length, 2); + } finally { + env.layer.destroy(env.viewer); + } +}); + +test('every bundled cable segment is associated with its source feature', async () => { + const { features } = JSON.parse( + readFileSync( + new URL( + './local_data/telegeography_submarine_cables/cable-geo.json', + import.meta.url, + ), + 'utf8', + ), + ); + // Some bundled features share a cable ID but have different references. + const expandedFeatures = features.flatMap((feature) => + feature.geometry.coordinates.map(() => feature), + ); + assert.ok(expandedFeatures.length > features.length); + const env = await createRealCableLayerHarness({ + source: geometrySource(features), + }); + try { + const entities = env.dataSources[0].entities.values; + assert.equal(entities.length, expandedFeatures.length); + for (const [index, entity] of entities.entries()) { + const feature = expandedFeatures[index]; + assert.equal( + entity.__gevTeleGeography?.label, + feature.properties.name, + entity.id, + ); + assert.deepEqual(entity.__gevTeleGeography.reference, { + lon: feature.properties.coordinates[0], + lat: feature.properties.coordinates[1], + }); + } + assert.equal(env.dataSources[2].entities.values.length, features.length); + } finally { + env.layer.destroy(env.viewer); + } +}); diff --git a/src/layers/submarineCables/ingestion.js b/src/layers/submarineCables/ingestion.js index eaefbeb39..3779af9c9 100644 --- a/src/layers/submarineCables/ingestion.js +++ b/src/layers/submarineCables/ingestion.js @@ -5,6 +5,21 @@ import { } from './geometry.js'; import * as Cesium from 'cesium'; +const SOURCE_FEATURE_INDEX = '__gevSourceFeatureIndex'; + +function indexedCollection(features) { + return { + type: 'FeatureCollection', + features: features.map((feature, index) => ({ + ...feature, + properties: { + ...feature.properties, + [SOURCE_FEATURE_INDEX]: index, + }, + })), + }; +} + export function createIngestion({ state, parts, source }) { async function load(viewer) { if (state._loading || state._loaded) return; @@ -48,7 +63,7 @@ export function createIngestion({ state, parts, source }) { const landingFeatures = normalizeFeatures(landingJson, 'landing'); const cableDataSource = await Cesium.GeoJsonDataSource.load( - { type: 'FeatureCollection', features: cableFeatures }, + indexedCollection(cableFeatures), { clampToGround: true, stroke: state.cableColor.withAlpha(0.95), @@ -60,7 +75,7 @@ export function createIngestion({ state, parts, source }) { ); if (!owns()) return; const landingDataSource = await Cesium.GeoJsonDataSource.load( - { type: 'FeatureCollection', features: landingFeatures }, + indexedCollection(landingFeatures), { clampToGround: true, stroke: state.landingColor.withAlpha(0.9), @@ -130,7 +145,12 @@ export function createIngestion({ state, parts, source }) { state._referenceRecords = []; state._surfaceRecords = []; - cableEntities.forEach((entity, index) => { + // Cesium expands multipart geometry into several entities and suffixes + // colliding IDs. Its copied properties retain this source index even + // when a provider has no ID, so every segment keeps the right owner. + const cableReferences = new Set(); + cableEntities.forEach((entity) => { + const index = entity.properties?.[SOURCE_FEATURE_INDEX]?.getValue(); const feature = cableFeatures[index]; const reference = featureReference(feature); if (!reference) return; @@ -145,6 +165,8 @@ export function createIngestion({ state, parts, source }) { entity, base: Cesium.Cartesian3.fromDegrees(reference.lon, reference.lat, 0), }); + if (cableReferences.has(index)) return; + cableReferences.add(index); parts.rendering.addReferenceStem({ reference, label: featureLabel(feature), @@ -154,7 +176,9 @@ export function createIngestion({ state, parts, source }) { }); }); - landingEntities.forEach((entity, index) => { + const landingReferences = new Set(); + landingEntities.forEach((entity) => { + const index = entity.properties?.[SOURCE_FEATURE_INDEX]?.getValue(); const feature = landingFeatures[index]; const reference = featureReference(feature); if (!reference) return; @@ -169,6 +193,8 @@ export function createIngestion({ state, parts, source }) { entity, base: Cesium.Cartesian3.fromDegrees(reference.lon, reference.lat, 0), }); + if (landingReferences.has(index)) return; + landingReferences.add(index); parts.rendering.addReferenceStem({ reference, label: featureLabel(feature), From a856d54bba46424571e40227997eb576c9351396 Mon Sep 17 00:00:00 2001 From: John Leshan Date: Sat, 17 Oct 2026 13:07:04 +0300 Subject: [PATCH 04/30] docs: add cloud setup path via GitHub Codespaces --- README.md | 32 ++++++++++++++++++++++++++++++++ 1 file changed, 32 insertions(+) diff --git a/README.md b/README.md index c49c53ece..75f796724 100644 --- a/README.md +++ b/README.md @@ -219,6 +219,38 @@ the container. +### Path 4 — GitHub Codespaces (cloud, no local GPU) + +Runs the same dev server in a cloud workspace, so integrated graphics and a +local GPU never come into it. GitHub Free includes 120 core-hours a month with +no card on file — about 60 hours on the default 2-core machine. Org and +Enterprise plans include no free quota; current terms and quotas apply. + +1. Fork this repository, then open **your fork** on GitHub. +2. Click the green **Code** button, the **Codespaces** tab, then **Create codespace on main**. +3. In the codespace terminal: + ```bash + nvm install 24 && nvm use 24 + npm ci + npm run doctor + GEV_ALLOWED_HOSTS="$CODESPACE_NAME-4173.$GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN" npm run dev + ``` +4. Open the **Ports** tab, find `4173`, and click the globe icon to open it in + the browser. The port is private by default, so the URL asks for your GitHub + login. + +`GEV_ALLOWED_HOSTS` there is required, not optional. The dev server answers only +the hostnames it trusts, and a forwarded port arrives on +`$CODESPACE_NAME-4173.$GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN`. Without it the +page is `Blocked request. This host is not allowed.` Leading-dot wildcards are +ignored on purpose, so pass that exact name. + +⚠️ **A codespace is reachable from the internet.** Treat it as the +wider-publish case in [Sharing an instance](#-sharing-an-instance): leave +Provider Settings closed to strangers, and put keys in the workspace `.env` by +hand. `.env` is gitignored — never commit it. [SECURITY.md](SECURITY.md) has the +threat model. + ### Then power it up — in the app, not in a file Keys are upgrades, not prerequisites. When you want one, click the **POWER UP** From 295e164fc3dac706ad51a47013e41e4f95441bd8 Mon Sep 17 00:00:00 2001 From: Said Turksever Date: Mon, 19 Oct 2026 14:31:09 +0100 Subject: [PATCH 05/30] docs(readme): say Codespaces moves the server, not the rendering The globe renders in the viewer's own browser, so a codespace does not remove the need for local graphics. Retitle Path 4 accordingly. Co-Authored-By: Claude Opus 5.5 --- README.md | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 0e1f6ffe7..ce2e97ab9 100644 --- a/README.md +++ b/README.md @@ -219,12 +219,14 @@ the container. -### Path 4 — GitHub Codespaces (cloud, no local GPU) +### Path 4 — GitHub Codespaces (cloud, no local install) -Runs the same dev server in a cloud workspace, so integrated graphics and a -local GPU never come into it. GitHub Free includes 120 core-hours a month with -no card on file — about 60 hours on the default 2-core machine. Org and -Enterprise plans include no free quota; current terms and quotas apply. +Runs the same dev server in a cloud workspace, so Node and the dependencies +never touch your machine. The globe still renders in your own browser, so it +needs the same graphics there as any other path. GitHub Free includes 120 +core-hours a month with no card on file — about 60 hours on the default 2-core +machine. Org and Enterprise plans include no free quota; current terms and +quotas apply. 1. Fork this repository, then open **your fork** on GitHub. 2. Click the green **Code** button, the **Codespaces** tab, then **Create codespace on main**. From 58a41759b52e795268e1be6cb2d1fa84547b2630 Mon Sep 17 00:00:00 2001 From: Aliciawque <166712943+Aliciawque@users.noreply.github.com> Date: Thu, 22 Oct 2026 13:13:59 +0800 Subject: [PATCH 06/30] test: resolve sky texture file URLs on Windows --- src/tooling/skyAssets.paintOut.test.mjs | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/tooling/skyAssets.paintOut.test.mjs b/src/tooling/skyAssets.paintOut.test.mjs index ddb57589a..78a91519e 100644 --- a/src/tooling/skyAssets.paintOut.test.mjs +++ b/src/tooling/skyAssets.paintOut.test.mjs @@ -1,5 +1,6 @@ import assert from 'node:assert/strict'; import test from 'node:test'; +import { fileURLToPath } from 'node:url'; import sharp from 'sharp'; import { CUBE_FACES, @@ -24,7 +25,7 @@ test('painted-out planets leave no disc brighter than the sky around them', asyn })); for (const face of CUBE_FACES) { const { data, info } = await sharp( - new URL(`milkyway_${FACE_FILE_SUFFIX[face]}.webp`, SKY).pathname, + fileURLToPath(new URL(`milkyway_${FACE_FILE_SUFFIX[face]}.webp`, SKY)), ) .raw() .toBuffer({ resolveWithObject: true }); From accb8983ca0fd55eeb0c475612d1cfa5457b911d Mon Sep 17 00:00:00 2001 From: Sunil56224972 Date: Tue, 27 Oct 2026 18:02:32 +0530 Subject: [PATCH 07/30] fix(security): add cross-site gate to military-installations proxy The /api/military-installations endpoint was the last keyless proxy without the admitSameSite gate that protects terrain, CCTV, traffic, places, and Celestrak. A cross-site , foreign Origin, opaque origin, or reverse-proxy-forwarded request now receives 403 before any Overpass query. Same-origin app requests and bare tool requests continue to work. Adds 4 integration tests (cross-site refused, same-origin admitted, bare tool admitted, proxied refused) following the terrainHeightsBounds test pattern. --- ...-military-installations-cross-site-gate.md | 6 + pr-body.md | 75 +++++++++ scripts/package-boundaries.json | 4 +- server/providers/military-installations.js | 2 + src/militaryInstallationsGate.test.mjs | 147 ++++++++++++++++++ 5 files changed, 233 insertions(+), 1 deletion(-) create mode 100644 changelog.d/1427-military-installations-cross-site-gate.md create mode 100644 pr-body.md create mode 100644 src/militaryInstallationsGate.test.mjs diff --git a/changelog.d/1427-military-installations-cross-site-gate.md b/changelog.d/1427-military-installations-cross-site-gate.md new file mode 100644 index 000000000..3665da022 --- /dev/null +++ b/changelog.d/1427-military-installations-cross-site-gate.md @@ -0,0 +1,6 @@ +- The military-installations proxy (`/api/military-installations`) now refuses + cross-site browser requests with the same `admitSameSite` gate that protects + the terrain, CCTV, traffic, places, and Celestrak proxies. A cross-site + ``, a foreign `Origin`, an opaque origin, or a reverse-proxy-forwarded + request receives 403 before any Overpass query runs. Same-origin app requests + and bare tool requests (curl, Node harness) continue to work. (Sunil56224972) diff --git a/pr-body.md b/pr-body.md new file mode 100644 index 000000000..28e73decc --- /dev/null +++ b/pr-body.md @@ -0,0 +1,75 @@ +## Summary + +Adds the `admitSameSite` cross-site gate to `/api/military-installations`, as offered in the [#975 merge comment](https://github.com/bilawalsidhu/gods-eye-view/pull/975#issuecomment-6357981946). + +This was the last keyless proxy endpoint without the gate. After this change, every proxy that sends queries upstream now refuses cross-site browser requests before doing any work. + +| Endpoint | Gate before this PR | Gate after | +|----------|-------------------|------------| +| `/api/terrain/heights` | ✅ admitSameSite (#975) | ✅ | +| `/api/cctv/frame/:id` | ✅ admitSameSite (#922) | ✅ | +| `/api/traffic/*` | ✅ admitSameSite | ✅ | +| `/api/google/*` | ✅ admitSameSite | ✅ | +| `/api/gemini/*` | ✅ admitSameSite | ✅ | +| `/api/space/satellites` | ✅ admitSameSite | ✅ | +| `/api/overpass` | ✅ admitSameSite | ✅ | +| `/api/military-installations` | ❌ **none** | ✅ admitSameSite | + +## The problem + +A cross-site page (or an `` tag from any website) can query `/api/military-installations` and trigger upstream Overpass requests on the user's behalf. The endpoint has a rate limiter (90/min), but no cross-site gate — so a hostile page can burn through the user's Overpass quota and exfiltrate the response data. + +Every other proxy in the codebase already refuses these shapes. Military-installations was the gap. + +## The fix + +Two lines in `server/providers/military-installations.js`: + +```diff + import { makeRateLimiter, clientKey } from './common/rate-limit.js'; ++import { admitSameSite } from './common/same-site.js'; +``` + +```diff + if (req.method !== 'GET') { + res.writeHead(405, { 'Content-Type': 'application/json' }); + res.end(JSON.stringify({ error: 'Method Not Allowed' })); + return; + } ++ if (admitSameSite(req, res)) return; + const url = new URL(req.url, 'http://localhost'); +``` + +Same pattern as terrain.js, cctv.js, traffic.js, google.js, etc. Gate runs before the rate limiter, so refused requests never consume quota. + +`scripts/package-boundaries.json` updated to declare `server/providers/common/same-site.js` and `src/localRequestGate.mjs` as owned modules of `military-installations-provider`. + +## Tests + +New file: `src/militaryInstallationsGate.test.mjs` — 4 integration tests following the `terrainHeightsBounds.test.mjs` pattern: + +``` +✔ cross-site browser requests are refused with 403 (2.4ms) +✔ same-origin browser request is admitted (not 403) (5.3ms) +✔ bare tool request (no Origin, no Sec-Fetch) is admitted (0.9ms) +✔ proxied same-origin requests are refused (proxy headers present) (0.5ms) +``` + +Tested shapes: +- `Sec-Fetch-Site: cross-site` (the `` case) → 403 +- `Sec-Fetch-Site: same-site` (cross-origin sibling) → 403 +- `Origin: https://evil.example` (fetch from hostile page) → 403 +- `Origin: null` (sandboxed iframe) → 403 +- `X-Forwarded-For` + `Sec-Fetch-Site: cross-site` (proxied cross-site) → 403 +- Same-origin with matching `Origin` → admitted +- No `Origin`, no `Sec-Fetch` (curl / Node) → admitted +- Proxy headers with `same-origin` → 403 + +All 4 tests fail on `main` and pass with the fix. + +## Validation + +- `node --test src/localRequestGate.test.mjs src/militaryInstallationsGate.test.mjs`: **18 tests, 18 pass, 0 fail** +- `npm run check:boundaries`: **pass** (military-installations-provider: 15 owned modules) +- `npm run check:import-directions`: pass +- Changelog fragment in `changelog.d/military-installations-cross-site-gate.md` diff --git a/scripts/package-boundaries.json b/scripts/package-boundaries.json index b42d90fdc..4219b311c 100644 --- a/scripts/package-boundaries.json +++ b/scripts/package-boundaries.json @@ -298,7 +298,9 @@ "server/providers/overpass/transport.js", "src/sources/httpBody.js", "src/i18n/marker.js", - "src/sources/rateLimit.js" + "src/sources/rateLimit.js", + "server/providers/common/same-site.js", + "src/localRequestGate.mjs" ], "external": [] }, diff --git a/server/providers/military-installations.js b/server/providers/military-installations.js index 7d252b8ed..1b6c82107 100644 --- a/server/providers/military-installations.js +++ b/server/providers/military-installations.js @@ -1,4 +1,5 @@ import { makeRateLimiter, clientKey } from './common/rate-limit.js'; +import { admitSameSite } from './common/same-site.js'; import { MILITARY_INSTALLATION_ELEMENT_CAP, MILITARY_INSTALLATION_MAX_RESPONSE_BYTES, @@ -97,6 +98,7 @@ function militaryInstallationsProxy() { res.end(JSON.stringify({ error: 'Method Not Allowed' })); return; } + if (admitSameSite(req, res)) return; const url = new URL(req.url, 'http://localhost'); const requested = validMilitaryInstallationBox(url.searchParams); if (!requested) { diff --git a/src/militaryInstallationsGate.test.mjs b/src/militaryInstallationsGate.test.mjs new file mode 100644 index 000000000..4451c384b --- /dev/null +++ b/src/militaryInstallationsGate.test.mjs @@ -0,0 +1,147 @@ +// Military-installations cross-site gate — verifies that the admitSameSite +// gate added in this PR actually refuses the same request shapes the terrain +// and CCTV proxies already refuse, and admits same-origin and bare-tool +// requests. +// +// Run with: npm test +import { test } from 'node:test'; +import assert from 'node:assert/strict'; +import { militaryInstallationsProxy } from '../server/providers/military-installations.js'; + +function install(plugin) { + const routes = new Map(); + plugin.configureServer({ + middlewares: { + use(path, handler) { + routes.set(path, handler); + }, + }, + }); + return routes; +} + +function request( + handler, + { url = '/', method = 'GET', remoteAddress = '127.0.0.1', reqHeaders = {} } = {}, +) { + return new Promise((resolve, reject) => { + const headers = new Map(); + const req = { + method, + url, + headers: reqHeaders, + socket: { remoteAddress }, + }; + const res = { + statusCode: 200, + headersSent: false, + setHeader(name, value) { + headers.set(String(name).toLowerCase(), String(value)); + }, + writeHead(status, hdrs = {}) { + this.statusCode = status; + this.headersSent = true; + for (const [name, value] of Object.entries(hdrs)) + headers.set(String(name).toLowerCase(), String(value)); + }, + end(body = '') { + let parsed = null; + try { + parsed = body ? JSON.parse(String(body)) : null; + } catch { + parsed = String(body); + } + resolve({ + statusCode: this.statusCode, + headers: Object.fromEntries(headers), + body: parsed, + }); + }, + }; + Promise.resolve(handler(req, res)).catch(reject); + }); +} + +// A valid bbox query string for military-installations. +const VALID_BBOX = '?south=48.8&west=2.2&north=48.9&east=2.4'; +const HOST = 'localhost:5173'; + +test('cross-site browser requests are refused with 403', async () => { + const route = install(militaryInstallationsProxy()).get( + '/api/military-installations', + ); + const refused = [ + // from any web page + { host: HOST, 'sec-fetch-site': 'cross-site' }, + // same-site but cross-origin sibling + { host: HOST, 'sec-fetch-site': 'same-site' }, + // fetch from another page + { host: HOST, origin: 'https://evil.example' }, + // sandboxed frame + { host: HOST, origin: 'null' }, + // behind a reverse proxy with cross-site + { host: HOST, 'x-forwarded-for': '203.0.113.9', 'sec-fetch-site': 'cross-site' }, + ]; + for (const reqHeaders of refused) { + const answer = await request(route, { url: VALID_BBOX, reqHeaders }); + assert.equal( + answer.statusCode, + 403, + `expected 403 for headers ${JSON.stringify(reqHeaders)}, got ${answer.statusCode}`, + ); + } +}); + +test('same-origin browser request is admitted (not 403)', async () => { + const route = install(militaryInstallationsProxy()).get( + '/api/military-installations', + ); + // Same-origin with matching origin header + const answer = await request(route, { + url: VALID_BBOX, + reqHeaders: { + host: HOST, + origin: `http://${HOST}`, + 'sec-fetch-site': 'same-origin', + }, + }); + // Should get past the gate — may be 200, 429, or 503 depending on Overpass config, + // but never 403. + assert.notEqual(answer.statusCode, 403, 'same-origin request should not be refused'); +}); + +test('bare tool request (no Origin, no Sec-Fetch) is admitted', async () => { + const route = install(militaryInstallationsProxy()).get( + '/api/military-installations', + ); + // curl / Node harness — no browser headers at all + const answer = await request(route, { + url: VALID_BBOX, + reqHeaders: { host: HOST }, + }); + assert.notEqual(answer.statusCode, 403, 'bare tool request should not be refused'); +}); + +test('proxied same-origin requests are refused (proxy headers present)', async () => { + const route = install(militaryInstallationsProxy()).get( + '/api/military-installations', + ); + const proxied = [ + { host: HOST, 'sec-fetch-site': 'same-origin', 'x-forwarded-for': '203.0.113.9' }, + { host: HOST, 'sec-fetch-site': 'same-origin', 'cf-connecting-ip': '203.0.113.9' }, + { + host: HOST, + 'sec-fetch-site': 'same-origin', + forwarded: 'for=203.0.113.9;proto=https', + via: '1.1 caddy', + }, + ]; + for (const reqHeaders of proxied) { + const answer = await request(route, { url: VALID_BBOX, reqHeaders }); + assert.equal( + answer.statusCode, + 403, + `expected 403 for proxied headers ${JSON.stringify(reqHeaders)}, got ${answer.statusCode}`, + ); + } +}); From d8358048adafa95930c1be2db9b624627f51e332 Mon Sep 17 00:00:00 2001 From: Denis Groshev Date: Wed, 28 Oct 2026 16:07:48 +0100 Subject: [PATCH 08/30] fix(dock): show only icons on the narrow dock wings so labels stop covering the voice control At 900px and narrower the Location and Visual Presets wings shrink to --dock-side-compact (4.25rem), open or closed, but their text labels kept their full width. Between 721px and 900px, where the desktop dock is still shown, LOCATION and VISUAL PRESETS spilled over the idle voice control, and the LOCATION label took taps on the left half of the mic button. The label clip that existed was scoped to 620px, which the phone shell (720px) always covers, so it never applied to a visible dock. In that band the labels are now font-size 0 and lose their chevrons, so each wing shows only its icon. The label text is unchanged, so the toggles' "Expand/Collapse ..." aria-label and title, which panelChrome builds from it, keep the full name. The Cyber HUD layout sets a wider --dock-side-compact that fits its labels, so it keeps them. The unreachable 620px clip is removed. Found in GEV launch-readiness QA (HAL-728). --- docs/CURRENT-STATE.md | 14 +++++++++++ src/ui/styles/command-dock-trays.css | 35 ++++++++++++++++++++++------ 2 files changed, 42 insertions(+), 7 deletions(-) diff --git a/docs/CURRENT-STATE.md b/docs/CURRENT-STATE.md index 3e7f333a1..cfa9be32f 100644 --- a/docs/CURRENT-STATE.md +++ b/docs/CURRENT-STATE.md @@ -2665,6 +2665,20 @@ isCurrent })` gates BOTH halves of the map-stack switch, which is its only > name the panel (`#location-bar` / `#control-panel`) to reach (2,5,0). Adding > a new tray rule means checking it against the pinned variants, not just > against the base rule. +> - **Dock wings are icon-only from 900px down to 721px (2026-10-28):** at +> ≤900px `--dock-side-compact` shrinks the Location and Visual Presets wings +> to 4.25rem, open or closed (an open tray pops out above the dock), which is +> too narrow for their text labels. The labels used to spill over the voice +> control, and the LOCATION label captured taps on the left half of the mic +> button (HAL-728). `src/ui/styles/command-dock-trays.css` now sets the +> labels to `font-size: 0` and drops their `›`/`‹` chevrons in that band, so +> each wing shows only its icon. The text node is unchanged, so +> `panelChrome.js` still builds the toggles' "Expand/Collapse …" `aria-label` +> and `title` from it; the browser tooltip is the only visible name on hover. +> The Cyber HUD layout is excluded: it sets `--dock-side-compact` to +> 9–9.75rem, which fits its labels. The former ≤620px ellipsis clip is gone: +> the phone shell takes over at 720px, so it never applied to a visible +> dock. > - **LOCATION mini-status is data-only today (2026-08-20):** the collapsed > readout now follows a free-text geocode search as well as preset pills > (`src/locationStatus.js` owns the copy for both), and every other camera diff --git a/src/ui/styles/command-dock-trays.css b/src/ui/styles/command-dock-trays.css index 547037de7..5575b588a 100644 --- a/src/ui/styles/command-dock-trays.css +++ b/src/ui/styles/command-dock-trays.css @@ -502,6 +502,34 @@ body:not(.ui-clean-view):not(.recording-mode):has( #command-dock .gev-voice-error-tray { width: min(24rem, calc(100vw - 1.5rem)); } + + /* The wings shrink to --dock-side-compact at this width, open or closed (an + open tray pops out above the dock), which is too narrow for the text + labels; they would spill over the voice control and take its taps. The + wings show only their icon; the toggles keep their aria-label. Cyber sets + a wider --dock-side-compact that fits its labels, so it keeps them. */ + :root:not([data-ui-theme='cyber']) + #command-dock + :is(#location-bar, #control-panel) + .panel-title, + :root:not([data-ui-theme='cyber']) + #command-dock + :is(#location-bar, #control-panel) + .location-toolbar-label { + font-size: 0; + letter-spacing: 0; + } + + :root:not([data-ui-theme='cyber']) + #command-dock + :is(#location-bar, #control-panel) + .panel-title::after, + :root:not([data-ui-theme='cyber']) + #command-dock + :is(#location-bar, #control-panel) + .location-toolbar-label::after { + content: none; + } } @media (max-width: 620px) { @@ -510,13 +538,6 @@ body:not(.ui-clean-view):not(.recording-mode):has( --dock-voice-width: 8.75rem; } - #command-dock .panel-title, - #command-dock .location-toolbar-label { - max-width: 2.3rem; - overflow: hidden; - text-overflow: ellipsis; - } - #left-panel-stack { bottom: calc(50vh + 8px); } From ce10a46b7f1780fcdeadfaf5f47396ce79065393 Mon Sep 17 00:00:00 2001 From: Denis Groshev Date: Wed, 28 Oct 2026 20:22:01 +0100 Subject: [PATCH 09/30] docs(changelog): add the dock icon-only wings entry --- changelog.d/1457-dock-icon-only-wings.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 changelog.d/1457-dock-icon-only-wings.md diff --git a/changelog.d/1457-dock-icon-only-wings.md b/changelog.d/1457-dock-icon-only-wings.md new file mode 100644 index 000000000..21825669b --- /dev/null +++ b/changelog.d/1457-dock-icon-only-wings.md @@ -0,0 +1,5 @@ +- Between 721px and 900px wide (tablet portrait, phone landscape), the + Location and Visual Presets dock wings show only their icons, so their + labels no longer spill over the voice control or take taps meant for the + mic button. The full name stays in the tooltip and accessible name, and the + Cyber layout keeps its labels (ZloyS, #1457). From 2a335a8f3560ab16bc4fe5cd4956939def32ad46 Mon Sep 17 00:00:00 2001 From: Luis Ortiz <2839770+anobjectn@users.noreply.github.com> Date: Wed, 28 Oct 2026 15:34:04 -0400 Subject: [PATCH 10/30] fix(deps): pin Node 24.22.1 for the October 21, 2026 security release Node.js 24.14.0 carries CVE-2026-111497 ("Node2Shell"), an out-of-bounds write in the bundled Brotli decoder that can lead to remote code execution, plus several high-severity DNS, TLS and URL-parsing fixes. 24.22.1 is the first patched 24.x release. - Dockerfile: node:24.22.1-slim, digest re-pinned to the multi-arch index - CI: 24.22.1 in the verify matrix and the other two jobs; the allocation-gate requirement now keys on 24.22.1 - Docs: contributor setup and the dependency baseline name 24.22.1 The engines floor and the setup doctor are unchanged. Co-Authored-By: Claude Sonnet 5.5 --- .github/workflows/ci.yml | 8 ++++---- CONTRIBUTING.md | 8 +++++--- Dockerfile | 2 +- README.md | 5 +++-- docs/CURRENT-STATE.md | 4 +++- 5 files changed, 16 insertions(+), 11 deletions(-) diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index ce3563685..766f0cc51 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -20,10 +20,10 @@ jobs: strategy: fail-fast: false matrix: - node: [24.14.0, 26.x] + node: [24.22.1, 26.x] env: PUPPETEER_SKIP_DOWNLOAD: '1' - GEV_REQUIRE_ALLOCATION_GATE: ${{ matrix.node == '24.14.0' && '1' || '0' }} + GEV_REQUIRE_ALLOCATION_GATE: ${{ matrix.node == '24.22.1' && '1' || '0' }} steps: - name: Check out source uses: actions/checkout@11d5960a326750d5838078e36cf38b85af677262 # v4.4.0 @@ -76,7 +76,7 @@ jobs: - name: Use Node.js uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.4.0 with: - node-version: 24.14.0 + node-version: 24.22.1 cache: npm - name: Install locked dependencies and headless Chrome @@ -131,7 +131,7 @@ jobs: - name: Use Node.js uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.4.0 with: - node-version: 24.14.0 + node-version: 24.22.1 cache: npm - name: Run the Pinokio install path diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index a7fe8ab76..591cdd85d 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -4,13 +4,15 @@ Thanks for being here. God's Eye View is an open foundation for live spatial int ## Getting set up -Use Node.js 24.14.x or 26.x (also enforced by `package.json`). +Use Node.js 24.14.x or 26.x (also enforced by `package.json`). Prefer 24.22.1 or +later: earlier releases lack the October 21, 2026 security fixes, including +CVE-2026-111497 (a Brotli decoder flaw that can lead to remote code execution). ```bash git clone https://github.com/bilawalsidhu/gods-eye-view.git cd gods-eye-view -nvm install 24.14.0 -nvm use 24.14.0 +nvm install 24.22.1 +nvm use 24.22.1 npm install npm run doctor ./scripts/dev-fresh.sh # or: npm run dev (keys are optional) diff --git a/Dockerfile b/Dockerfile index 433d170a8..e711ec1d9 100644 --- a/Dockerfile +++ b/Dockerfile @@ -4,7 +4,7 @@ # proxies (ADS-B, AIS, Overpass, OpenAI Realtime, ...) as middleware, so there # is nothing else to containerise. See compose.yaml for the usual entry point. # Same Node as CI (package.json engines, .github/workflows), pinned by digest. -FROM node:24.14.0-slim@sha256:d8e448a56fc63242f70026718378bd4b00f8c82e78d20eefb199224a4d8e33d8 +FROM node:24.22.1-slim@sha256:be8204d4bd327363357f532187b752ff62759c31bedf98e9e18fc08c9cbd605c # Puppeteer is only used by the QA scripts; skip its ~150MB Chromium download. ENV PUPPETEER_SKIP_DOWNLOAD=1 diff --git a/README.md b/README.md index 0a7509efa..ee9c7819a 100644 --- a/README.md +++ b/README.md @@ -129,8 +129,9 @@ hardware; it does not establish a minimum GPU requirement. ### Path 2 — Terminal / coding agent -Use **Node.js 24.x (24.14.0 or later) or 26.x**. The setup doctor warns about -Node 25, which is end-of-life. +Use **Node.js 24.x (24.14.0 or later) or 26.x**; 24.22.1 or later (26.12.1 or +later on 26) includes the October 21, 2026 security fixes, among them +CVE-2026-111497. The setup doctor warns about Node 25, which is end-of-life. ```bash git clone https://github.com/bilawalsidhu/gods-eye-view.git diff --git a/docs/CURRENT-STATE.md b/docs/CURRENT-STATE.md index 3e7f333a1..098bd3e83 100644 --- a/docs/CURRENT-STATE.md +++ b/docs/CURRENT-STATE.md @@ -6024,7 +6024,9 @@ The lockfile uses DOMPurify 3.4.17, protobufjs 8.8.0, PostCSS 8.5.28, source-map-js 1.2.2 and nanoid 3.3.19. Cesium remains on 1.138.0. Browser QA uses Puppeteer 25.10.0; image-processing tools use Sharp 0.35.5. QA scripts await Puppeteer's asynchronous executable-path lookup before testing or passing the path to Chrome. Supported Node versions remain -24.14.x and 26.x. Use `npm ci` to reproduce the checked-in dependency tree. +24.14.x and 26.x; the Docker image and CI pin 24.22.1, the first 24.x release with +the October 21, 2026 Node.js security fixes (including CVE-2026-111497). Use +`npm ci` to reproduce the checked-in dependency tree. ### Traffic city navigation From 17d0877a4cedf1b44b9ce8f0927654ef5436390d Mon Sep 17 00:00:00 2001 From: Luis Ortiz <2839770+anobjectn@users.noreply.github.com> Date: Wed, 28 Oct 2026 15:35:06 -0400 Subject: [PATCH 11/30] docs(changelog): add the #1458 fragment Co-Authored-By: Claude Sonnet 5.5 --- changelog.d/1458-node-24-22-1-security-release.md | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 changelog.d/1458-node-24-22-1-security-release.md diff --git a/changelog.d/1458-node-24-22-1-security-release.md b/changelog.d/1458-node-24-22-1-security-release.md new file mode 100644 index 000000000..a440892a8 --- /dev/null +++ b/changelog.d/1458-node-24-22-1-security-release.md @@ -0,0 +1,3 @@ +- The Docker image and CI now pin Node 24.22.1, the first 24.x release with + the October 21, 2026 security fixes, including CVE-2026-111497 (a Brotli + decoder flaw that can lead to remote code execution) (anobjectn, #1458). From 08dd88b2ce9a0380057ed3cf6e8c6ed7da2e972a Mon Sep 17 00:00:00 2001 From: Said Turksever Date: Thu, 29 Oct 2026 11:12:46 +0000 Subject: [PATCH 12/30] Gather Directions, Draw and Import in a Utilities panel UTILITIES becomes its own panel in the left column, after Data Layers and CCTV and above Scenes. The layer panel renders the Directions row into the panel's list instead of Data Layers, and Draw and Import move there from DISPLAY with their ids unchanged. Radio, the other row under the old Utilities heading, stays in Data Layers under "Audio". The panel collapses and remembers its state like the other left panels; share links do not carry it. It hides in clean view, recording and Cockpit, takes the Cyber left-rail treatment, and sits collapsed in the phone's Layers sheet. Voice focuses the Directions row in its new list. The Directions, Draw, Import and form-field gates open UTILITIES to reach their controls. --- docs/CURRENT-STATE.md | 20 +++++- scripts/qa-directions.mjs | 22 +++--- scripts/qa-draw-tool.mjs | 18 +++-- scripts/qa-form-fields.mjs | 21 +++++- scripts/qa-geo-import.mjs | 8 ++- src/annotations/drawTool.test.mjs | 10 +-- src/i18n/locales/es.json | 2 + src/i18n/locales/ru.json | 2 + src/i18n/locales/zh-CN.json | 2 + src/i18n/locales/zh-Hant.json | 2 + src/i18n/same-as-english.json | 1 + src/ui/cyberTheme.test.mjs | 21 ++++-- src/ui/geoFileImport.test.mjs | 4 +- src/ui/layerPanel.js | 48 ++++++++++--- src/ui/panelChrome.js | 1 + src/ui/styles/cockpit.css | 1 + src/ui/styles/controls.css | 1 + src/ui/styles/cyber.css | 12 ++-- src/ui/styles/layers.css | 98 ++++++++++++++++++++++++++ src/ui/styles/mobile-shell.css | 3 + src/ui/styles/recording.css | 1 + src/ui/styles/responsive.css | 2 + src/ui/styles/scenes.css | 18 ++++- src/ui/templates/display-controls.html | 35 --------- src/ui/templates/layer-panels.html | 50 +++++++++++++ src/voice/gevActions.js | 3 +- 26 files changed, 319 insertions(+), 87 deletions(-) diff --git a/docs/CURRENT-STATE.md b/docs/CURRENT-STATE.md index 146e157d8..0c3221945 100644 --- a/docs/CURRENT-STATE.md +++ b/docs/CURRENT-STATE.md @@ -131,6 +131,20 @@ provider registration rejects compositions that cannot fit rather than truncatin identities. A malformed or duplicate entry invalidates the complete custom-switch field. Existing whole-link size limits still apply. +## Utilities panel — October 29, 2026 + +UTILITIES is its own panel in the left column, after Data Layers and CCTV and +above Scenes (`#utilities-panel` in `src/ui/templates/layer-panels.html`). It +holds the Directions layer row, which `LayerPanel` renders into +`#utilities-toggles` instead of the Data Layers list, and Draw and Import, +which moved there from DISPLAY with their ids unchanged. Radio, formerly the +other row under the Data Layers "Utilities" heading, stays in Data Layers under +"Audio". The panel collapses and remembers its state like the other left +panels; share links do not carry it. It hides in clean view, recording and +Cockpit, and on a phone it sits collapsed in the Layers sheet under Data +Layers. The Directions, Draw and Import QA gates open it to reach their +controls. + ## God's Eye View in conversations — October 2, 2026 Tool answers that can be shown in God's Eye View include a view: camera, layers, @@ -284,7 +298,7 @@ settings from active map/contact effects. Sonar settings are session-only and return to their defaults on reload. Sliders accept integer values matching the action's ranges. -Wind appears in the Weather group before Utilities. The surface-weather prototype +Wind appears in the Weather group before Audio. The surface-weather prototype uses keyless NOAA GFS or ECMWF IFS forecasts on an approximately 1° display grid. It defaults to 10 m wind trails over the existing basemap. Speed shading is an explicit choice; earlier v2 links retain their original speed-shading meaning. Weather rows contain only the toggle and source/meta line. Configuration lives @@ -5396,7 +5410,7 @@ request viewbox and continues searching without that geographic preference. ### Manual Whiteboard Drawing (September 2026) -- DISPLAY ▸ **Draw** turns the globe into a whiteboard drawn by hand. Pick a shape (Area, Line, Pin), click the vertices on the real world, type an optional label and pick a colour, and finish. **Keyboard contract, live only while Draw is on and never while you are typing in another field:** Enter finishes the shape (as does a double-click, and the two cannot both submit it — the session is replaced before the annotate call is awaited); Backspace removes the last vertex; Esc cancels the shape in progress, and a second Esc — Esc on an empty session — leaves draw mode. Typing in the label field keeps Backspace; Enter there also finishes. **Clear** wipes the board (the shape in progress and every placed mark), so removing marks does not require the console or the microphone. +- UTILITIES ▸ **Draw** turns the globe into a whiteboard drawn by hand. Pick a shape (Area, Line, Pin), click the vertices on the real world, type an optional label and pick a colour, and finish. **Keyboard contract, live only while Draw is on and never while you are typing in another field:** Enter finishes the shape (as does a double-click, and the two cannot both submit it — the session is replaced before the annotate call is awaited); Backspace removes the last vertex; Esc cancels the shape in progress, and a second Esc — Esc on an empty session — leaves draw mode. Typing in the label field keeps Backspace; Enter there also finishes. **Clear** wipes the board (the shape in progress and every placed mark), so removing marks does not require the console or the microphone. - Runtime entry: `createApplicationTools` (`src/app/tools.js`, behind the `src/standalone/tools.js` shim) calls `initDrawTool({ viewer, annotations })` after `initAnnotations` and defers its `destroy()`, so disposing the shell returns every DOM listener, the Cesium handler, the preview data source, the borrowed click actions and the `window.__gevDrawTool` handle. Its markup is a DISPLAY-rail component template (`src/ui/templates/display-controls.html`), assembled into `index.html` at build time. That handle (`setActive`, `setShape`, `addVertex(lon, lat)`, `finish`, `cancel`, `clearAll`, `diagnostics`) is the no-mouse test seam. - Contract: a finished shape is submitted through the SAME `annotationEngine.annotate()` the voice agent uses, with geometry supplied and `manual: true` (`type: area` + `ring`, `type: route` + `path`, `type: pin` + coordinates). `resolveSpec` short-circuits manual specs (`resolveManualSpec`) so no geocoder, Places or Overpass call is made. A drawn area is a real (not synthesized) outline and drapes solid; a drawn line is a `route` with `mode: 'manual'`, labelled with its length and never a travel time; a pin is a point. Drawn marks therefore render with the whiteboard look, persist, de-dup, appear in `.list()`, and clear with `clear_annotations` / `.clear()`. - **A vertex is a lon/lat, and the mark is DRAPED.** Clicks are picked through `pickWorldFromScreen` — one of two scene helpers the annotation resolver factory (`src/annotations/resolver.js`) exposes alongside `sampleGroundHeight`, so the app has ONE depth-aware pick cascade rather than a second written beside it — which returns the height the pick landed on as well as the coordinate, so the live preview hangs on the roof or hillside under the pointer instead of sinking to sea level. The world renderer draws areas and routes with `clampToGround`, so the height is dropped at finish in one place (`finishSpec`) rather than being carried downstream and discarded silently: what you get is the outline you drew, lying on the surface beneath it. @@ -5436,7 +5450,7 @@ request viewbox and continues searching without that geographic preference. ### Import Your Own Files (October 2026) -- DISPLAY ▸ **Import** reads GeoJSON (`.geojson`/`.json`), KML, KMZ and GPX from the picker or a file drop anywhere in the app. Each file gets show/hide, Fly-to and Remove controls. GeoJSON and GPX use the row's color; KML/KMZ retain their styles and show a hatched swatch. The file bytes remain on the device for the page session. Rendered overlays can appear in map screenshots sent through voice or other existing screenshot tools. +- UTILITIES ▸ **Import** reads GeoJSON (`.geojson`/`.json`), KML, KMZ and GPX from the picker or a file drop anywhere in the app. Each file gets show/hide, Fly-to and Remove controls. GeoJSON and GPX use the row's color; KML/KMZ retain their styles and show a hatched swatch. The file bytes remain on the device for the page session. Rendered overlays can appear in map screenshots sent through voice or other existing screenshot tools. - **Ground and height.** GeoJSON XYZ coordinates become ground footprints. KML ground lines/rings are tessellated; static recorded tracks preserve their original vertices, segment gaps and explicit altitude modes. KML with absolute/relative altitude keeps that meaning. Ground pins resolve in batches of 256 against loaded terrain and, in the nearby camera footprint on photoreal maps, `clampToHeightMostDetailed`, then draw in one owned native BillboardCollection per file, with static positions and no per-frame point Entity visualizer or clamping callbacks. Point metadata remains in `dataSource.importedEntities` for framing/style inspection; non-point geometry stays in the normal source collection. Pin collections mount only after source admission, follow file show/hide, and are destroyed on removal. Settled camera/map-source changes and completed terrain loads refresh visible files through the same serial queue; distant points retain their latest available height. No detailed worldwide terrain sweep is started. Nearby mesh sampling can add requests/time; configured photoreal providers require separate validation. The depth test is disabled for ground pins, matching Draw's marker visibility policy. - **Navigation.** Row Fly-to uses `runImmediateNavigation('file', …)`; Cockpit can refuse it and existing follow/track ownership is released first. Automatic Fly-to is stamped when a batch is submitted and reasserted before flying. Pointer/wheel gestures and newer navigation supersede it, including time spent in the queue. Framing uses every finite visible point/path/polygon-hole/wall vertex plus rotated overlay bounds, with viewport-aware range and a nadir view. The target uses available terrain/cached ground height and the ground guard on arrival. Empty footprints never fall back to deferred `viewer.flyTo`. - **Clock.** Imports expose no source clock and no entity availability. KML times/view metadata are removed before loading; recorded tracks become static lines. GPX segments remain separate and GPX times are ignored. The shared clock stays unchanged. diff --git a/scripts/qa-directions.mjs b/scripts/qa-directions.mjs index ca271026f..9fb8b9802 100644 --- a/scripts/qa-directions.mjs +++ b/scripts/qa-directions.mjs @@ -107,7 +107,7 @@ const layerState = () => const manager = gev.dataManager; const module = manager.layers.get('directions').module; const row = document.querySelector( - '#data-toggles [data-layer-id="directions"]', + '#utilities-toggles [data-layer-id="directions"]', ); const controls = module.getRowControls(); const viewer = gev.viewer; @@ -152,7 +152,7 @@ const layerState = () => const clickChip = async (chipId) => { const clicked = await page.evaluate((id) => { const row = document.querySelector( - '#data-toggles [data-layer-id="directions"]', + '#utilities-toggles [data-layer-id="directions"]', ); const button = row?.querySelector(`button[data-chip-id="${id}"]`); if (!button || button.disabled) return false; @@ -232,24 +232,26 @@ try { }); await sleep(3000); - // ── 1. Open the DATA LAYERS panel, then toggle the row on. ────────────── + // ── 1. Open the UTILITIES panel, then toggle the row on. ──────────────── const opened = await page.evaluate(() => { - const panel = document.getElementById('data-panel'); + const panel = document.getElementById('utilities-panel'); if (!panel) return false; if (panel.classList.contains('collapsed')) { panel - .querySelector('.panel-collapse-btn[data-collapse-target="data-panel"]') + .querySelector( + '.panel-collapse-btn[data-collapse-target="utilities-panel"]', + ) ?.click(); } return !document - .getElementById('data-panel') + .getElementById('utilities-panel') .classList.contains('collapsed'); }); await sleep(700); - check('the DATA LAYERS panel opens from its own header control', opened); + check('the UTILITIES panel opens from its own header control', opened); const toggled = await page.evaluate(() => { const row = document.querySelector( - '#data-toggles [data-layer-id="directions"]', + '#utilities-toggles [data-layer-id="directions"]', ); const button = row?.querySelector('.data-toggle-btn'); if (!button) return false; @@ -397,7 +399,7 @@ try { ); const focused = await page.evaluate(() => { const row = document.querySelector( - '#data-toggles [data-layer-id="directions"]', + '#utilities-toggles [data-layer-id="directions"]', ); const items = row.querySelectorAll('.data-row-list-item'); items[2]?.focus(); @@ -776,7 +778,7 @@ try { } } const row = document.querySelector( - '#data-toggles [data-layer-id="directions"]', + '#utilities-toggles [data-layer-id="directions"]', ); return { entities: left.length, diff --git a/scripts/qa-draw-tool.mjs b/scripts/qa-draw-tool.mjs index adb29f3af..e055f4a8f 100644 --- a/scripts/qa-draw-tool.mjs +++ b/scripts/qa-draw-tool.mjs @@ -196,12 +196,14 @@ try { ); check('visible tile content settles before drawing', settled); - // The DISPLAY rail starts collapsed on a first run: open it the way a user does. + // UTILITIES starts collapsed on a first run: open it the way a user does. await page.evaluate(() => { - const rail = document.getElementById('pp-toggles'); - if (rail?.classList.contains('collapsed')) + const panel = document.getElementById('utilities-panel'); + if (panel?.classList.contains('collapsed')) document - .querySelector('.panel-collapse-btn[data-collapse-target="pp-toggles"]') + .querySelector( + '.panel-collapse-btn[data-collapse-target="utilities-panel"]', + ) ?.click(); }); await page.waitForFunction( @@ -480,10 +482,12 @@ try { // ── Clear wipes the board ─────────────────────────────────────────────── await page.evaluate(() => { - const rail = document.getElementById('pp-toggles'); - if (rail?.classList.contains('collapsed')) + const panel = document.getElementById('utilities-panel'); + if (panel?.classList.contains('collapsed')) document - .querySelector('.panel-collapse-btn[data-collapse-target="pp-toggles"]') + .querySelector( + '.panel-collapse-btn[data-collapse-target="utilities-panel"]', + ) ?.click(); }); await page.waitForFunction( diff --git a/scripts/qa-form-fields.mjs b/scripts/qa-form-fields.mjs index 3bbee3816..11bdffc2b 100644 --- a/scripts/qa-form-fields.mjs +++ b/scripts/qa-form-fields.mjs @@ -276,7 +276,12 @@ try { ); await page.evaluate(() => { - for (const panel of ['pp-toggles', 'scene-panel', 'cctv-panel']) + for (const panel of [ + 'pp-toggles', + 'utilities-panel', + 'scene-panel', + 'cctv-panel', + ]) window.__godsEyeView.styleManager.setPanelCollapsed(panel, false, { persist: false, syncShare: false, @@ -419,14 +424,24 @@ try { { timeout: 60000 }, ); await page.evaluate(() => { - for (const panel of ['pp-toggles', 'scene-panel', 'cctv-panel']) + for (const panel of [ + 'pp-toggles', + 'utilities-panel', + 'scene-panel', + 'cctv-panel', + ]) window.__godsEyeView.styleManager.setPanelCollapsed(panel, false, { persist: false, syncShare: false, }); }); await page.evaluate(() => { - for (const panel of ['pp-toggles', 'scene-panel', 'cctv-panel']) + for (const panel of [ + 'pp-toggles', + 'utilities-panel', + 'scene-panel', + 'cctv-panel', + ]) window.__godsEyeView.styleManager.setPanelCollapsed(panel, false, { persist: false, syncShare: false, diff --git a/scripts/qa-geo-import.mjs b/scripts/qa-geo-import.mjs index 074eb8fbd..c744b4825 100644 --- a/scripts/qa-geo-import.mjs +++ b/scripts/qa-geo-import.mjs @@ -269,10 +269,12 @@ try { }, VIEW); await wait(4000); await page.evaluate(() => { - const rail = document.getElementById('pp-toggles'); - if (rail?.classList.contains('collapsed')) + const panel = document.getElementById('utilities-panel'); + if (panel?.classList.contains('collapsed')) document - .querySelector('.panel-collapse-btn[data-collapse-target="pp-toggles"]') + .querySelector( + '.panel-collapse-btn[data-collapse-target="utilities-panel"]', + ) ?.click(); }); await page.waitForFunction( diff --git a/src/annotations/drawTool.test.mjs b/src/annotations/drawTool.test.mjs index e6ce2e9f3..2ba88d3dd 100644 --- a/src/annotations/drawTool.test.mjs +++ b/src/annotations/drawTool.test.mjs @@ -62,9 +62,9 @@ test('the engine resolves manual geometry before any name resolution', () => { }); test('the Draw control markup carries the ids the tool binds to', () => { - // The DISPLAY rail is a component template now, assembled into index.html at + // UTILITIES is a component template now, assembled into index.html at // build time — the markup is not in index.html any more. - const html = read('src/ui/templates/display-controls.html'); + const html = read('src/ui/templates/layer-panels.html'); const ids = [ 'draw-toggle', 'draw-mode-row', @@ -140,8 +140,10 @@ test('nothing promises a GeoJSON export for drawn shapes', () => { } for (const file of ['README.md', 'CHANGELOG.md', 'docs/CURRENT-STATE.md']) { const source = read(file); - const at = source.indexOf('DISPLAY ▸ **Draw**'); - const start = at >= 0 ? at : source.indexOf('DISPLAY ▸ Draw'); + const start = + ['UTILITIES ▸ **Draw**', 'DISPLAY ▸ **Draw**', 'DISPLAY ▸ Draw'] + .map((text) => source.indexOf(text)) + .find((at) => at >= 0) ?? -1; assert.ok(start >= 0, `${file} should describe the Draw control`); const section = source.slice(start, start + 1200); assert.doesNotMatch( diff --git a/src/i18n/locales/es.json b/src/i18n/locales/es.json index 696233f86..9fdfac1b1 100644 --- a/src/i18n/locales/es.json +++ b/src/i18n/locales/es.json @@ -761,6 +761,7 @@ "ESC to close": "ESC para cerrar", "The Google Maps key buys the photorealistic planet — everything else stacks on top.": "La clave de Google Maps activa el planeta fotorrealista; todo lo demás se superpone.", "SCENES": "ESCENAS", + "UTILITIES": "UTILIDADES", "Scene recipe": "Receta de escena", "NEW": "NUEVA", "DEL": "BORRAR", @@ -1470,6 +1471,7 @@ "NOIR": "NOIR", "Rendered globe frames per second · toggle with `": "Fotogramas por segundo renderizados del globo · alterna con `", "Utilities": "Utilidades", + "Audio": "Audio", "Other layers": "Otras capas", "Movement": "Movimiento", "Infrastructure": "Infraestructura", diff --git a/src/i18n/locales/ru.json b/src/i18n/locales/ru.json index 8764d9d06..baf98e27c 100644 --- a/src/i18n/locales/ru.json +++ b/src/i18n/locales/ru.json @@ -817,6 +817,7 @@ "Scene recipe": "Рецепт сцены", "DATA LAYERS": "СЛОИ ДАННЫХ", "SCENES": "СЦЕНЫ", + "UTILITIES": "ИНСТРУМЕНТЫ", "Close key setup": "Закрыть настройку ключей", "SAVE KEYS": "СОХРАНИТЬ КЛЮЧИ", "Power up the globe": "Подключите потоки данных", @@ -1492,6 +1493,7 @@ "NOIR": "НУАР", "Rendered globe frames per second · toggle with `": "Кадров глобуса в секунду · переключение клавишей `", "Utilities": "Инструменты", + "Audio": "Аудио", "Other layers": "Другие слои", "Movement": "Движение", "Infrastructure": "Инфраструктура", diff --git a/src/i18n/locales/zh-CN.json b/src/i18n/locales/zh-CN.json index 2e7db6b8f..d869e077a 100644 --- a/src/i18n/locales/zh-CN.json +++ b/src/i18n/locales/zh-CN.json @@ -1756,6 +1756,7 @@ "Events": "事件", "Weather": "天气", "Utilities": "工具", + "Audio": "音频", "Other layers": "其他图层", "{state} · {source}": "{state} · {source}", "UNCERTAIN · {source} · lifecycle state requires reconciliation": "不确定 · {source} · 生命周期状态需要核对", @@ -2723,6 +2724,7 @@ "FLAT": "平面", "SINCE": "起始时间", "SCENES": "场景", + "UTILITIES": "工具", "Scene recipe": "场景方案", "NEW": "新建", "CAPTURE SHOT": "保存镜头", diff --git a/src/i18n/locales/zh-Hant.json b/src/i18n/locales/zh-Hant.json index 1477acd51..4e98cf9d6 100644 --- a/src/i18n/locales/zh-Hant.json +++ b/src/i18n/locales/zh-Hant.json @@ -1746,6 +1746,7 @@ "Events": "事件", "Weather": "天氣", "Utilities": "工具", + "Audio": "音訊", "Other layers": "其他圖層", "{state} · {source}": "{state} · {source}", "UNCERTAIN · {source} · lifecycle state requires reconciliation": "不確定 · {source} · 生命週期狀態需要核對", @@ -2711,6 +2712,7 @@ "FLAT": "平面", "SINCE": "起始時間", "SCENES": "場景", + "UTILITIES": "工具", "Scene recipe": "場景方案", "NEW": "新建", "CAPTURE SHOT": "保存鏡頭", diff --git a/src/i18n/same-as-english.json b/src/i18n/same-as-english.json index 83c8897d8..0c18df79a 100644 --- a/src/i18n/same-as-english.json +++ b/src/i18n/same-as-english.json @@ -9,6 +9,7 @@ "AUTO", "Ambient", "Anime", + "Audio", "Austin", "BRG {value}°", "BRG —", diff --git a/src/ui/cyberTheme.test.mjs b/src/ui/cyberTheme.test.mjs index 03ee75f08..686ee9af2 100644 --- a/src/ui/cyberTheme.test.mjs +++ b/src/ui/cyberTheme.test.mjs @@ -1,4 +1,9 @@ -import { getScopeMaskFeather, isScopeMaskEnabled, setScopeMaskEnabled, setScopeMaskFeather } from '../scopeMask.js'; +import { + getScopeMaskFeather, + isScopeMaskEnabled, + setScopeMaskEnabled, + setScopeMaskFeather, +} from '../scopeMask.js'; import assert from 'node:assert/strict'; import { readFileSync } from 'node:fs'; import test from 'node:test'; @@ -274,8 +279,14 @@ test('Display and voice HUD routes preserve explicit Cyber entry and exit author test('scope choice and expanded feather survive every HUD layout and both restore paths', async (t) => { const { owner } = styleOwner(t, 'tactical'); - const previous = { enabled: isScopeMaskEnabled(), feather: getScopeMaskFeather() }; - t.after(() => { setScopeMaskEnabled(previous.enabled); setScopeMaskFeather(previous.feather); }); + const previous = { + enabled: isScopeMaskEnabled(), + feather: getScopeMaskFeather(), + }; + t.after(() => { + setScopeMaskEnabled(previous.enabled); + setScopeMaskFeather(previous.feather); + }); Object.assign(owner.services, { setScopeMaskEnabled, setScopeMaskFeather }); owner._scopeBtn = { checked: true }; owner._scopeFeatherSlider = { value: '11', disabled: false }; @@ -534,11 +545,11 @@ test('Cyber side panels share one width and one framed surface material', () => ); assert.match( cyberStyles, - /#left-panel-stack\s*> :is\(#data-panel, #scene-panel\)\.collapsed \{\s*width: var\(--cyber-panel-collapsed-width\);/, + /#left-panel-stack\s*> :is\(#data-panel, #utilities-panel, #scene-panel\)\.collapsed \{\s*width: var\(--cyber-panel-collapsed-width\);/, ); assert.match( cyberStyles, - /:is\(#data-panel, #scene-panel\)\.collapsed\s+:is\(\.data-panel-inner, \.scene-panel-inner\) \{[\s\S]*?height: 50px;[\s\S]*?min-height: 50px;/, + /:is\(#data-panel, #utilities-panel, #scene-panel\)\.collapsed\s+:is\(\.data-panel-inner, \.scene-panel-inner\) \{[\s\S]*?height: 50px;[\s\S]*?min-height: 50px;/, ); assert.match( cyberStyles, diff --git a/src/ui/geoFileImport.test.mjs b/src/ui/geoFileImport.test.mjs index eb4bdfa99..d78731af5 100644 --- a/src/ui/geoFileImport.test.mjs +++ b/src/ui/geoFileImport.test.mjs @@ -439,7 +439,7 @@ test('the application composition wires the import and owns its teardown', () => ); assert.ok(tools.indexOf('defer(() => geoFileImport?.destroy());') > importAt); const markup = fs.readFileSync( - new URL('./templates/display-controls.html', import.meta.url), + new URL('./templates/layer-panels.html', import.meta.url), 'utf8', ); for (const id of [ @@ -450,7 +450,7 @@ test('the application composition wires the import and owns its teardown', () => ]) assert.ok( markup.includes(`id="${id}"`), - `${id} missing from the DISPLAY template`, + `${id} missing from the UTILITIES template`, ); }); diff --git a/src/ui/layerPanel.js b/src/ui/layerPanel.js index 24bcad6e6..b654097b4 100644 --- a/src/ui/layerPanel.js +++ b/src/ui/layerPanel.js @@ -87,13 +87,20 @@ const PANEL_GROUPS = [ 'weather-cyclones', ], }, + // Directions renders in the Utilities panel, beside Draw and Import, and + // needs no heading there. { label: msg('Utilities'), - ids: ['directions', 'radio'], + ids: ['directions'], + containerId: 'utilities-toggles', + }, + { + label: msg('Audio'), + ids: ['radio'], }, ]; -const PANEL_ORDER = PANEL_GROUPS.flatMap(({ label, ids }) => - ids.map((id) => ({ id, label })), +const PANEL_ORDER = PANEL_GROUPS.flatMap(({ label, ids, containerId }) => + ids.map((id) => ({ id, label, containerId })), ); const PANEL_POSITIONS = new Map( PANEL_ORDER.map(({ id }, index) => [id, index]), @@ -226,6 +233,12 @@ export class LayerPanel { if (this._destroyed) return; this._releaseBindings(); this._toggleContainer = container; + this._groupContainers = new Map(); + for (const { containerId } of PANEL_GROUPS) { + const element = + containerId && container?.ownerDocument?.getElementById?.(containerId); + if (element) this._groupContainers.set(containerId, element); + } this._weatherPanel?.destroy(); this._weatherPanel = createWeatherPanel({ clock: this.weatherClock, @@ -276,11 +289,27 @@ export class LayerPanel { this._recentImageryPanel = null; this._recentImageryFactory = null; this._toggleContainer = null; + this._groupContainers = null; + } + /** The list a row renders into: its group's own, else Data Layers. */ + _containerFor(layerId) { + const containerId = PANEL_ORDER[PANEL_POSITIONS.get(layerId)]?.containerId; + return ( + (containerId && this._groupContainers?.get(containerId)) || + this._toggleContainer + ); + } + _rowFor(layerId) { + return this._containerFor(layerId)?.querySelector( + `[data-layer-id="${layerId}"]`, + ); } _renderToggles() { if (this._destroyed || !this._toggleContainer) return; this._releaseBindings(); this._toggleContainer.innerHTML = ''; + for (const element of this._groupContainers?.values() || []) + element.innerHTML = ''; const generation = this._generation; const layers = this.getAll() @@ -296,7 +325,12 @@ export class LayerPanel { const group = PANEL_ORDER[PANEL_POSITIONS.get(layer.id)]?.label ?? msg('Other layers'); - if (group && group !== previousGroup) { + const rowContainer = this._containerFor(layer.id); + if ( + rowContainer === this._toggleContainer && + group && + group !== previousGroup + ) { const heading = document.createElement('h3'); heading.className = 'data-layer-group-heading'; heading.textContent = t(group); @@ -421,7 +455,7 @@ export class LayerPanel { } } - this._toggleContainer.appendChild(row); + rowContainer.appendChild(row); } this._refreshWeatherPanel(); } @@ -600,9 +634,7 @@ export class LayerPanel { return; } for (const layer of this.getAll()) { - const row = this._toggleContainer.querySelector( - `[data-layer-id="${layer.id}"]`, - ); + const row = this._rowFor(layer.id); if (!row) continue; const btn = row.querySelector('.data-toggle-btn'); diff --git a/src/ui/panelChrome.js b/src/ui/panelChrome.js index d920e8545..edb8a4dca 100644 --- a/src/ui/panelChrome.js +++ b/src/ui/panelChrome.js @@ -30,6 +30,7 @@ const COCKPIT_ENTRY_COLLAPSE_PANEL_IDS = Object.freeze([ 'recent-imagery-panel', 'street-level-panel', 'scene-panel', + 'utilities-panel', 'pp-toggles', 'global-context-panel', 'radio-panel', diff --git a/src/ui/styles/cockpit.css b/src/ui/styles/cockpit.css index d54e09f8d..6736ae193 100644 --- a/src/ui/styles/cockpit.css +++ b/src/ui/styles/cockpit.css @@ -2007,6 +2007,7 @@ body.cockpit-mode #left-panel-stack { max-height: none; transition: none; } +body.cockpit-mode #left-panel-stack > #utilities-panel, body.cockpit-mode #left-panel-stack > #scene-panel { display: none !important; } diff --git a/src/ui/styles/controls.css b/src/ui/styles/controls.css index 59f275109..8279ef30c 100644 --- a/src/ui/styles/controls.css +++ b/src/ui/styles/controls.css @@ -960,6 +960,7 @@ body.ui-clean-view #data-panel, body.ui-clean-view #cctv-panel, body.ui-clean-view #radio-panel, body.ui-clean-view #global-context-panel, +body.ui-clean-view #utilities-panel, body.ui-clean-view #scene-panel { opacity: 0 !important; visibility: hidden !important; diff --git a/src/ui/styles/cyber.css b/src/ui/styles/cyber.css index e25bbae2d..715917b6e 100644 --- a/src/ui/styles/cyber.css +++ b/src/ui/styles/cyber.css @@ -1662,7 +1662,9 @@ :root[data-ui-theme='cyber'] body:not(.cockpit-mode) #left-panel-stack:has(> [data-panel-id]:not(.collapsed)) - > :is(#data-panel, #cctv-panel, #scene-panel):not(.collapsed) { + > :is(#data-panel, #cctv-panel, #utilities-panel, #scene-panel):not( + .collapsed + ) { flex: 1 1 auto; height: auto; max-height: none; @@ -1677,20 +1679,20 @@ :root[data-ui-theme='cyber'] #left-panel-stack - > :is(#data-panel, #scene-panel) { + > :is(#data-panel, #utilities-panel, #scene-panel) { --panel-expanded-width: var(--cyber-panel-width); width: var(--panel-expanded-width); } :root[data-ui-theme='cyber'] #left-panel-stack - > :is(#data-panel, #scene-panel).collapsed { + > :is(#data-panel, #utilities-panel, #scene-panel).collapsed { width: var(--cyber-panel-collapsed-width); } :root[data-ui-theme='cyber'] #left-panel-stack - > :is(#data-panel, #scene-panel).collapsed + > :is(#data-panel, #utilities-panel, #scene-panel).collapsed :is(.data-panel-inner, .scene-panel-inner) { box-sizing: border-box; height: 50px; @@ -1718,7 +1720,7 @@ :root[data-ui-theme='cyber'] body:not(.cockpit-mode) - :is(#data-panel, #scene-panel) + :is(#data-panel, #utilities-panel, #scene-panel) .panel-collapse-btn { width: var(--cyber-panel-control-size); min-width: var(--cyber-panel-control-size); diff --git a/src/ui/styles/layers.css b/src/ui/styles/layers.css index ea64eefc5..2f4de3d18 100644 --- a/src/ui/styles/layers.css +++ b/src/ui/styles/layers.css @@ -1398,3 +1398,101 @@ body.recording-mode #right-context-rail > [data-panel-id] { width: 100%; } } + +/* ── Utilities Panel ─────────────────────────── */ +/* Directions (from the layer list), Draw and Import. Draw and Import read as + rows like Directions above them (.data-toggle-row): icon and name, their + options indented under the name. */ +#utilities-panel { + --panel-expanded-width: 280px; + width: var(--panel-expanded-width); +} + +#utilities-panel .panel-glow { + position: absolute; + inset: -20px; + background: radial-gradient( + ellipse at center, + var(--accent-dim) 0%, + transparent 60% + ); + filter: blur(20px); + opacity: 0.25; + pointer-events: none; +} + +/* The layer list takes its natural height; the panel scrolls as a whole. */ +.utilities-list { + flex: 0 0 auto; + max-height: none; + overflow: visible; +} + +.utilities-tools { + display: flex; + flex-direction: column; + gap: 2px; + margin-top: 2px; +} + +.utilities-tools .pp-toggle-group { + width: 100%; +} + +#utilities-panel .utilities-tools .pp-toggle-btn { + width: 100%; + min-height: 0; + box-sizing: border-box; + gap: 8px; + padding: 8px 10px 6px; + color: var(--text-primary); + text-align: left; + background: transparent; + border: 0; + border-radius: 8px; + box-shadow: none; + backdrop-filter: none; + -webkit-backdrop-filter: none; + transition: background var(--transition-fast); +} + +#utilities-panel .utilities-tools .pp-toggle-btn:hover { + background: rgba(255, 255, 255, 0.03); +} + +#utilities-panel .utilities-tools .pp-icon { + flex: none; + width: 16px; + font-size: 16px; + line-height: 1; + color: var(--text-primary); + text-align: center; +} + +#utilities-panel .utilities-tools .pp-label { + font-family: var(--font-sans); + font-size: 13px; + font-weight: 500; + letter-spacing: 0.3px; + text-transform: none; + color: var(--text-primary); +} + +/* Draw reads as on with the accent of an enabled layer row. */ +#utilities-panel + .utilities-tools + .pp-toggle-btn:is([aria-pressed='true'], .active) { + background: var(--accent-dim); + box-shadow: inset 2px 0 0 var(--accent); +} + +#utilities-panel + .utilities-tools + :is(.pp-slider-row, .geo-import-list, .geo-import-hint) { + margin-left: 34px; + margin-right: 10px; +} + +#utilities-panel.collapsed .utilities-tools { + display: none; +} diff --git a/src/ui/styles/mobile-shell.css b/src/ui/styles/mobile-shell.css index aecfdf8d4..481535434 100644 --- a/src/ui/styles/mobile-shell.css +++ b/src/ui/styles/mobile-shell.css @@ -166,6 +166,9 @@ body.mobile-shell #right-context-rail > #recent-imagery-panel { /* Rail-scoped ids so a rail's own hiding rules (for example the Tactical HUD hiding collapsed siblings) never take a panel out of an open sheet. */ body.mobile-shell[data-mobile-sheet='layers'] #left-panel-stack > #data-panel, +body.mobile-shell[data-mobile-sheet='layers'] + #left-panel-stack + > #utilities-panel, body.mobile-shell[data-mobile-sheet='layers'] #left-panel-stack > #scene-panel, body.mobile-shell[data-mobile-sheet='cameras'] #right-context-rail diff --git a/src/ui/styles/recording.css b/src/ui/styles/recording.css index be806a87a..97a326fd6 100644 --- a/src/ui/styles/recording.css +++ b/src/ui/styles/recording.css @@ -15,6 +15,7 @@ body.recording-mode #cctv-panel, body.recording-mode #radio-panel, body.recording-mode #global-context-panel, body.recording-mode #gev-voice-control, +body.recording-mode #utilities-panel, body.recording-mode #scene-panel { opacity: 0 !important; visibility: hidden !important; diff --git a/src/ui/styles/responsive.css b/src/ui/styles/responsive.css index 8278b51a7..04dbf276b 100644 --- a/src/ui/styles/responsive.css +++ b/src/ui/styles/responsive.css @@ -237,11 +237,13 @@ #left-panel-stack > #cctv-panel, #left-panel-stack > #street-level-panel, #left-panel-stack > #global-context-panel, + #left-panel-stack > #utilities-panel, #left-panel-stack > #scene-panel, #left-panel-stack > #data-panel.collapsed, #left-panel-stack > #cctv-panel.collapsed, #left-panel-stack > #street-level-panel.collapsed, #left-panel-stack > #global-context-panel.collapsed, + #left-panel-stack > #utilities-panel.collapsed, #left-panel-stack > #scene-panel.collapsed { position: relative; top: auto; diff --git a/src/ui/styles/scenes.css b/src/ui/styles/scenes.css index 29250a636..9cd15b797 100644 --- a/src/ui/styles/scenes.css +++ b/src/ui/styles/scenes.css @@ -14,6 +14,7 @@ #left-panel-stack > #data-panel, #left-panel-stack > #cctv-panel, #left-panel-stack > #global-context-panel, +#left-panel-stack > #utilities-panel, #left-panel-stack > #scene-panel { position: relative; top: auto; @@ -35,6 +36,10 @@ order: 2; } +#left-panel-stack > #utilities-panel { + order: 3; +} + #left-panel-stack > #scene-panel { order: 4; } @@ -50,6 +55,7 @@ #left-panel-stack > #data-panel:not(.collapsed), #left-panel-stack > #cctv-panel:not(.collapsed), +#left-panel-stack > #utilities-panel:not(.collapsed), #left-panel-stack > #scene-panel:not(.collapsed) { box-sizing: border-box; flex: 0 1 var(--left-panel-allocated-height, auto); @@ -62,7 +68,9 @@ * the canonical control order and center their combined stack at 50vh. */ #left-panel-stack.layout-tail - > :is(#data-panel, #cctv-panel, #scene-panel):not(.collapsed) { + > :is(#data-panel, #cctv-panel, #utilities-panel, #scene-panel):not( + .collapsed + ) { box-sizing: border-box; flex: 0 0 var(--left-panel-allocated-height); height: var(--left-panel-allocated-height); @@ -71,6 +79,7 @@ #left-panel-stack > #data-panel:not(.collapsed) .data-panel-inner, #left-panel-stack > #cctv-panel:not(.collapsed) .cctv-panel-inner, +#left-panel-stack > #utilities-panel:not(.collapsed) .utilities-panel-inner, #left-panel-stack > #scene-panel:not(.collapsed) .scene-panel-inner { height: 100%; max-height: 100%; @@ -81,6 +90,7 @@ } #left-panel-stack > #cctv-panel:not(.collapsed) .cctv-panel-inner, +#left-panel-stack > #utilities-panel:not(.collapsed) .utilities-panel-inner, #left-panel-stack > #scene-panel:not(.collapsed) .scene-panel-inner { overflow-y: auto; scrollbar-gutter: stable; @@ -360,6 +370,8 @@ html:not([lang='en']) #scene-panel .scene-controls .scene-btn { #scene-panel.collapsed .scene-shot-list, #scene-panel.collapsed .scene-progress, #scene-panel.collapsed #scene-status, +#utilities-panel.collapsed .utilities-list, +#utilities-panel.collapsed .utilities-tools, #param-slider-panel.collapsed #param-sliders, #location-bar.collapsed .poi-row-container, #location-bar.collapsed .location-bar-divider, @@ -370,6 +382,7 @@ html:not([lang='en']) #scene-panel .scene-controls .scene-btn { #data-panel.collapsed, #cctv-panel.collapsed, +#utilities-panel.collapsed, #scene-panel.collapsed { width: var(--left-collapsed-width); } @@ -381,6 +394,7 @@ html:not([lang='en']) #scene-panel .scene-controls .scene-btn { #data-panel.collapsed .panel-title, #cctv-panel.collapsed .panel-title, #radio-panel.collapsed .panel-title, +#utilities-panel.collapsed .panel-title, #scene-panel.collapsed .panel-title { font-size: 8px; letter-spacing: 1.8px; @@ -391,6 +405,7 @@ html:not([lang='en']) #scene-panel .scene-controls .scene-btn { #cctv-panel.collapsed .cctv-panel-inner, #radio-panel.collapsed .radio-panel-inner, #scene-panel.collapsed .scene-panel-inner, +#utilities-panel.collapsed .utilities-panel-inner, #param-slider-panel.collapsed, #location-bar.collapsed .location-inner { padding-bottom: 10px; @@ -402,6 +417,7 @@ html:not([lang='en']) #scene-panel .scene-controls .scene-btn { #radio-panel.collapsed .panel-header, #global-context-panel.collapsed .panel-header, #scene-panel.collapsed .panel-header, +#utilities-panel.collapsed .panel-header, #param-slider-panel.collapsed .param-panel-header { margin-bottom: 2px; } diff --git a/src/ui/templates/display-controls.html b/src/ui/templates/display-controls.html index f6af31127..77361add5 100644 --- a/src/ui/templates/display-controls.html +++ b/src/ui/templates/display-controls.html @@ -117,41 +117,6 @@ 100% -
- -
- Shape -
- - - -
-
-
- - - - -
-
-
- - -
    - -
    + + +