@ekyc_qoobiss/qbs-ect-cmp 4.7.21 → 4.7.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -21,7 +21,7 @@ export class IdAutoCapture {
21
21
  this.opencvReady = true;
22
22
  console.log('OpenCV.js loaded. Ready to start detection.');
23
23
  await this.getMedia(); // Get camera media once OpenCV is ready
24
- this.handleStartDetection(); // Start processing video frames
24
+ await this.handleStartDetection(); // Start processing video frames
25
25
  };
26
26
  // Method to start video recording
27
27
  this.startRecording = () => {
@@ -178,7 +178,7 @@ export class IdAutoCapture {
178
178
  }
179
179
  };
180
180
  // Handler for starting the ID detection process
181
- this.handleStartDetection = () => {
181
+ this.handleStartDetection = async () => {
182
182
  if (!this.mediaStream) {
183
183
  console.log('Camera not ready. Please allow camera access.');
184
184
  return;
@@ -193,6 +193,18 @@ export class IdAutoCapture {
193
193
  this.recordedChunks = []; // Clear previous video chunks
194
194
  this.recordedVideoUrl = null; // Clear previous video URL
195
195
  this.startRecording();
196
+ if (this.videoElement && this.videoElement.readyState < 3) {
197
+ // Use readyState 3 (HAVE_FUTURE_DATA) or 4 (HAVE_ENOUGH_DATA) for more robust readiness
198
+ console.log('Waiting for video stream to fully load...');
199
+ await new Promise(resolve => {
200
+ const onCanPlayThrough = () => {
201
+ this.videoElement.removeEventListener('canplaythrough', onCanPlayThrough);
202
+ resolve();
203
+ };
204
+ this.videoElement.addEventListener('canplaythrough', onCanPlayThrough);
205
+ });
206
+ console.log('Video stream ready. Starting detection.');
207
+ }
196
208
  this.startFrameProcessing(); // Start the OpenCV frame processing loop
197
209
  };
198
210
  this.verified = false;
@@ -266,7 +278,7 @@ export class IdAutoCapture {
266
278
  if (store.device.isDesktop) {
267
279
  cameraVideoClass = 'cameraVideoSelfieDesk';
268
280
  }
269
- return (h("div", { key: '239110026f2b86b4d21a04571130d29d402f273b', class: "container flex center" }, h("div", { key: 'd3c882b832b541ac902f01ecd7a79c23e2b22eb1', class: "px-2 w-100" }, h("h1", { key: '38452a0b19aa389e83f1a0010d869c9f41cb20e1', class: this.titleStyle, innerHTML: this.titleMesage }), h("div", { key: '5f846e0c702d388cc04e3fc305d194bbcae78fdc', hidden: this.verified }, h("div", { key: '0201a63cd53a9c7299422486174413f6a15553f0', class: "w-100 h-100 rounded" }, h("div", { key: '67f8c00e0ede3cc836f57deb8a15449bc15538e8', class: "camera rounded" }, h("video", { key: 'bd20436cc64cd7e0da4b3aee7909906563ae1ce7', id: "video", loop: true, autoplay: true, playsinline: true, muted: true, class: cameraVideoClass, ref: el => (this.videoElement = el) }), h("canvas", { key: '9d2910bcc563d1a6df51ad4304efed898f89c4fa', id: "output", ref: el => (this.canvasElement = el), style: { display: 'none' } }), h("canvas", { key: '44df5c5e8da34e233deb782443d472536f65b2e7', id: "processingCanvasElement", ref: el => (this.processingCanvasElement = el), style: { display: 'none' } }), h("div", { key: '2a35a0c7778e62b36095d56bc715d612ca17c752', class: "id-guide-rectangle" }), this.isCapturing && h("div", { key: 'b28c98ed3da1dcf8902f42df3f5758aec5cc8b82', class: "capture-flash-overlay" }), this.countdown > 0 && (h("div", { key: 'eafcaa2fb46ba675fd4a600318dd5fe7ba95641e', class: "absolute inset-0 bg-black bg-opacity-50 flex items-center justify-center" }, h("span", { key: '6df1640462fb3cd6eb4b17f8feb011d7bdeb35f4', class: "text-white text-9xl font-bold animate-bounce" }, this.countdown)))))), h("div", { key: '09ad24e2c403c44db82d2790a39311d1c9120031', class: "footer text-center" }, h("img", { key: '6532d116449468609ac82fb2b7ab429f074a3069', src: logoOntrace })))));
281
+ return (h("div", { key: '4bb0f88b1af2b60c0340d193e5b55b20216959f4', class: "container flex center" }, h("div", { key: '91edb8cd88cc514d356f6dbc33d42a0fd4c59403', class: "px-2 w-100" }, h("h1", { key: 'ddfd52905a3f4e57140a77eead1019d0a5f8fd8d', class: this.titleStyle, innerHTML: this.titleMesage }), h("div", { key: '11a1eba365aa8cac67127daf11c8773c9ebb18d7', hidden: this.verified }, h("div", { key: '710dbd4a39607139ef8f9b9bfaa6e8a753e7cb84', class: "w-100 h-100 rounded" }, h("div", { key: 'b48ac855f6ea3c2244160bc8c2c0ed76c0eaaea0', class: "camera rounded" }, h("video", { key: '688fa43c1a703449cafae6b1039768dc271b65aa', id: "video", loop: true, autoplay: true, playsinline: true, muted: true, class: cameraVideoClass, ref: el => (this.videoElement = el) }), h("canvas", { key: 'ed924ec293a47f69a1a61d3b3d5e745e92a5419b', id: "output", ref: el => (this.canvasElement = el), style: { display: 'none' } }), h("canvas", { key: 'f6807b2574c3e981f915228b45af3f8bd7ee5c9d', id: "processingCanvasElement", ref: el => (this.processingCanvasElement = el), style: { display: 'none' } }), h("div", { key: '812da2b6ad46757f8af703ec236996019f40480d', class: "id-guide-rectangle" }), this.isCapturing && h("div", { key: 'aa58dc533dac04f7917c2dba9626ff2213a298bc', class: "capture-flash-overlay" }), this.countdown > 0 && (h("div", { key: 'f0a3e788cc150037b2a9540f4656ba733f276bd5', class: "absolute inset-0 bg-black bg-opacity-50 flex items-center justify-center" }, h("span", { key: '8c22c9ef5dd0763cc6b0fb967e25759ca6a0f8f0', class: "text-white text-9xl font-bold animate-bounce" }, this.countdown)))))), h("div", { key: '0b7ee521152325ef637809a009a5ad719ed4286e', class: "footer text-center" }, h("img", { key: 'bbd817f0b9460e4be2121501a1b87e8bbc15831a', src: logoOntrace })))));
270
282
  }
271
283
  static get is() { return "id-auto-capture"; }
272
284
  static get originalStyleUrls() {
@@ -1 +1 @@
1
- {"version":3,"file":"id-auto-capture.js","sourceRoot":"","sources":["../../../../../src/components/common/id-auto-capture/id-auto-capture.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Element, Event, EventEmitter, State } from '@stencil/core';\r\n\r\nimport logoOntrace from '../../../assets/logo-ontrace.svg';\r\nimport store from '../../../helpers/store';\r\nimport { Cameras } from '../../../helpers/Cameras';\r\nimport { Browser, MobileOS } from '../../../models/IDevice';\r\n\r\ndeclare const cv: any;\r\n\r\n@Component({\r\n tag: 'id-auto-capture',\r\n styleUrl: 'id-auto-capture.css',\r\n shadow: false,\r\n})\r\nexport class IdAutoCapture {\r\n @Element() el: HTMLElement;\r\n private videoElement: HTMLVideoElement;\r\n private canvasElement: HTMLCanvasElement;\r\n private processingCanvasElement: HTMLCanvasElement; // For OpenCV frame processing\r\n private mediaRecorder: MediaRecorder | null = null;\r\n private mediaStream: MediaStream | null = null;\r\n private animationFrameId: number | null = null; // To manage requestAnimationFrame\r\n private opencvScriptElement: HTMLScriptElement | null = null;\r\n\r\n @State() private verified: boolean;\r\n @State() private titleMesage: string;\r\n @State() private titleStyle: string;\r\n @State() recordedChunks: Blob[] = [];\r\n @State() countdown: number = 0;\r\n @State() capturedImage: string | null = null;\r\n @State() isRecording: boolean = false;\r\n @State() recordedVideoUrl: string | null = null;\r\n @State() isDetecting: boolean = false;\r\n @State() opencvReady: boolean = false;\r\n @State() isCapturing: boolean = false;\r\n\r\n @Event({\r\n eventName: 'photoIdCapture',\r\n })\r\n eventPhotoCapture: EventEmitter;\r\n\r\n @Event({\r\n eventName: 'recordingIdCapture',\r\n })\r\n eventRecordingIdReady: EventEmitter;\r\n\r\n constructor() {\r\n this.verified = false;\r\n }\r\n\r\n // Lifecycle method: Called once after the component is first connected to the DOM\r\n async componentWillLoad() {\r\n // Initialize DOM element references after the component's render method\r\n // has placed them in the DOM. This should ideally be done in componentDidLoad\r\n // but can be set up to ensure elements are available for setup.\r\n }\r\n\r\n // Lifecycle method: Called once after the component has loaded and rendered\r\n async componentDidLoad() {\r\n console.log('Loading OpenCV.js...');\r\n this.loadOpenCVScript();\r\n\r\n // Listen for the custom event dispatched by global.ts (ensures global.ts sets up window.Module)\r\n document.addEventListener('opencv:ready', this.handleOpencvReady);\r\n\r\n // Initial check in case opencv.js loads very fast and event was already dispatched\r\n if (typeof cv !== 'undefined' && cv.Mat) {\r\n this.handleOpencvReady();\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n if (this.mediaStream) {\r\n this.mediaStream.getTracks().forEach(track => track.stop());\r\n }\r\n if (this.animationFrameId !== null) {\r\n cancelAnimationFrame(this.animationFrameId);\r\n this.animationFrameId = null;\r\n }\r\n if (this.recordedVideoUrl) {\r\n URL.revokeObjectURL(this.recordedVideoUrl);\r\n }\r\n document.removeEventListener('opencv:ready', this.handleOpencvReady);\r\n\r\n // NEW: Clean up the dynamically added script element\r\n if (this.opencvScriptElement && this.opencvScriptElement.parentNode) {\r\n this.opencvScriptElement.parentNode.removeChild(this.opencvScriptElement);\r\n this.opencvScriptElement = null;\r\n }\r\n }\r\n\r\n private loadOpenCVScript() {\r\n if (!this.opencvScriptElement) {\r\n // Only load if not already loaded\r\n this.opencvScriptElement = document.createElement('script');\r\n this.opencvScriptElement.type = 'text/javascript';\r\n this.opencvScriptElement.async = true;\r\n this.opencvScriptElement.src = 'https://docs.opencv.org/4.x/opencv.js';\r\n document.body.appendChild(this.opencvScriptElement); // Append to body or head\r\n console.log('Dynamically loaded opencv.js');\r\n }\r\n }\r\n\r\n private handleOpencvReady = async () => {\r\n this.opencvReady = true;\r\n console.log('OpenCV.js loaded. Ready to start detection.');\r\n await this.getMedia(); // Get camera media once OpenCV is ready\r\n this.handleStartDetection(); // Start processing video frames\r\n };\r\n\r\n // Method to get user media (camera stream)\r\n private async getMedia() {\r\n try {\r\n if (!store.cameraId) {\r\n await Cameras.InitCameras(store.device);\r\n }\r\n const constraints = Cameras.GetConstraints(store.cameraId, store.device);\r\n\r\n const mediaStream = await navigator.mediaDevices.getUserMedia(constraints);\r\n if (this.videoElement) {\r\n this.videoElement.srcObject = mediaStream;\r\n this.videoElement.play();\r\n }\r\n this.mediaStream = mediaStream;\r\n } catch (err) {\r\n console.error('Error accessing camera:', err);\r\n }\r\n }\r\n\r\n // Method to start video recording\r\n private startRecording = () => {\r\n if (this.mediaStream && this.videoElement) {\r\n this.recordedChunks = []; // Clear previous chunks\r\n\r\n var options = { mimeType: Cameras.webmMimeType.mime, videoBitsPerSecond: 1300000 };\r\n\r\n if (!MediaRecorder.isTypeSupported(options.mimeType)) {\r\n if (store.device.mobileOS == MobileOS.iOS || store.device.browser == Browser.Safari) options.mimeType = Cameras.mp4MimeType.mime;\r\n }\r\n\r\n this.mediaRecorder = new MediaRecorder(this.mediaStream, { mimeType: 'video/webm' });\r\n\r\n this.mediaRecorder.ondataavailable = ({ data }) => {\r\n if (data.size > 0) {\r\n this.recordedChunks = [...this.recordedChunks, data];\r\n }\r\n };\r\n\r\n this.mediaRecorder.onstop = () => {\r\n if (this.recordedChunks.length > 0) {\r\n const blob = new Blob(this.recordedChunks, { type: 'video/webm' });\r\n this.recordedVideoUrl = URL.createObjectURL(blob);\r\n }\r\n };\r\n\r\n this.mediaRecorder.start();\r\n this.isRecording = true;\r\n console.log('Recording started...');\r\n }\r\n };\r\n\r\n // Method to stop video recording\r\n private stopRecording = () => {\r\n if (this.mediaRecorder && this.mediaRecorder.state === 'recording') {\r\n this.mediaRecorder.stop();\r\n this.isRecording = false;\r\n console.log('Recording stopped.');\r\n this.eventRecordingIdReady.emit(this.recordedVideoUrl);\r\n }\r\n };\r\n\r\n // Method to capture an image from the video stream\r\n private capture = () => {\r\n if (this.videoElement && this.canvasElement) {\r\n const video = this.videoElement;\r\n const canvas = this.canvasElement;\r\n const context = canvas.getContext('2d');\r\n\r\n canvas.width = video.videoWidth;\r\n canvas.height = video.videoHeight;\r\n\r\n context.drawImage(video, 0, 0, canvas.width, canvas.height);\r\n\r\n this.capturedImage = canvas.toDataURL('image/png');\r\n console.log('Image captured!');\r\n this.verified = true;\r\n\r\n this.isCapturing = true;\r\n setTimeout(() => {\r\n this.isCapturing = false;\r\n }, 200); // Flash for 200ms\r\n\r\n this.eventPhotoCapture.emit(this.capturedImage);\r\n }\r\n };\r\n\r\n // Method for continuous video frame processing with OpenCV\r\n private processVideoFrame = () => {\r\n if (this.videoElement && this.processingCanvasElement && this.opencvReady && this.isDetecting) {\r\n const video = this.videoElement;\r\n const processingCanvas = this.processingCanvasElement;\r\n const context = processingCanvas.getContext('2d');\r\n\r\n processingCanvas.width = video.videoWidth;\r\n processingCanvas.height = video.videoHeight;\r\n\r\n context.drawImage(video, 0, 0, processingCanvas.width, processingCanvas.height);\r\n\r\n const imageData = context.getImageData(0, 0, processingCanvas.width, processingCanvas.height);\r\n\r\n // --- OpenCV.js processing starts here ---\r\n let src = cv.matFromImageData(imageData);\r\n let gray = new cv.Mat();\r\n let blurred = new cv.Mat();\r\n let edges = new cv.Mat();\r\n let contours = new cv.MatVector();\r\n let hierarchy = new cv.Mat();\r\n\r\n try {\r\n cv.cvtColor(src, gray, cv.COLOR_RGBA2GRAY, 0);\r\n cv.GaussianBlur(gray, blurred, new cv.Size(5, 5), 0, 0, cv.BORDER_DEFAULT);\r\n cv.Canny(blurred, edges, 75, 200, 3, false);\r\n cv.findContours(edges, contours, hierarchy, cv.RETR_EXTERNAL, cv.CHAIN_APPROX_SIMPLE);\r\n\r\n let idDetected = false;\r\n let maxArea = 0;\r\n //let bestRect = null;\r\n\r\n for (let i = 0; i < contours.size(); ++i) {\r\n let contour = contours.get(i);\r\n let area = cv.contourArea(contour);\r\n\r\n if (area > 1000 && area > maxArea) {\r\n let peri = cv.arcLength(contour, true);\r\n let approx = new cv.Mat();\r\n cv.approxPolyDP(contour, approx, 0.02 * peri, true);\r\n\r\n if (approx.rows === 4) {\r\n let rect = cv.boundingRect(approx);\r\n const aspectRatio = rect.width / rect.height;\r\n\r\n if (aspectRatio > 1.4 && aspectRatio < 1.8) {\r\n if (rect.width > video.videoWidth * 0.3 && rect.height > video.videoHeight * 0.3) {\r\n idDetected = true;\r\n maxArea = area;\r\n //bestRect = rect;\r\n }\r\n }\r\n }\r\n approx.delete();\r\n }\r\n contour.delete();\r\n }\r\n\r\n if (idDetected) {\r\n console.log('ID document detected! Starting countdown...');\r\n this.countdown = 3;\r\n if (this.animationFrameId !== null) {\r\n cancelAnimationFrame(this.animationFrameId); // Stop continuous frame processing\r\n this.animationFrameId = null;\r\n }\r\n\r\n const timer = setInterval(() => {\r\n this.countdown--;\r\n if (this.countdown <= 0) {\r\n clearInterval(timer);\r\n this.capture();\r\n this.stopRecording();\r\n this.isDetecting = false;\r\n console.log('Picture taken. You can now stop recording.');\r\n this.countdown = 0; // Ensure countdown is 0\r\n }\r\n }, 1000);\r\n }\r\n } catch (error) {\r\n console.error('OpenCV processing error:', error);\r\n this.isDetecting = false; // Stop detection on error\r\n if (this.animationFrameId !== null) {\r\n cancelAnimationFrame(this.animationFrameId);\r\n this.animationFrameId = null;\r\n }\r\n } finally {\r\n // Crucial: Release memory allocated by OpenCV Mat objects\r\n src.delete();\r\n gray.delete();\r\n blurred.delete();\r\n edges.delete();\r\n contours.delete();\r\n hierarchy.delete();\r\n }\r\n // --- OpenCV.js processing ends here ---\r\n }\r\n\r\n if (this.isDetecting && this.animationFrameId !== null) {\r\n // Ensure loop continues only if still detecting\r\n this.animationFrameId = requestAnimationFrame(this.processVideoFrame);\r\n }\r\n };\r\n\r\n // Method to start the OpenCV frame processing loop\r\n private startFrameProcessing = () => {\r\n if (this.opencvReady && this.videoElement && this.videoElement.readyState >= 2) {\r\n if (this.animationFrameId === null) {\r\n // Only start if not already running\r\n this.animationFrameId = requestAnimationFrame(this.processVideoFrame);\r\n }\r\n }\r\n };\r\n\r\n // Handler for starting the ID detection process\r\n private handleStartDetection = () => {\r\n if (!this.mediaStream) {\r\n console.log('Camera not ready. Please allow camera access.');\r\n return;\r\n }\r\n if (!this.opencvReady) {\r\n console.log('OpenCV.js is not loaded yet. Please wait.');\r\n return;\r\n }\r\n\r\n console.log('Starting ID detection...');\r\n this.isDetecting = true;\r\n this.capturedImage = null; // Clear previous image\r\n this.recordedChunks = []; // Clear previous video chunks\r\n this.recordedVideoUrl = null; // Clear previous video URL\r\n\r\n this.startRecording();\r\n this.startFrameProcessing(); // Start the OpenCV frame processing loop\r\n };\r\n\r\n render() {\r\n let cameraVideoClass = 'cameraVideo';\r\n\r\n if (store.device.isDesktop) {\r\n cameraVideoClass = 'cameraVideoSelfieDesk';\r\n }\r\n\r\n return (\r\n <div class=\"container flex center\">\r\n <div class=\"px-2 w-100\">\r\n <h1 class={this.titleStyle} innerHTML={this.titleMesage}></h1>\r\n\r\n <div hidden={this.verified}>\r\n <div class=\"w-100 h-100 rounded\">\r\n <div class=\"camera rounded\">\r\n <video id=\"video\" loop autoplay playsinline muted class={cameraVideoClass} ref={el => (this.videoElement = el)} />\r\n <canvas id=\"output\" ref={el => (this.canvasElement = el)} style={{ display: 'none' }} />\r\n <canvas id=\"processingCanvasElement\" ref={el => (this.processingCanvasElement = el)} style={{ display: 'none' }} />\r\n <div class=\"id-guide-rectangle\"></div>\r\n {this.isCapturing && <div class=\"capture-flash-overlay\"></div>}\r\n {this.countdown > 0 && (\r\n <div class=\"absolute inset-0 bg-black bg-opacity-50 flex items-center justify-center\">\r\n <span class=\"text-white text-9xl font-bold animate-bounce\">{this.countdown}</span>\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"footer text-center\">\r\n <img src={logoOntrace}></img>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
1
+ {"version":3,"file":"id-auto-capture.js","sourceRoot":"","sources":["../../../../../src/components/common/id-auto-capture/id-auto-capture.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Element, Event, EventEmitter, State } from '@stencil/core';\r\n\r\nimport logoOntrace from '../../../assets/logo-ontrace.svg';\r\nimport store from '../../../helpers/store';\r\nimport { Cameras } from '../../../helpers/Cameras';\r\nimport { Browser, MobileOS } from '../../../models/IDevice';\r\n\r\ndeclare const cv: any;\r\n\r\n@Component({\r\n tag: 'id-auto-capture',\r\n styleUrl: 'id-auto-capture.css',\r\n shadow: false,\r\n})\r\nexport class IdAutoCapture {\r\n @Element() el: HTMLElement;\r\n private videoElement: HTMLVideoElement;\r\n private canvasElement: HTMLCanvasElement;\r\n private processingCanvasElement: HTMLCanvasElement; // For OpenCV frame processing\r\n private mediaRecorder: MediaRecorder | null = null;\r\n private mediaStream: MediaStream | null = null;\r\n private animationFrameId: number | null = null; // To manage requestAnimationFrame\r\n private opencvScriptElement: HTMLScriptElement | null = null;\r\n\r\n @State() private verified: boolean;\r\n @State() private titleMesage: string;\r\n @State() private titleStyle: string;\r\n @State() recordedChunks: Blob[] = [];\r\n @State() countdown: number = 0;\r\n @State() capturedImage: string | null = null;\r\n @State() isRecording: boolean = false;\r\n @State() recordedVideoUrl: string | null = null;\r\n @State() isDetecting: boolean = false;\r\n @State() opencvReady: boolean = false;\r\n @State() isCapturing: boolean = false;\r\n\r\n @Event({\r\n eventName: 'photoIdCapture',\r\n })\r\n eventPhotoCapture: EventEmitter;\r\n\r\n @Event({\r\n eventName: 'recordingIdCapture',\r\n })\r\n eventRecordingIdReady: EventEmitter;\r\n\r\n constructor() {\r\n this.verified = false;\r\n }\r\n\r\n // Lifecycle method: Called once after the component is first connected to the DOM\r\n async componentWillLoad() {\r\n // Initialize DOM element references after the component's render method\r\n // has placed them in the DOM. This should ideally be done in componentDidLoad\r\n // but can be set up to ensure elements are available for setup.\r\n }\r\n\r\n // Lifecycle method: Called once after the component has loaded and rendered\r\n async componentDidLoad() {\r\n console.log('Loading OpenCV.js...');\r\n this.loadOpenCVScript();\r\n\r\n // Listen for the custom event dispatched by global.ts (ensures global.ts sets up window.Module)\r\n document.addEventListener('opencv:ready', this.handleOpencvReady);\r\n\r\n // Initial check in case opencv.js loads very fast and event was already dispatched\r\n if (typeof cv !== 'undefined' && cv.Mat) {\r\n this.handleOpencvReady();\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n if (this.mediaStream) {\r\n this.mediaStream.getTracks().forEach(track => track.stop());\r\n }\r\n if (this.animationFrameId !== null) {\r\n cancelAnimationFrame(this.animationFrameId);\r\n this.animationFrameId = null;\r\n }\r\n if (this.recordedVideoUrl) {\r\n URL.revokeObjectURL(this.recordedVideoUrl);\r\n }\r\n document.removeEventListener('opencv:ready', this.handleOpencvReady);\r\n\r\n // NEW: Clean up the dynamically added script element\r\n if (this.opencvScriptElement && this.opencvScriptElement.parentNode) {\r\n this.opencvScriptElement.parentNode.removeChild(this.opencvScriptElement);\r\n this.opencvScriptElement = null;\r\n }\r\n }\r\n\r\n private loadOpenCVScript() {\r\n if (!this.opencvScriptElement) {\r\n // Only load if not already loaded\r\n this.opencvScriptElement = document.createElement('script');\r\n this.opencvScriptElement.type = 'text/javascript';\r\n this.opencvScriptElement.async = true;\r\n this.opencvScriptElement.src = 'https://docs.opencv.org/4.x/opencv.js';\r\n document.body.appendChild(this.opencvScriptElement); // Append to body or head\r\n console.log('Dynamically loaded opencv.js');\r\n }\r\n }\r\n\r\n private handleOpencvReady = async () => {\r\n this.opencvReady = true;\r\n console.log('OpenCV.js loaded. Ready to start detection.');\r\n await this.getMedia(); // Get camera media once OpenCV is ready\r\n await this.handleStartDetection(); // Start processing video frames\r\n };\r\n\r\n // Method to get user media (camera stream)\r\n private async getMedia() {\r\n try {\r\n if (!store.cameraId) {\r\n await Cameras.InitCameras(store.device);\r\n }\r\n const constraints = Cameras.GetConstraints(store.cameraId, store.device);\r\n\r\n const mediaStream = await navigator.mediaDevices.getUserMedia(constraints);\r\n if (this.videoElement) {\r\n this.videoElement.srcObject = mediaStream;\r\n this.videoElement.play();\r\n }\r\n this.mediaStream = mediaStream;\r\n } catch (err) {\r\n console.error('Error accessing camera:', err);\r\n }\r\n }\r\n\r\n // Method to start video recording\r\n private startRecording = () => {\r\n if (this.mediaStream && this.videoElement) {\r\n this.recordedChunks = []; // Clear previous chunks\r\n\r\n var options = { mimeType: Cameras.webmMimeType.mime, videoBitsPerSecond: 1300000 };\r\n\r\n if (!MediaRecorder.isTypeSupported(options.mimeType)) {\r\n if (store.device.mobileOS == MobileOS.iOS || store.device.browser == Browser.Safari) options.mimeType = Cameras.mp4MimeType.mime;\r\n }\r\n\r\n this.mediaRecorder = new MediaRecorder(this.mediaStream, { mimeType: 'video/webm' });\r\n\r\n this.mediaRecorder.ondataavailable = ({ data }) => {\r\n if (data.size > 0) {\r\n this.recordedChunks = [...this.recordedChunks, data];\r\n }\r\n };\r\n\r\n this.mediaRecorder.onstop = () => {\r\n if (this.recordedChunks.length > 0) {\r\n const blob = new Blob(this.recordedChunks, { type: 'video/webm' });\r\n this.recordedVideoUrl = URL.createObjectURL(blob);\r\n }\r\n };\r\n\r\n this.mediaRecorder.start();\r\n this.isRecording = true;\r\n console.log('Recording started...');\r\n }\r\n };\r\n\r\n // Method to stop video recording\r\n private stopRecording = () => {\r\n if (this.mediaRecorder && this.mediaRecorder.state === 'recording') {\r\n this.mediaRecorder.stop();\r\n this.isRecording = false;\r\n console.log('Recording stopped.');\r\n this.eventRecordingIdReady.emit(this.recordedVideoUrl);\r\n }\r\n };\r\n\r\n // Method to capture an image from the video stream\r\n private capture = () => {\r\n if (this.videoElement && this.canvasElement) {\r\n const video = this.videoElement;\r\n const canvas = this.canvasElement;\r\n const context = canvas.getContext('2d');\r\n\r\n canvas.width = video.videoWidth;\r\n canvas.height = video.videoHeight;\r\n\r\n context.drawImage(video, 0, 0, canvas.width, canvas.height);\r\n\r\n this.capturedImage = canvas.toDataURL('image/png');\r\n console.log('Image captured!');\r\n this.verified = true;\r\n\r\n this.isCapturing = true;\r\n setTimeout(() => {\r\n this.isCapturing = false;\r\n }, 200); // Flash for 200ms\r\n\r\n this.eventPhotoCapture.emit(this.capturedImage);\r\n }\r\n };\r\n\r\n // Method for continuous video frame processing with OpenCV\r\n private processVideoFrame = () => {\r\n if (this.videoElement && this.processingCanvasElement && this.opencvReady && this.isDetecting) {\r\n const video = this.videoElement;\r\n const processingCanvas = this.processingCanvasElement;\r\n const context = processingCanvas.getContext('2d');\r\n\r\n processingCanvas.width = video.videoWidth;\r\n processingCanvas.height = video.videoHeight;\r\n\r\n context.drawImage(video, 0, 0, processingCanvas.width, processingCanvas.height);\r\n\r\n const imageData = context.getImageData(0, 0, processingCanvas.width, processingCanvas.height);\r\n\r\n // --- OpenCV.js processing starts here ---\r\n let src = cv.matFromImageData(imageData);\r\n let gray = new cv.Mat();\r\n let blurred = new cv.Mat();\r\n let edges = new cv.Mat();\r\n let contours = new cv.MatVector();\r\n let hierarchy = new cv.Mat();\r\n\r\n try {\r\n cv.cvtColor(src, gray, cv.COLOR_RGBA2GRAY, 0);\r\n cv.GaussianBlur(gray, blurred, new cv.Size(5, 5), 0, 0, cv.BORDER_DEFAULT);\r\n cv.Canny(blurred, edges, 75, 200, 3, false);\r\n cv.findContours(edges, contours, hierarchy, cv.RETR_EXTERNAL, cv.CHAIN_APPROX_SIMPLE);\r\n\r\n let idDetected = false;\r\n let maxArea = 0;\r\n //let bestRect = null;\r\n\r\n for (let i = 0; i < contours.size(); ++i) {\r\n let contour = contours.get(i);\r\n let area = cv.contourArea(contour);\r\n\r\n if (area > 1000 && area > maxArea) {\r\n let peri = cv.arcLength(contour, true);\r\n let approx = new cv.Mat();\r\n cv.approxPolyDP(contour, approx, 0.02 * peri, true);\r\n\r\n if (approx.rows === 4) {\r\n let rect = cv.boundingRect(approx);\r\n const aspectRatio = rect.width / rect.height;\r\n\r\n if (aspectRatio > 1.4 && aspectRatio < 1.8) {\r\n if (rect.width > video.videoWidth * 0.3 && rect.height > video.videoHeight * 0.3) {\r\n idDetected = true;\r\n maxArea = area;\r\n //bestRect = rect;\r\n }\r\n }\r\n }\r\n approx.delete();\r\n }\r\n contour.delete();\r\n }\r\n\r\n if (idDetected) {\r\n console.log('ID document detected! Starting countdown...');\r\n this.countdown = 3;\r\n if (this.animationFrameId !== null) {\r\n cancelAnimationFrame(this.animationFrameId); // Stop continuous frame processing\r\n this.animationFrameId = null;\r\n }\r\n\r\n const timer = setInterval(() => {\r\n this.countdown--;\r\n if (this.countdown <= 0) {\r\n clearInterval(timer);\r\n this.capture();\r\n this.stopRecording();\r\n this.isDetecting = false;\r\n console.log('Picture taken. You can now stop recording.');\r\n this.countdown = 0; // Ensure countdown is 0\r\n }\r\n }, 1000);\r\n }\r\n } catch (error) {\r\n console.error('OpenCV processing error:', error);\r\n this.isDetecting = false; // Stop detection on error\r\n if (this.animationFrameId !== null) {\r\n cancelAnimationFrame(this.animationFrameId);\r\n this.animationFrameId = null;\r\n }\r\n } finally {\r\n // Crucial: Release memory allocated by OpenCV Mat objects\r\n src.delete();\r\n gray.delete();\r\n blurred.delete();\r\n edges.delete();\r\n contours.delete();\r\n hierarchy.delete();\r\n }\r\n // --- OpenCV.js processing ends here ---\r\n }\r\n\r\n if (this.isDetecting && this.animationFrameId !== null) {\r\n // Ensure loop continues only if still detecting\r\n this.animationFrameId = requestAnimationFrame(this.processVideoFrame);\r\n }\r\n };\r\n\r\n // Method to start the OpenCV frame processing loop\r\n private startFrameProcessing = () => {\r\n if (this.opencvReady && this.videoElement && this.videoElement.readyState >= 2) {\r\n if (this.animationFrameId === null) {\r\n // Only start if not already running\r\n this.animationFrameId = requestAnimationFrame(this.processVideoFrame);\r\n }\r\n }\r\n };\r\n\r\n // Handler for starting the ID detection process\r\n private handleStartDetection = async () => {\r\n if (!this.mediaStream) {\r\n console.log('Camera not ready. Please allow camera access.');\r\n return;\r\n }\r\n if (!this.opencvReady) {\r\n console.log('OpenCV.js is not loaded yet. Please wait.');\r\n return;\r\n }\r\n\r\n console.log('Starting ID detection...');\r\n this.isDetecting = true;\r\n this.capturedImage = null; // Clear previous image\r\n this.recordedChunks = []; // Clear previous video chunks\r\n this.recordedVideoUrl = null; // Clear previous video URL\r\n\r\n this.startRecording();\r\n\r\n if (this.videoElement && this.videoElement.readyState < 3) {\r\n // Use readyState 3 (HAVE_FUTURE_DATA) or 4 (HAVE_ENOUGH_DATA) for more robust readiness\r\n console.log('Waiting for video stream to fully load...');\r\n await new Promise<void>(resolve => {\r\n const onCanPlayThrough = () => {\r\n this.videoElement.removeEventListener('canplaythrough', onCanPlayThrough);\r\n resolve();\r\n };\r\n this.videoElement.addEventListener('canplaythrough', onCanPlayThrough);\r\n });\r\n console.log('Video stream ready. Starting detection.');\r\n }\r\n\r\n this.startFrameProcessing(); // Start the OpenCV frame processing loop\r\n };\r\n\r\n render() {\r\n let cameraVideoClass = 'cameraVideo';\r\n\r\n if (store.device.isDesktop) {\r\n cameraVideoClass = 'cameraVideoSelfieDesk';\r\n }\r\n\r\n return (\r\n <div class=\"container flex center\">\r\n <div class=\"px-2 w-100\">\r\n <h1 class={this.titleStyle} innerHTML={this.titleMesage}></h1>\r\n\r\n <div hidden={this.verified}>\r\n <div class=\"w-100 h-100 rounded\">\r\n <div class=\"camera rounded\">\r\n <video id=\"video\" loop autoplay playsinline muted class={cameraVideoClass} ref={el => (this.videoElement = el)} />\r\n <canvas id=\"output\" ref={el => (this.canvasElement = el)} style={{ display: 'none' }} />\r\n <canvas id=\"processingCanvasElement\" ref={el => (this.processingCanvasElement = el)} style={{ display: 'none' }} />\r\n <div class=\"id-guide-rectangle\"></div>\r\n {this.isCapturing && <div class=\"capture-flash-overlay\"></div>}\r\n {this.countdown > 0 && (\r\n <div class=\"absolute inset-0 bg-black bg-opacity-50 flex items-center justify-center\">\r\n <span class=\"text-white text-9xl font-bold animate-bounce\">{this.countdown}</span>\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"footer text-center\">\r\n <img src={logoOntrace}></img>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
@@ -531,7 +531,7 @@ const IdAutoCapture = class {
531
531
  this.opencvReady = true;
532
532
  console.log('OpenCV.js loaded. Ready to start detection.');
533
533
  await this.getMedia(); // Get camera media once OpenCV is ready
534
- this.handleStartDetection(); // Start processing video frames
534
+ await this.handleStartDetection(); // Start processing video frames
535
535
  };
536
536
  // Method to start video recording
537
537
  this.startRecording = () => {
@@ -688,7 +688,7 @@ const IdAutoCapture = class {
688
688
  }
689
689
  };
690
690
  // Handler for starting the ID detection process
691
- this.handleStartDetection = () => {
691
+ this.handleStartDetection = async () => {
692
692
  if (!this.mediaStream) {
693
693
  console.log('Camera not ready. Please allow camera access.');
694
694
  return;
@@ -703,6 +703,18 @@ const IdAutoCapture = class {
703
703
  this.recordedChunks = []; // Clear previous video chunks
704
704
  this.recordedVideoUrl = null; // Clear previous video URL
705
705
  this.startRecording();
706
+ if (this.videoElement && this.videoElement.readyState < 3) {
707
+ // Use readyState 3 (HAVE_FUTURE_DATA) or 4 (HAVE_ENOUGH_DATA) for more robust readiness
708
+ console.log('Waiting for video stream to fully load...');
709
+ await new Promise(resolve => {
710
+ const onCanPlayThrough = () => {
711
+ this.videoElement.removeEventListener('canplaythrough', onCanPlayThrough);
712
+ resolve();
713
+ };
714
+ this.videoElement.addEventListener('canplaythrough', onCanPlayThrough);
715
+ });
716
+ console.log('Video stream ready. Starting detection.');
717
+ }
706
718
  this.startFrameProcessing(); // Start the OpenCV frame processing loop
707
719
  };
708
720
  this.verified = false;
@@ -776,7 +788,7 @@ const IdAutoCapture = class {
776
788
  if (state.device.isDesktop) {
777
789
  cameraVideoClass = 'cameraVideoSelfieDesk';
778
790
  }
779
- return (h("div", { key: '239110026f2b86b4d21a04571130d29d402f273b', class: "container flex center" }, h("div", { key: 'd3c882b832b541ac902f01ecd7a79c23e2b22eb1', class: "px-2 w-100" }, h("h1", { key: '38452a0b19aa389e83f1a0010d869c9f41cb20e1', class: this.titleStyle, innerHTML: this.titleMesage }), h("div", { key: '5f846e0c702d388cc04e3fc305d194bbcae78fdc', hidden: this.verified }, h("div", { key: '0201a63cd53a9c7299422486174413f6a15553f0', class: "w-100 h-100 rounded" }, h("div", { key: '67f8c00e0ede3cc836f57deb8a15449bc15538e8', class: "camera rounded" }, h("video", { key: 'bd20436cc64cd7e0da4b3aee7909906563ae1ce7', id: "video", loop: true, autoplay: true, playsinline: true, muted: true, class: cameraVideoClass, ref: el => (this.videoElement = el) }), h("canvas", { key: '9d2910bcc563d1a6df51ad4304efed898f89c4fa', id: "output", ref: el => (this.canvasElement = el), style: { display: 'none' } }), h("canvas", { key: '44df5c5e8da34e233deb782443d472536f65b2e7', id: "processingCanvasElement", ref: el => (this.processingCanvasElement = el), style: { display: 'none' } }), h("div", { key: '2a35a0c7778e62b36095d56bc715d612ca17c752', class: "id-guide-rectangle" }), this.isCapturing && h("div", { key: 'b28c98ed3da1dcf8902f42df3f5758aec5cc8b82', class: "capture-flash-overlay" }), this.countdown > 0 && (h("div", { key: 'eafcaa2fb46ba675fd4a600318dd5fe7ba95641e', class: "absolute inset-0 bg-black bg-opacity-50 flex items-center justify-center" }, h("span", { key: '6df1640462fb3cd6eb4b17f8feb011d7bdeb35f4', class: "text-white text-9xl font-bold animate-bounce" }, this.countdown)))))), h("div", { key: '09ad24e2c403c44db82d2790a39311d1c9120031', class: "footer text-center" }, h("img", { key: '6532d116449468609ac82fb2b7ab429f074a3069', src: logoOntraceSvg })))));
791
+ return (h("div", { key: '4bb0f88b1af2b60c0340d193e5b55b20216959f4', class: "container flex center" }, h("div", { key: '91edb8cd88cc514d356f6dbc33d42a0fd4c59403', class: "px-2 w-100" }, h("h1", { key: 'ddfd52905a3f4e57140a77eead1019d0a5f8fd8d', class: this.titleStyle, innerHTML: this.titleMesage }), h("div", { key: '11a1eba365aa8cac67127daf11c8773c9ebb18d7', hidden: this.verified }, h("div", { key: '710dbd4a39607139ef8f9b9bfaa6e8a753e7cb84', class: "w-100 h-100 rounded" }, h("div", { key: 'b48ac855f6ea3c2244160bc8c2c0ed76c0eaaea0', class: "camera rounded" }, h("video", { key: '688fa43c1a703449cafae6b1039768dc271b65aa', id: "video", loop: true, autoplay: true, playsinline: true, muted: true, class: cameraVideoClass, ref: el => (this.videoElement = el) }), h("canvas", { key: 'ed924ec293a47f69a1a61d3b3d5e745e92a5419b', id: "output", ref: el => (this.canvasElement = el), style: { display: 'none' } }), h("canvas", { key: 'f6807b2574c3e981f915228b45af3f8bd7ee5c9d', id: "processingCanvasElement", ref: el => (this.processingCanvasElement = el), style: { display: 'none' } }), h("div", { key: '812da2b6ad46757f8af703ec236996019f40480d', class: "id-guide-rectangle" }), this.isCapturing && h("div", { key: 'aa58dc533dac04f7917c2dba9626ff2213a298bc', class: "capture-flash-overlay" }), this.countdown > 0 && (h("div", { key: 'f0a3e788cc150037b2a9540f4656ba733f276bd5', class: "absolute inset-0 bg-black bg-opacity-50 flex items-center justify-center" }, h("span", { key: '8c22c9ef5dd0763cc6b0fb967e25759ca6a0f8f0', class: "text-white text-9xl font-bold animate-bounce" }, this.countdown)))))), h("div", { key: '0b7ee521152325ef637809a009a5ad719ed4286e', class: "footer text-center" }, h("img", { key: 'bbd817f0b9460e4be2121501a1b87e8bbc15831a', src: logoOntraceSvg })))));
780
792
  }
781
793
  get el() { return getElement(this); }
782
794
  };
@@ -841,7 +853,7 @@ const IdSelection = class {
841
853
  };
842
854
  IdSelection.style = idSelectionCss;
843
855
 
844
- const version$1 = "4.7.21";
856
+ const version$1 = "4.7.22";
845
857
  var packageJson = {
846
858
  version: version$1};
847
859