Zoom-reset ankret til viewport-sentrum

Reset til 100% justerer kameraposisjon slik at det du ser i
midten forblir i midten. Gjelder dobbeltklikk og toolbar-knapp.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
vegard 2026-03-20 03:08:51 +00:00
parent c1a69feede
commit 8675ba0b5d

View file

@ -426,6 +426,18 @@
}; };
} }
// --- Reset zoom (ankret til viewport-sentrum) ---
function resetZoom() {
const cx = viewport.width / 2;
const cy = viewport.height / 2;
const scale = 1.0 / camera.zoom;
camera = {
x: cx - scale * (cx - camera.x),
y: cy - scale * (cy - camera.y),
zoom: 1.0,
};
}
// --- Fullscreen --- // --- Fullscreen ---
function toggleFullscreen() { function toggleFullscreen() {
isFullscreen = !isFullscreen; isFullscreen = !isFullscreen;
@ -478,7 +490,7 @@
ondblclick={(e) => { ondblclick={(e) => {
if (!(e.target as HTMLElement).closest('[data-canvas-object-id]') && if (!(e.target as HTMLElement).closest('[data-canvas-object-id]') &&
!(e.target as HTMLElement).closest('.canvas-toolbar')) { !(e.target as HTMLElement).closest('.canvas-toolbar')) {
camera = { ...camera, zoom: 1.0 }; resetZoom();
} }
}} }}
ontouchstart={handleTouchStart} ontouchstart={handleTouchStart}
@ -496,7 +508,7 @@
title="Zoom ut (15%)" title="Zoom ut (15%)"
aria-label="Zoom ut" aria-label="Zoom ut"
></button> ></button>
<button class="canvas-toolbar-zoom" onclick={() => { camera = { ...camera, zoom: 1.0 }; }} title="Tilbakestill til 100%">{Math.round(camera.zoom * 100)}%</button> <button class="canvas-toolbar-zoom" onclick={() => { resetZoom(); }} title="Tilbakestill til 100%">{Math.round(camera.zoom * 100)}%</button>
<button <button
class="canvas-toolbar-btn" class="canvas-toolbar-btn"
onclick={() => zoomStep(0.15)} onclick={() => zoomStep(0.15)}