mirror of
https://github.com/sbuffkin/hexmaker.git
synced 2026-07-22 06:14:01 +00:00
Per-map background image with full interactive calibration — pick or
drag-drop an image from the OS, drop straight into calibration mode,
align the hex grid to features in the image.
Calibration UX:
- Drag image body or grid body to move; corner/edge handles to resize
(image is aspect-locked; grid has top/bottom edges for hex-aspect
stretch). Anchor math: the side you grab moves, the opposite stays
fixed — see topics/design/notes/resize-handle-anchor-rule in the KB
for the derivation.
- Click an element to "focus" it; arrow keys nudge by 1 px (Shift = 10).
Sequential nudges coalesce into one undo entry.
- Floating ✓ button bottom-right commits, Esc cancels. Wheel falls
through to viewport zoom (precision alignment).
- Hex outlines drawn as an SVG overlay during calibration (CSS `border`
and `drop-shadow` filter approaches both fail on clip-path-shaped
hexes — the SVG overlay was chosen after sandbox iteration; see
dev/hex-calibration-sandbox.html).
- Resize handles use `transform: scale(1/zoom)` so they stay constant
screen size regardless of viewport zoom.
- Full undo/redo for every calibration mutation (drag, resize, nudge);
Ctrl/Cmd+Z and Ctrl/Cmd+Shift+Z hotkeys wired at view scope.
Persistence + alignment:
- New MapData.savedViewport persists per-map zoom/pan/font-size across
view close, so calibration values (sized to a specific font-size)
don't drift when the view reopens.
- bakeZoom now scales calibration values by the bake factor so
calibrated images stay aligned with the hex grid after wheel zoom.
Suppressed entirely during calibration (and pending bake timers
cancelled on entry) so the SVG outline doesn't drift mid-session.
- Path / faction / region overlay SVGs moved inside the gridContainer
so they inherit the gridDisplay transform — previously they sat as
siblings of the grid and drew at un-scaled coordinates, producing
the "two grids" effect on calibrated maps.
Other UX:
- Top/left grid expand buttons now visually anchor — the existing grid
stays put and the new row/column appears above/left, instead of the
whole grid shifting down/right.
- New "Background image" section in both the MapModal Properties tab
and the New map tab (with drop zone).
- Drag-and-drop OS images import to {hexFolder}/{mapName}/_bg/, with
filename collision auto-rename.
- "No terrain" hexes become transparent when a bg image is set, so the
image shows through.
- Calibration banner anchored to the view's contentEl (was body) so it
can't survive across view-close; defensive sweep on open clears any
banner left by a prior buggy build.
Dev infrastructure:
- dev/hex-calibration-sandbox.html — minimal hex grid that mirrors the
plugin's CSS, used to iterate on calibration outline / overlay
alignment approaches outside the live editor.
- dev/screenshot-approaches.mjs + snapshot-calibration-outline.mjs —
runners against the shared frontend-testing tool that produce one
PNG per CSS variant for LLM-direct visual review (see the
frontend-testing-tools KB project).
|
||
|---|---|---|
| .. | ||
| .gitignore | ||
| calibration-outline-overlay-sandbox.html | ||
| hex-calibration-sandbox.html | ||
| screenshot-approaches.mjs | ||
| snapshot-calibration-outline.mjs | ||