five-on-it / apps/client/src/ui/FullMap
apps/client/src/ui/FullMap
The full map: the whole city north-up in a square of min(90vw, 90dvh) over the middle of the screen, opened by the map key (M), by a click on the minimap and by the phone's Map app, closed by Esc, the key again or its Close button; the game goes on under it. It draws the city's static layer (minimap-draw.ts, the one the minimap copies from) scaled to its backing store, sharp at the screen's pixel ratio, the garages' pins (a G) and the shops' (a dot), the markers (the player, the others, the mission's targets and route, the party, the waypoint) and the labels at 12 CSS px (map-labels.ts: the districts, the streets, the garages), decluttered. A click on it drops the waypoint there; Clear waypoint takes it away. A button clicked hands the keys back to the game. The canvas says what it drew in its data attributes (data-backing, data-label-px, data-labels, data-streets, data-half), which the end-to-end tests read.