chnaged logic in ocr for capturing image in high quality
This commit is contained in:
@@ -41,17 +41,43 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
|
||||
|
||||
|
||||
<div x-data="cameraCapture()" x-init="initCamera()" class="space-y-2" wire:ignore class="space-y-2">
|
||||
{{-- <div x-data="cameraCapture()" x-init="initCamera()" class="space-y-2" wire:ignore class="space-y-2">
|
||||
<video x-ref="video" width="320" height="240" autoplay playsinline class="border rounded"></video>
|
||||
<canvas x-ref="canvas" width="320" height="240" class="hidden"></canvas>
|
||||
<img x-ref="snapshot" class="hidden border rounded max-w-full"> --}}
|
||||
|
||||
<div x-data="cameraCapture()" x-init="initCamera()" wire:ignore class="space-y-2">
|
||||
<video
|
||||
x-ref="video"
|
||||
autoplay
|
||||
playsinline
|
||||
class="border rounded w-80 h-auto"
|
||||
></video>
|
||||
|
||||
<!-- no need to fix width/height here either -->
|
||||
<canvas x-ref="canvas" class="hidden"></canvas>
|
||||
|
||||
<img x-ref="snapshot" class="hidden border rounded max-w-full">
|
||||
|
||||
<div class="flex space-x-2 mt-2">
|
||||
|
||||
{{--
|
||||
<div class="flex space-x-8 mt-2">
|
||||
<x-filament::button color="primary" @click="capturePhoto" x-show="!photoTaken">Capture</x-filament::button>
|
||||
<x-filament::button color="primary" @click="retakePhoto" x-show="photoTaken">Retake</x-filament::button>
|
||||
<x-filament::button color="primary" @click="switchCamera" x-show="!photoTaken">Switch Camera</x-filament::button>
|
||||
<x-filament::button color="primary" @click="verify" x-show="photoTaken">Verify</x-filament::button>
|
||||
</div>
|
||||
</div> --}}
|
||||
<div class="flex space-x-2 mt-2">
|
||||
<x-filament::button color="primary" @click="capturePhoto" x-show="!photoTaken" class="inline-flex w-auto">Capture</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="primary" @click="switchCamera" x-show="!photoTaken" class="inline-flex w-auto">Switch Camera</x-filament::button>
|
||||
<x-filament::button color="primary" @click="verify" x-show="photoTaken" class="inline-flex w-auto">Verify</x-filament::button>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
{{-- <input type="hidden" name="{{ $getName() }}" x-ref="hiddenInput"> --}}
|
||||
{{-- <input type="hidden" x-ref="hiddenInput" name="camera_capture"> --}}
|
||||
@@ -185,8 +211,13 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
const snapshot = this.$refs.snapshot;
|
||||
const context = canvas.getContext('2d');
|
||||
|
||||
canvas.width = video.videoWidth;
|
||||
canvas.height = video.videoHeight;
|
||||
|
||||
context.drawImage(video, 0, 0, canvas.width, canvas.height);
|
||||
const dataUrl = canvas.toDataURL('image/png');
|
||||
|
||||
//const dataUrl = canvas.toDataURL('image/png');
|
||||
const dataUrl = canvas.toDataURL('image/png', 1.0);
|
||||
|
||||
if (this.stream) this.stream.getTracks().forEach(track => track.stop());
|
||||
|
||||
@@ -230,9 +261,6 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user