@ekyc_qoobiss/qbs-ect-cmp 4.7.24 → 4.7.26
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.
- package/dist/cjs/agreement-info_23.cjs.entry.js +90 -76
- package/dist/cjs/agreement-info_23.cjs.entry.js.map +1 -1
- package/dist/collection/components/common/id-auto-capture/id-auto-capture.js +89 -75
- package/dist/collection/components/common/id-auto-capture/id-auto-capture.js.map +1 -1
- package/dist/esm/agreement-info_23.entry.js +90 -76
- package/dist/esm/agreement-info_23.entry.js.map +1 -1
- package/dist/qbs-ect-cmp/{p-a284f87f.entry.js → p-8c3d88b3.entry.js} +2 -2
- package/dist/qbs-ect-cmp/p-8c3d88b3.entry.js.map +1 -0
- package/dist/qbs-ect-cmp/qbs-ect-cmp.esm.js +1 -1
- package/package.json +1 -1
- package/dist/qbs-ect-cmp/p-a284f87f.entry.js.map +0 -1
|
@@ -530,10 +530,19 @@ const IdAutoCapture = class {
|
|
|
530
530
|
this.opencvReady = false;
|
|
531
531
|
this.isCapturing = false;
|
|
532
532
|
this.handleOpencvReady = async () => {
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
533
|
+
const checkMatReady = setInterval(async () => {
|
|
534
|
+
if (typeof cv !== 'undefined' && typeof cv.Mat === 'function') {
|
|
535
|
+
clearInterval(checkMatReady);
|
|
536
|
+
console.log('opencv:ready event received and cv.Mat is a constructor. OpenCV is truly ready.');
|
|
537
|
+
this.opencvReady = true;
|
|
538
|
+
console.log('OpenCV.js loaded. Ready to start detection.');
|
|
539
|
+
await this.getMedia(); // Get camera media once OpenCV is ready
|
|
540
|
+
await this.handleStartDetection(); // Start processing video frames
|
|
541
|
+
}
|
|
542
|
+
else {
|
|
543
|
+
console.log('OpenCV.js detected, but cv.Mat is not yet a constructor. Waiting...');
|
|
544
|
+
}
|
|
545
|
+
}, 50);
|
|
537
546
|
};
|
|
538
547
|
// Method to start video recording
|
|
539
548
|
this.startRecording = () => {
|
|
@@ -592,88 +601,93 @@ const IdAutoCapture = class {
|
|
|
592
601
|
// Method for continuous video frame processing with OpenCV
|
|
593
602
|
this.processVideoFrame = () => {
|
|
594
603
|
if (this.videoElement && this.processingCanvasElement && this.opencvReady && this.isDetecting) {
|
|
595
|
-
console.log('Processing frame. cv.Mat is a constructor:', typeof cv.Mat === 'function');
|
|
596
|
-
const video = this.videoElement;
|
|
597
|
-
const processingCanvas = this.processingCanvasElement;
|
|
598
|
-
const context = processingCanvas.getContext('2d');
|
|
599
|
-
processingCanvas.width = video.videoWidth;
|
|
600
|
-
processingCanvas.height = video.videoHeight;
|
|
601
|
-
context.drawImage(video, 0, 0, processingCanvas.width, processingCanvas.height);
|
|
602
|
-
const imageData = context.getImageData(0, 0, processingCanvas.width, processingCanvas.height);
|
|
603
|
-
// --- OpenCV.js processing starts here ---
|
|
604
|
-
let src = new cv.Mat(processingCanvas.height, processingCanvas.width, cv.CV_8UC4);
|
|
605
|
-
src.data.set(imageData.data);
|
|
606
|
-
let gray = new cv.Mat();
|
|
607
|
-
let blurred = new cv.Mat();
|
|
608
|
-
let edges = new cv.Mat();
|
|
609
|
-
let contours = new cv.MatVector();
|
|
610
|
-
let hierarchy = new cv.Mat();
|
|
611
604
|
try {
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
605
|
+
console.log('Processing frame. cv.Mat is a constructor:', typeof cv.Mat === 'function');
|
|
606
|
+
const video = this.videoElement;
|
|
607
|
+
const processingCanvas = this.processingCanvasElement;
|
|
608
|
+
const context = processingCanvas.getContext('2d');
|
|
609
|
+
processingCanvas.width = video.videoWidth;
|
|
610
|
+
processingCanvas.height = video.videoHeight;
|
|
611
|
+
context.drawImage(video, 0, 0, processingCanvas.width, processingCanvas.height);
|
|
612
|
+
const imageData = context.getImageData(0, 0, processingCanvas.width, processingCanvas.height);
|
|
613
|
+
// --- OpenCV.js processing starts here ---
|
|
614
|
+
let src = new cv.Mat(processingCanvas.height, processingCanvas.width, cv.CV_8UC4);
|
|
615
|
+
src.data.set(imageData.data);
|
|
616
|
+
let gray = new cv.Mat();
|
|
617
|
+
let blurred = new cv.Mat();
|
|
618
|
+
let edges = new cv.Mat();
|
|
619
|
+
let contours = new cv.MatVector();
|
|
620
|
+
let hierarchy = new cv.Mat();
|
|
621
|
+
try {
|
|
622
|
+
cv.cvtColor(src, gray, cv.COLOR_RGBA2GRAY, 0);
|
|
623
|
+
cv.GaussianBlur(gray, blurred, new cv.Size(5, 5), 0, 0, cv.BORDER_DEFAULT);
|
|
624
|
+
cv.Canny(blurred, edges, 75, 200, 3, false);
|
|
625
|
+
cv.findContours(edges, contours, hierarchy, cv.RETR_EXTERNAL, cv.CHAIN_APPROX_SIMPLE);
|
|
626
|
+
let idDetected = false;
|
|
627
|
+
let maxArea = 0;
|
|
628
|
+
//let bestRect = null;
|
|
629
|
+
for (let i = 0; i < contours.size(); ++i) {
|
|
630
|
+
let contour = contours.get(i);
|
|
631
|
+
let area = cv.contourArea(contour);
|
|
632
|
+
if (area > 1000 && area > maxArea) {
|
|
633
|
+
let peri = cv.arcLength(contour, true);
|
|
634
|
+
let approx = new cv.Mat();
|
|
635
|
+
cv.approxPolyDP(contour, approx, 0.02 * peri, true);
|
|
636
|
+
if (approx.rows === 4) {
|
|
637
|
+
let rect = cv.boundingRect(approx);
|
|
638
|
+
const aspectRatio = rect.width / rect.height;
|
|
639
|
+
if (aspectRatio > 1.4 && aspectRatio < 1.8) {
|
|
640
|
+
if (rect.width > video.videoWidth * 0.3 && rect.height > video.videoHeight * 0.3) {
|
|
641
|
+
idDetected = true;
|
|
642
|
+
maxArea = area;
|
|
643
|
+
//bestRect = rect;
|
|
644
|
+
}
|
|
634
645
|
}
|
|
635
646
|
}
|
|
647
|
+
approx.delete();
|
|
648
|
+
}
|
|
649
|
+
contour.delete();
|
|
650
|
+
}
|
|
651
|
+
if (idDetected) {
|
|
652
|
+
console.log('ID document detected! Starting countdown...');
|
|
653
|
+
this.countdown = 3;
|
|
654
|
+
if (this.animationFrameId !== null) {
|
|
655
|
+
cancelAnimationFrame(this.animationFrameId); // Stop continuous frame processing
|
|
656
|
+
this.animationFrameId = null;
|
|
636
657
|
}
|
|
637
|
-
|
|
658
|
+
const timer = setInterval(() => {
|
|
659
|
+
this.countdown--;
|
|
660
|
+
if (this.countdown <= 0) {
|
|
661
|
+
clearInterval(timer);
|
|
662
|
+
this.capture();
|
|
663
|
+
this.stopRecording();
|
|
664
|
+
this.isDetecting = false;
|
|
665
|
+
console.log('Picture taken. You can now stop recording.');
|
|
666
|
+
this.countdown = 0; // Ensure countdown is 0
|
|
667
|
+
}
|
|
668
|
+
}, 1000);
|
|
638
669
|
}
|
|
639
|
-
contour.delete();
|
|
640
670
|
}
|
|
641
|
-
|
|
642
|
-
console.
|
|
643
|
-
this.
|
|
671
|
+
catch (error) {
|
|
672
|
+
console.error('OpenCV processing error:', error);
|
|
673
|
+
this.isDetecting = false; // Stop detection on error
|
|
644
674
|
if (this.animationFrameId !== null) {
|
|
645
|
-
cancelAnimationFrame(this.animationFrameId);
|
|
675
|
+
cancelAnimationFrame(this.animationFrameId);
|
|
646
676
|
this.animationFrameId = null;
|
|
647
677
|
}
|
|
648
|
-
const timer = setInterval(() => {
|
|
649
|
-
this.countdown--;
|
|
650
|
-
if (this.countdown <= 0) {
|
|
651
|
-
clearInterval(timer);
|
|
652
|
-
this.capture();
|
|
653
|
-
this.stopRecording();
|
|
654
|
-
this.isDetecting = false;
|
|
655
|
-
console.log('Picture taken. You can now stop recording.');
|
|
656
|
-
this.countdown = 0; // Ensure countdown is 0
|
|
657
|
-
}
|
|
658
|
-
}, 1000);
|
|
659
678
|
}
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
679
|
+
finally {
|
|
680
|
+
// Crucial: Release memory allocated by OpenCV Mat objects
|
|
681
|
+
src.delete();
|
|
682
|
+
gray.delete();
|
|
683
|
+
blurred.delete();
|
|
684
|
+
edges.delete();
|
|
685
|
+
contours.delete();
|
|
686
|
+
hierarchy.delete();
|
|
667
687
|
}
|
|
668
688
|
}
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
src.delete();
|
|
672
|
-
gray.delete();
|
|
673
|
-
blurred.delete();
|
|
674
|
-
edges.delete();
|
|
675
|
-
contours.delete();
|
|
676
|
-
hierarchy.delete();
|
|
689
|
+
catch (error) {
|
|
690
|
+
console.error('Error processing video frame with OpenCV:', error);
|
|
677
691
|
}
|
|
678
692
|
// --- OpenCV.js processing ends here ---
|
|
679
693
|
}
|
|
@@ -791,7 +805,7 @@ const IdAutoCapture = class {
|
|
|
791
805
|
if (TranslationUtils.state.device.isDesktop) {
|
|
792
806
|
cameraVideoClass = 'cameraVideoSelfieDesk';
|
|
793
807
|
}
|
|
794
|
-
return (index.h("div", { key: '
|
|
808
|
+
return (index.h("div", { key: '559bfe7fac1dd5a3e27916476eb5e4a8c2fef7b7', class: "container flex center" }, index.h("div", { key: 'ae81c667734915a9c1cb415623dc8228eb1c939f', class: "px-2 w-100" }, index.h("h1", { key: '3b2b2188b103dca2ece3005d06875906ab602e32', class: this.titleStyle, innerHTML: this.titleMesage }), index.h("div", { key: '80bfc6f31de728101d329710b9334f03ef70d7ee', hidden: this.verified }, index.h("div", { key: '05f7765dd9f42ce792f85e7ca096bfefc8b1c797', class: "w-100 h-100 rounded" }, index.h("div", { key: '91bef087eff53fd1fe568b580815087b5112db81', class: "camera rounded" }, index.h("video", { key: '618fe3be9beba201b0c3db4dd70f26bd1a4a31b4', id: "video", loop: true, autoplay: true, playsinline: true, muted: true, class: cameraVideoClass, ref: el => (this.videoElement = el) }), index.h("canvas", { key: 'd7558bb154af3ccdf7f8d7f100567c6744588ccc', id: "output", ref: el => (this.canvasElement = el), style: { display: 'none' } }), index.h("canvas", { key: '56aafa25e4dfb93e9ded664e453ee7c9c53bde7f', id: "processingCanvasElement", ref: el => (this.processingCanvasElement = el), style: { display: 'none' } }), index.h("div", { key: '5de9a4cb22378fc35da753f31219fa7eb32a58fa', class: "id-guide-rectangle" }), this.isCapturing && index.h("div", { key: '21362e7496c1761528541731baf71140a3d41893', class: "capture-flash-overlay" }), this.countdown > 0 && (index.h("div", { key: '2015a4ba22578673c12bd39e0d76219fd735f707', class: "absolute inset-0 bg-black bg-opacity-50 flex items-center justify-center" }, index.h("span", { key: '480811d0e692d8b9e0e0c64c1f220850c18f38b0', class: "text-white text-9xl font-bold animate-bounce" }, this.countdown)))))), index.h("div", { key: '58cb4e78d20c69e63fff719e00115a599d0a4391', class: "footer text-center" }, index.h("img", { key: '480db038bd76c75a7c1ad212214257529c30e200', src: Cameras.logoOntraceSvg })))));
|
|
795
809
|
}
|
|
796
810
|
get el() { return index.getElement(this); }
|
|
797
811
|
};
|
|
@@ -856,7 +870,7 @@ const IdSelection = class {
|
|
|
856
870
|
};
|
|
857
871
|
IdSelection.style = idSelectionCss;
|
|
858
872
|
|
|
859
|
-
const version$1 = "4.7.
|
|
873
|
+
const version$1 = "4.7.26";
|
|
860
874
|
var packageJson = {
|
|
861
875
|
version: version$1};
|
|
862
876
|
|