From a3732936ac5db1954bc310ee84594330252721ca Mon Sep 17 00:00:00 2001
From: dhanabalan <dhana@example.com>
Date: Fri, 24 Oct 2025 17:37:51 +0530
Subject: [PATCH] modified capture photo method logic in ocr

---
 .../views/fields/camera-capture.blade.php     | 32 +++++++++----------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/resources/views/fields/camera-capture.blade.php b/resources/views/fields/camera-capture.blade.php
index 583bdf3..72b3227 100644
--- a/resources/views/fields/camera-capture.blade.php
+++ b/resources/views/fields/camera-capture.blade.php
@@ -328,7 +328,7 @@ function cameraCapture() {
         },
 
 
-     async capturePhoto() {
+  async capturePhoto() {
     const video = this.$refs.video;
     const canvas = this.$refs.canvas;
     const ctx = canvas.getContext('2d');
@@ -340,30 +340,30 @@ function cameraCapture() {
     const snapshot = this.$refs.snapshot;
     snapshot.src = canvas.toDataURL('image/png');
 
-    // ✅ Wait until the SNAPSHOT image loads before cropper!
     snapshot.onload = () => {
         snapshot.classList.remove('hidden');
         video.classList.add('hidden');
 
         this.photoTaken = true;
-        this.stopCamera(); // ✅ Now camera turns off immediately
+        this.stopCamera();
 
-        // ✅ Ensure previous cropper destroyed
-        if (this.cropper) {
-            this.cropper.destroy();
-        }
+        if (this.cropper) this.cropper.destroy();
 
-        // ✅ Start Cropper only after image rendered
-        this.cropper = new Cropper(snapshot, {
-            aspectRatio: NaN,
-            dragMode: 'crop',
-            viewMode: 1,
-            autoCropArea: 1,
-            background: false,
+        requestAnimationFrame(() => {
+            this.cropper = new Cropper(snapshot, {
+                aspectRatio: NaN,
+                dragMode: 'crop',
+                viewMode: 1,
+                autoCropArea: 0.9,
+                background: true,
+                responsive: true,
+                movable: true,
+                zoomable: true,
+            });
+            console.log("✅ Cropper initialized");
         });
     };
-},
-
+}
 
         //
         async uploadCroppedImage() {