From 768de394634ec3fb101e841ef3b2de4a815da9b9 Mon Sep 17 00:00:00 2001
From: Hiren Kangad <hir.012612@gmail.com>
Date: Fri, 13 Mar 2026 12:50:13 +0530
Subject: [PATCH] refboard: use full image geometry in crop mode

---
 frontend/src/canvas/CropOverlay.ts | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/frontend/src/canvas/CropOverlay.ts b/frontend/src/canvas/CropOverlay.ts
index d44e0ac..7a3e6fe 100644
--- a/frontend/src/canvas/CropOverlay.ts
+++ b/frontend/src/canvas/CropOverlay.ts
@@ -120,7 +120,7 @@ export class CropOverlay extends Container {
     if (!this._item) return;
     const item = this._item;
     const crop = { ...this._crop };
-    const data = item.data as ImageObject;
+    const data = this._getWorkingImageData();
     const viewCrop = this._getViewCrop();
     const anchorWorld = imageViewPointToWorld(data, viewCrop.x, viewCrop.y);
     const isFullImage = crop.x < 0.001 && crop.y < 0.001 && crop.w > 0.999 && crop.h > 0.999;
@@ -162,7 +162,7 @@ export class CropOverlay extends Container {
 
   private _draw(): void {
     if (!this._item) return;
-    const data = this._item.data as ImageObject;
+    const data = this._getWorkingImageData();
     const zoom = this._viewport.scale.x;
     const viewCrop = this._getViewCrop();
     const fullCorners = getImageViewRectWorldCorners(data, { x: 0, y: 0, w: 1, h: 1 });
@@ -241,7 +241,7 @@ export class CropOverlay extends Container {
     if ('preventDefault' in e.nativeEvent && typeof e.nativeEvent.preventDefault === 'function') {
       e.nativeEvent.preventDefault();
     }
-    const data = this._item.data as ImageObject;
+    const data = this._getWorkingImageData();
     const world = this._viewport.toWorld(e.global.x, e.global.y);
     const viewPoint = worldToImageViewPoint(data, world.x, world.y);
     this._drag = {
@@ -260,7 +260,7 @@ export class CropOverlay extends Container {
   private _onMoveScreen(screenX: number, screenY: number): void {
     if (!this._drag || !this._item) return;
 
-    const data = this._item.data as ImageObject;
+    const data = this._getWorkingImageData();
     const world = this._viewport.toWorld(screenX, screenY);
     const viewPoint = worldToImageViewPoint(data, world.x, world.y);
     const nx = clamp01(viewPoint.x);
@@ -389,4 +389,12 @@ export class CropOverlay extends Container {
       y: clientY - rect.top,
     };
   }
+
+  private _getWorkingImageData(): ImageObject {
+    const data = this._item!.data as ImageObject;
+    return {
+      ...data,
+      crop: undefined,
+    };
+  }
 }