Added logic in ocr for lens

resources/views/fields/camera-capture.blade.php

@@ -307,6 +307,7 @@ function cameraCapture() {
         currentFacingMode: 'user',
         photoTaken: false,
         photo1: '',
+        textDetectionInterval: null,
 
 
         async initCamera() {
@@ -318,7 +319,14 @@ function cameraCapture() {
                 });
 
                 this.$refs.video.srcObject = this.stream;
-                this.startDetection();
+                await video.play(); // ✅ ensure camera actually starts
+
+                const overlay = this.$refs.overlay;
+                overlay.width = video.videoWidth;
+                overlay.height = video.videoHeight;
+
+                setTimeout(() => this.startDetection(), 300);
+                //this.startDetection();
             } catch (err) {
                 console.error("Camera error:", err);
                 alert("Cannot access camera. Enable permissions or use HTTPS.");
@@ -498,14 +506,13 @@ function cameraCapture() {
             const overlay = this.$refs.overlay;
             const ctx = overlay.getContext("2d");
 
-            // Draw video frame to temp canvas
+            // Temp image from video
             const tempCanvas = document.createElement("canvas");
             tempCanvas.width = video.videoWidth;
             tempCanvas.height = video.videoHeight;
             const tempCtx = tempCanvas.getContext("2d");
             tempCtx.drawImage(video, 0, 0);
 
-            // OCR detection
             const { data: { words } } = await Tesseract.recognize(
                 tempCanvas.toDataURL(),
                 "eng"
@@ -513,8 +520,8 @@ function cameraCapture() {
 
             ctx.clearRect(0, 0, overlay.width, overlay.height);
 
-            ctx.strokeStyle = "red";
-            ctx.lineWidth = 2;
+            ctx.strokeStyle = "lime";
+            ctx.lineWidth = 3;
 
             words.forEach(word => {
                 if (word.bbox) {
@@ -523,12 +530,16 @@ function cameraCapture() {
                 }
             });
         },
-
+                // startDetection() {
+                //     setInterval(() => this.detectText(), 700);
+                // },
         startDetection() {
-            setInterval(() => this.detectText(), 700);
+            if (this.textDetectionInterval) {
+                clearInterval(this.textDetectionInterval);
+            }
+            this.textDetectionInterval = setInterval(() => this.detectText(), 500);
         },
 
-
         // Initialize camera and detection
         async init() {
             await this.initCamera();