poc/pds
1
0
Fork 1
Code Issues Pull Requests 8 Actions Packages Projects Releases Wiki Activity

added logic in ocr

Browse Source
This commit is contained in:
dhanabalan
2025-10-27 11:52:54 +05:30
parent 967519a5ec
commit e332637d48
1 changed files with 36 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
resources/views/fields/camera-capture.blade.php
View File

@@ -729,7 +729,6 @@ function cameraCapture() {
<div class="flex space-x-4 mt-2"> <div class="flex space-x-4 mt-2">
<x-filament::button color="primary" @click="switchCamera">Switch Camera</x-filament::button> <x-filament::button color="primary" @click="switchCamera">Switch Camera</x-filament::button>
<x-filament::button color="primary" @click="retakePhoto" x-show="photoTaken" class="inline-flex w-auto">Retake</x-filament::button>
<x-filament::button color="success" @click="capturePhoto">Capture Photo</x-filament::button> <x-filament::button color="success" @click="capturePhoto">Capture Photo</x-filament::button>
<x-filament::button color="warning" @click="verifyPhoto">Verify</x-filament::button> <x-filament::button color="warning" @click="verifyPhoto">Verify</x-filament::button>
</div> </div>
@@ -757,49 +756,32 @@ function cameraCapture() {
capturedPhoto: null, // store captured image capturedPhoto: null, // store captured image
serialNumbers: [], serialNumbers: [],
// async initCamera() {
// try {
// if (this.stream) this.stream.getTracks().forEach(track => track.stop());
// const video = this.$refs.video;
// this.stream = await navigator.mediaDevices.getUserMedia({
// video: { facingMode: this.currentFacingMode }
// });
// video.srcObject = this.stream;
// await new Promise(resolve => video.onloadedmetadata = resolve);
// video.play();
// // Overlay size matches video
// const overlay = this.$refs.overlay;
// overlay.width = video.videoWidth;
// overlay.height = video.videoHeight;
// this.startDetection();
// } catch (err) {
// console.error("Camera error:", err);
// alert("Camera error:\n" + (err.message || err));
// this.stopDetection();
// }
// },
async initCamera() { async initCamera() {
try { try {
if (this.stream) this.stream.getTracks().forEach(track => track.stop()); if (this.stream) this.stream.getTracks().forEach(track => track.stop());
const video = this.$refs.video;
this.stream = await navigator.mediaDevices.getUserMedia({ this.stream = await navigator.mediaDevices.getUserMedia({
video: { facingMode: this.currentFacingMode } video: { facingMode: this.currentFacingMode }
}); });
this.$refs.video.srcObject = this.stream; video.srcObject = this.stream;
await new Promise(resolve => video.onloadedmetadata = resolve);
video.play();
// Overlay size matches video
const overlay = this.$refs.overlay;
overlay.width = video.videoWidth;
overlay.height = video.videoHeight;
this.startDetection(); this.startDetection();
} catch (err) { } catch (err) {
console.error("Camera error:", err); console.error("Camera error:", err);
alert("Cannot access camera. Enable permissions or use HTTPS."); alert("Camera error:\n" + (err.message || err));
this.stopDetection();
} }
}, },
async switchCamera() { async switchCamera() {
this.currentFacingMode = this.currentFacingMode === 'user' ? 'environment' : 'user'; this.currentFacingMode = this.currentFacingMode === 'user' ? 'environment' : 'user';
await this.initCamera(); await this.initCamera();
@@ -840,30 +822,36 @@ function cameraCapture() {
// this.stopDetection(); // this.stopDetection();
// }, // },
capturePhoto() {
const video = this.$refs.video;
const canvas = this.$refs.canvas;
const snapshot = this.$refs.snapshot;
const context = canvas.getContext('2d');
canvas.width = video.videoWidth; async capturePhoto() {
canvas.height = video.videoHeight; const video = this.$refs.video;
const canvas = this.$refs.canvas;
const overlay = this.$refs.overlay;
const snapshot = this.$refs.snapshot; // ✅ Fix: define snapshot reference
const ctx = canvas.getContext('2d');
context.drawImage(video, 0, 0, canvas.width, canvas.height); canvas.width = video.videoWidth;
canvas.height = video.videoHeight;
ctx.drawImage(video, 0, 0);
//const dataUrl = canvas.toDataURL('image/png'); const snapshotData = canvas.toDataURL('image/png'); // ✅ Correct data var
const dataUrl = canvas.toDataURL('image/jpeg', 0.95); this.$refs.hiddenInput.value = snapshotData;
this.capturedPhoto = snapshotData;
if (this.stream) this.stream.getTracks().forEach(track => track.stop()); // ✅ Stop camera
if (this.stream) this.stream.getTracks().forEach(track => track.stop());
snapshot.src = dataUrl; // ✅ Hide video + overlay
snapshot.classList.remove('hidden'); video.classList.add('hidden');
video.classList.add('hidden'); overlay.classList.add('hidden');
this.photoTaken = true;
this.$refs.hiddenInput.value = dataUrl; // ✅ Show captured image
console.log('Captured Image:', dataUrl); snapshot.src = snapshotData; // ✅ Correct variable
}, snapshot.classList.remove('hidden');
alert("Photo captured!");
this.stopDetection();
},
async verifyPhoto() { async verifyPhoto() {
if (!this.capturedPhoto) { if (!this.capturedPhoto) {
@@ -933,14 +921,6 @@ function cameraCapture() {
} }
}, },
async retakePhoto() {
this.photoTaken = false;
this.$refs.snapshot.classList.add('hidden');
this.$refs.video.classList.remove('hidden');
await this.initCamera();
},
startDetection() { startDetection() {
if (this.textDetectionInterval) clearInterval(this.textDetectionInterval); if (this.textDetectionInterval) clearInterval(this.textDetectionInterval);
this.textDetectionInterval = setInterval(() => this.detectText(), 1000); this.textDetectionInterval = setInterval(() => this.detectText(), 1000);