Canvas: toolbar fungerer, dobbeltklikk = tilpass visning, diskret seleksjon

- Toolbar-knapper (zoom, tilpass, grid, fullskjerm) blokkert av Canvas
  sin pointerdown-handler. Fikset med closest('.canvas-toolbar')-sjekk.
- Dobbeltklikk på tom flate kjører zoomToFit() for rask navigasjon.
- Seleksjon-ramme dempet: 1px rgba(accent, 0.4) i stedet for 2px solid.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
vegard 2026-03-19 06:01:10 +00:00
parent b37746207a
commit 6101bf00b1

View file

@ -164,6 +164,9 @@
// --- Pointer events --- // --- Pointer events ---
function handlePointerDown(e: PointerEvent) { function handlePointerDown(e: PointerEvent) {
if (!containerEl) return; if (!containerEl) return;
// Ignore clicks on toolbar and other UI overlays
if ((e.target as HTMLElement).closest('.canvas-toolbar')) return;
const rect = containerEl.getBoundingClientRect(); const rect = containerEl.getBoundingClientRect();
const sx = e.clientX - rect.left; const sx = e.clientX - rect.left;
const sy = e.clientY - rect.top; const sy = e.clientY - rect.top;
@ -412,6 +415,12 @@
onpointerdown={handlePointerDown} onpointerdown={handlePointerDown}
onpointermove={handlePointerMove} onpointermove={handlePointerMove}
onpointerup={handlePointerUp} onpointerup={handlePointerUp}
ondblclick={(e) => {
if (!(e.target as HTMLElement).closest('[data-canvas-object-id]') &&
!(e.target as HTMLElement).closest('.canvas-toolbar')) {
zoomToFit();
}
}}
ontouchstart={handleTouchStart} ontouchstart={handleTouchStart}
ontouchmove={handleTouchMove} ontouchmove={handleTouchMove}
ontouchend={handleTouchEnd} ontouchend={handleTouchEnd}
@ -541,8 +550,8 @@
} }
.canvas-object-selected { .canvas-object-selected {
outline: 2px solid #3b82f6; outline: 1px solid rgba(99, 102, 241, 0.4);
outline-offset: 2px; outline-offset: 1px;
border-radius: 4px; border-radius: 4px;
} }