Fix mouse handling outside viewport while dragging

Nahara-OSS · Oct 4, 2024 · 515b18e · 515b18e
1 parent bc78c48
commit 515b18e
Showing 1 changed file with 3 additions and 2 deletions.
diff --git a/nahara-motion-ui/src/ui/viewport/ViewportPane.svelte b/nahara-motion-ui/src/ui/viewport/ViewportPane.svelte
@@ -197,13 +197,14 @@
     let adjusted = false;
 
     function mapMousePositionFromEvent(e: MouseEvent, scene: IScene) {
+        const { left, top } = canvas.getBoundingClientRect();
         const sceneWidth = scene.metadata.size.x;
         const sceneHeight = scene.metadata.size.y;
         const sceneRatio = sceneWidth / sceneHeight;
         const viewportRatio = canvas.width / canvas.height;
         const vpScale = sceneRatio > viewportRatio ? canvas.width / sceneWidth : canvas.height / sceneHeight;
-        const sx = (e.offsetX * devicePixelRatio - (canvas.width - sceneWidth * vpScale) / 2) / vpScale;
-        const sy = (e.offsetY * devicePixelRatio - (canvas.height - sceneHeight * vpScale) / 2) / vpScale;
+        const sx = ((e.clientX - left) * devicePixelRatio - (canvas.width - sceneWidth * vpScale) / 2) / vpScale;
+        const sy = ((e.clientY - top) * devicePixelRatio - (canvas.height - sceneHeight * vpScale) / 2) / vpScale;
         const sdx = e.movementX * devicePixelRatio / vpScale;
         const sdy = e.movementY * devicePixelRatio / vpScale;