scandoc-ai-components 0.0.62 → 0.0.64

package/dist/index.js

@@ -11191,6 +11191,7 @@ class ExtractorVideo {
     this.scanStartTime = null;
     this.unsupportedDocCount = 0;
     this.video = null;
+    this.updateOverlayTimeout = null;
   }
   reset() {
     this.stopVideo();
@@ -11245,6 +11246,17 @@ class ExtractorVideo {
       bottomPct: bottom / canvas.height
     };
   }
+  updateRectangleOverlay = async () => {
+    const margins = await this.getCameraMargins();
+    const rectangle = document.querySelector('.desktopRectangle');
+    if (!rectangle) return;
+    const clamp = (v, max = 0.25) => Math.min(v, max) * 100;
+    const buffer = 0.03;
+    rectangle.style.top = `${clamp(margins.topPct + buffer)}%`;
+    rectangle.style.bottom = `${clamp(margins.bottomPct + buffer)}%`;
+    rectangle.style.left = `${clamp(margins.leftPct + buffer)}%`;
+    rectangle.style.right = `${clamp(margins.rightPct + buffer)}%`;
+  };
   async analyzeVideoStream() {
     if (!this.isRunning) {
       return;
@@ -11405,17 +11417,16 @@ class ExtractorVideo {
       await this.video.play().catch(e => {
         console.warn(`Error on video play: ${e}`);
       });
-      setTimeout(async () => {
-        const margins = await this.getCameraMargins();
-        const rectangle = document.querySelector('.desktopRectangle');
-        if (rectangle) {
-          rectangle.style.top = `${margins.topPct * 100}%`;
-          rectangle.style.bottom = `${margins.bottomPct * 100}%`;
-          rectangle.style.left = `${margins.leftPct * 100}%`;
-          rectangle.style.right = `${margins.rightPct * 100}%`;
-        }
-      }, 500); // Give time for video frame to show			  
-
+      this.video.onloadedmetadata = () => {
+        this.updateRectangleOverlay();
+      };
+      setTimeout(() => this.updateRectangleOverlay(), 500);
+      const scheduleOverlayUpdate = (delay = 500) => {
+        clearTimeout(this.updateOverlayTimeout);
+        this.updateOverlayTimeout = setTimeout(() => this.updateRectangleOverlay(), delay);
+      };
+      window.addEventListener("resize", () => scheduleOverlayUpdate());
+      window.addEventListener("orientationchange", () => scheduleOverlayUpdate(700));
       this.scanStartTime = Date.now(); // Reset timer
       setTimeout(() => this.analyzeVideoStream(), ExtractorVideo.FREQUENCY_MS);
       this.showMessage("Starting scanning");

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "scandoc-ai-components",
   "author": "ScanDoc-AI",
-  "version": "0.0.62",
+  "version": "0.0.64",
   "private": false,
   "description": "Pure JavaScript package for integrating ScanDoc-AI services.",
   "keywords": [