scandoc-ai-components 0.0.76 → 0.0.78

package/dist/index.js

@@ -11191,7 +11191,6 @@ class ExtractorVideo {
     this.scanStartTime = null;
     this.unsupportedDocCount = 0;
     this.video = null;
-    this.updateOverlayTimeout = null;
   }
   reset() {
     this.stopVideo();
@@ -11369,6 +11368,7 @@ class ExtractorVideo {
         this.adjustOverlayPosition();
       });
       window.addEventListener('resize', () => this.adjustOverlayPosition());
+      setTimeout(() => this.adjustOverlayPosition(), 500);
       this.scanStartTime = Date.now(); // Reset timer
       setTimeout(() => this.analyzeVideoStream(), ExtractorVideo.FREQUENCY_MS);
       this.showMessage("Starting scanning");
@@ -11403,8 +11403,8 @@ class ExtractorVideo {
   }
   adjustOverlayPosition() {
     const video = this.video;
-    const overlay = document.querySelector(".desktopRectangle");
-    if (!video || !overlay || video.videoWidth === 0 || video.videoHeight === 0) return;
+    const dot = document.querySelector(".centerGuideDot");
+    if (!video || !dot || video.videoWidth === 0 || video.videoHeight === 0) return;
     const videoRatio = video.videoWidth / video.videoHeight;
     const container = video.parentElement;
     const containerRatio = container.clientWidth / container.clientHeight;
@@ -11418,10 +11418,11 @@ class ExtractorVideo {
     }
     const offsetX = (container.clientWidth - scaleWidth) / 2;
     const offsetY = (container.clientHeight - scaleHeight) / 2;
-    overlay.style.left = `${offsetX + scaleWidth * 0.05}px`;
-    overlay.style.top = `${offsetY + scaleHeight * 0.05}px`;
-    overlay.style.width = `${scaleWidth * 0.90}px`;
-    overlay.style.height = `${scaleHeight * 0.90}px`;
+    const centerX = offsetX + scaleWidth / 2;
+    const centerY = offsetY + scaleHeight / 2;
+    dot.style.display = "block";
+    dot.style.left = `${centerX - 8}px`; // center minus half dot size
+    dot.style.top = `${centerY - 8}px`;
   }
   getHTML() {
     const cfgValues = (0,_config__WEBPACK_IMPORTED_MODULE_1__.getScanDocAIConfigValues)();
@@ -11433,7 +11434,7 @@ class ExtractorVideo {
                 <div class="desktopVideoHolder">
 					<video id="ScanDocAIVideoElement" class="desktopVideo" autoPlay muted playsInline></video>
 					<div class="backgroundOverlay"></div>
-					<div class="desktopRectangle dashedRectangle"></div>
+					<div class="centerGuideDot"></div>
                 </div>
             </div>
     
@@ -11463,13 +11464,23 @@ class ExtractorVideo {
 					height: 100%;
 					object-fit: cover;
 				}
-
-                .desktopRectangle {
+				
+				.centerGuideDot {
 					position: absolute;
-					border: 5px dashed ${borderColor};
-					border-radius: 30px;
+					width: 16px;
+					height: 16px;
+					background-color: #00ff55;
+					border-radius: 50%;
+					box-shadow: 0 0 8px 2px rgba(0, 255, 100, 0.8);
+					z-index: 4;
+					animation: flicker 1s infinite;
 					pointer-events: none;
-					z-index: 3;
+					display: none; /* Hidden until video is ready */
+				}
+
+				@keyframes flicker {
+					0%, 100% { opacity: 1; }
+					50% { opacity: 0.3; }
 				}
 
                 .backgroundOverlay {

package/package.json

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