Ilia Denisov
f6e4a4f6bd
The map view now selects a DARK_THEME or LIGHT_THEME palette from the resolved app theme and threads it through every primitive builder, so the canvas, planets, ship groups, cargo routes, battle/bombing markers, fog, reach + selection rings, pending-Send tracks, and the pick overlay all switch with the rest of the chrome. A theme flip remounts the renderer preserving the camera — Pixi bakes the background at init and every primitive bakes its colour at build, so a live re-tint is not possible on the same instance. This also fixes the reported bug: the gear-popover trigger and the loading overlay hardcoded a dark navy background, so in light theme the gear was invisible (dark icon on dark chip) until hover flipped it to a white chip. Both now use the --color-surface-overlay token and read correctly in both themes. The light palette mirrors the dark one role-for-role, darkened / saturated for contrast on a light background while keeping the incoming, battle, and bombing accents vivid. The values are a first pass meant to be refined during the F8 manual-QA loop. Removes the now-dead "Phase 35" references from the code and lifts the map-recoloring prohibition from the design-system / renderer docs; the battle scene stays a fixed-palette data-viz surface. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
49 lines
1.8 KiB
TypeScript
49 lines
1.8 KiB
TypeScript
// Selected-planet marker. When the SelectionStore holds a planet, the
|
|
// map draws one accent ring tight around it so the current selection is
|
|
// visible on the canvas itself (the inspector/sheet show the detail).
|
|
// Ship-group selection is intentionally not ringed here — groups are
|
|
// addressed by report index and have no single stable map coordinate.
|
|
|
|
import { DARK_THEME, type CirclePrim, type Theme } from "./world";
|
|
|
|
/** Planet marker radius in world units; mirrors `battle-markers.ts`. */
|
|
const PLANET_RADIUS_WORLD = 6;
|
|
/** The ring sits just outside the marker (and the bombing ring at +3). */
|
|
const SELECTION_RING_RADIUS = PLANET_RADIUS_WORLD + 4;
|
|
|
|
/** High-bit prefix so the ring id never collides with planet numbers,
|
|
* route lines, reach rings (`0xb…`), or battle markers. */
|
|
export const SELECTION_RING_ID = 0xc0000000;
|
|
/** Below interactive primitives so it never wins a click. */
|
|
const SELECTION_RING_PRIORITY = 0;
|
|
|
|
/**
|
|
* computeSelectionRing returns one ring primitive centred on the selected
|
|
* planet, or `null` when nothing (or a non-planet) is selected or the
|
|
* planet is absent from the current report. `theme` supplies the ring
|
|
* colour and defaults to `DARK_THEME`.
|
|
*/
|
|
export function computeSelectionRing(
|
|
planets: ReadonlyArray<{ number: number; x: number; y: number }>,
|
|
selectedPlanetId: number | null,
|
|
theme: Theme = DARK_THEME,
|
|
): CirclePrim | null {
|
|
if (selectedPlanetId === null) return null;
|
|
const planet = planets.find((p) => p.number === selectedPlanetId);
|
|
if (planet === undefined) return null;
|
|
return {
|
|
kind: "circle",
|
|
id: SELECTION_RING_ID,
|
|
priority: SELECTION_RING_PRIORITY,
|
|
hitSlopPx: 0,
|
|
x: planet.x,
|
|
y: planet.y,
|
|
radius: SELECTION_RING_RADIUS,
|
|
style: {
|
|
strokeColor: theme.selectionRing,
|
|
strokeAlpha: 0.95,
|
|
strokeWidthPx: 1.5,
|
|
},
|
|
};
|
|
}
|