@ekyc_qoobiss/qbs-ect-cmp 3.6.74 → 3.6.76

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.
@@ -1528,12 +1528,6 @@ const getLogMessage = (param_req_id = '', param_redirect_id = '', param_token =
1528
1528
  };
1529
1529
  };
1530
1530
 
1531
- var VerificationMode;
1532
- (function (VerificationMode) {
1533
- VerificationMode[VerificationMode["Full"] = 0] = "Full";
1534
- VerificationMode[VerificationMode["Tilt"] = 1] = "Tilt";
1535
- })(VerificationMode || (VerificationMode = {}));
1536
-
1537
1531
  class IDML5Detector {
1538
1532
  static getInstance(stream, isMobile) {
1539
1533
  if (!IDML5Detector.instance) {
@@ -1554,13 +1548,9 @@ class IDML5Detector {
1554
1548
  this.canvasElement = canvasElement;
1555
1549
  // this.component = component;
1556
1550
  }
1557
- initDetector(mode) {
1551
+ initDetector() {
1558
1552
  this.initTime = Date.now();
1559
1553
  this.continue = true;
1560
- if (mode == VerificationMode.Full)
1561
- this.targetedLabel = 'full';
1562
- else
1563
- this.targetedLabel = 'tilted';
1564
1554
  // this.width = this.videoElement.videoWidth;
1565
1555
  // this.height = this.videoElement.videoHeight;
1566
1556
  this.drawFrame('white');
@@ -1588,14 +1578,14 @@ class IDML5Detector {
1588
1578
  this.stream.timeElapsed();
1589
1579
  return;
1590
1580
  }
1591
- if (results[0].label == this.targetedLabel && results[0].confidence > 0.9 && !this.checked) {
1581
+ if (results[0].label == 'full' && results[0].confidence > 0.9 && !this.checked) {
1592
1582
  this.checked = true;
1593
1583
  if (TranslationUtils.state.debug)
1594
1584
  console.log('idml5detector | gotResults | autoCapturing');
1595
1585
  this.stream.autoCapturing();
1596
1586
  await this.drawFrame('green');
1597
1587
  }
1598
- if (results[0].label == this.targetedLabel && results[0].confidence > 0.8 && !this.checked) {
1588
+ if (results[0].label == 'tilted' && results[0].confidence > 0.8 && !this.checked) {
1599
1589
  this.checked = true;
1600
1590
  await this.drawFrame('green');
1601
1591
  }
@@ -1719,6 +1709,12 @@ const faceWhiteSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUwIiBoZWlnaHQ9
1719
1709
 
1720
1710
  const faceGreenSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUwIiBoZWlnaHQ9IjIyNC45OTk5OTk5OTk5OTk5NyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIHZlcnNpb249IjEuMSIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQogPGc+DQogIDx0aXRsZT5MYXllciAxPC90aXRsZT4NCiAgPGcgc3Ryb2tlPSJudWxsIiBpZD0iTGF5ZXIgMSI+DQogICA8cGF0aCBzdHJva2U9IiM0Y2E1ODUiIGlkPSJzdmdfMSIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgZmlsbD0ibm9uZSIgZD0ibTc0LjI3NzY1LDYuOTI3NjFjLTExLjM3NTk3LC0wLjAxNzEzIC0zMy41NjU1MSw1LjEwNDMzIC00Ni44MTMxNiwxOS40OTQ4MWMtNi43NDE0Myw3LjMyMjkyIC0xOC4xMjI2OSwyMy4wNjk2NyAtMTkuMjY3NTgsNTkuNjEzNjljLTAuNTE5MDYsMTYuNTY5MjEgNS4wNDUyNCw2MC42MjUzMyAxMC4yNDAwNiw3Ni40Njc3NWMzLjYzMTMsMTEuMDc0NjggMjcuNDgyMTUsNDMuOTMzNDkgNDQuNDkwNiw1My42ODI1MWM0LjgwNzkxLDIuNzU1NDYgMTEuMjk2NjgsMi42ODI1MSAxMi40MjI1NSwyLjY4MjUxYzEuMTg4NzYsLTAuMDg0NTcgNy4zMzAyNiwwLjA3Mjk0IDEyLjEzNzY1LC0yLjY4MjUxYzE3LjAwODQ2LC05Ljc0OTAyIDQwLjQwMjA4LC00Mi43Njg1MSA0NC40OTA2LC01My42ODI1MWM0LjQwMDM4LC0xMS43NDQ5MSAxMC43NTk2NSwtNTkuODk4NTQgMTAuMjQwMDYsLTc2LjQ2Nzc1Yy0xLjE0NDg5LC0zNi41NDQwMiAtMTIuNTI2MTUsLTUyLjI5MDc3IC0xOS4yNjc1OCwtNTkuNjEzNjljLTEzLjI0NzY1LC0xNC4zOTA0OCAtMzUuMzA2NjMsLTE5LjUyOTMzIC00Ni43NzgyNywtMTkuNDk0ODFjLTAuNzQ2ODgsMC4wMDIyMiAtMS44OTQ5NCwwIC0xLjg5NDk0LDB6IiBzdHJva2Utd2lkdGg9IjciLz4NCiAgPC9nPg0KIDwvZz4NCjwvc3ZnPg0K';
1721
1711
 
1712
+ var VerificationMode;
1713
+ (function (VerificationMode) {
1714
+ VerificationMode[VerificationMode["Full"] = 0] = "Full";
1715
+ VerificationMode[VerificationMode["Tilt"] = 1] = "Tilt";
1716
+ })(VerificationMode || (VerificationMode = {}));
1717
+
1722
1718
  class FaceML5Detector {
1723
1719
  static getInstance(stream, isMobile) {
1724
1720
  if (!FaceML5Detector.instance) {
@@ -4422,7 +4418,7 @@ class Stream {
4422
4418
  this.recordedChunks = [];
4423
4419
  this.videoSize = { width: 0, height: 0 };
4424
4420
  if (TranslationUtils.state.debug)
4425
- console.log('stream | constructor');
4421
+ console.log(`stream | constructor`);
4426
4422
  this.initFacePose();
4427
4423
  this.idML5Detector = IDML5Detector.getInstance(this, TranslationUtils.state.device.isMobile);
4428
4424
  this.faceML5Detector = FaceML5Detector.getInstance(this, TranslationUtils.state.device.isMobile);
@@ -4432,25 +4428,25 @@ class Stream {
4432
4428
  if (TranslationUtils.state.debug)
4433
4429
  console.log('stream | getNewInstance');
4434
4430
  if (!Stream.instance) {
4435
- if (TranslationUtils.state.debug)
4436
- console.log('stream | getNewInstance | new instance');
4437
4431
  Stream.instance = new Stream(mode);
4432
+ if (TranslationUtils.state.debug)
4433
+ console.log(`stream | getNewInstance | new instance`);
4438
4434
  }
4439
4435
  return Stream.instance;
4440
4436
  }
4441
4437
  autoCapturing() {
4442
4438
  if (TranslationUtils.state.debug)
4443
- console.log('stream | autoCapturing');
4439
+ console.log(`stream | autoCapturing`);
4444
4440
  this.callbackAutoCapturing();
4445
4441
  }
4446
4442
  timeElapsed() {
4447
4443
  if (TranslationUtils.state.debug)
4448
- console.log('stream | timeElapsed');
4444
+ console.log(`stream | timeElapsed`);
4449
4445
  this.callbackTimeElapsed();
4450
4446
  }
4451
4447
  verificationReady() {
4452
4448
  if (TranslationUtils.state.debug)
4453
- console.log('stream | verificationReady');
4449
+ console.log(`stream | verificationReady`);
4454
4450
  this.verificationFinished();
4455
4451
  }
4456
4452
  updateHtmlElements(videoElement, canvasElement, component) {
@@ -4461,7 +4457,7 @@ class Stream {
4461
4457
  }
4462
4458
  startStream(stream) {
4463
4459
  if (TranslationUtils.state.debug)
4464
- console.log('stream | startStream');
4460
+ console.log(`stream | startStream`);
4465
4461
  if (this.stream)
4466
4462
  this.stream.getTracks().forEach((track) => track.stop());
4467
4463
  this.stream = stream;
@@ -4494,7 +4490,7 @@ class Stream {
4494
4490
  }
4495
4491
  recordStream() {
4496
4492
  if (TranslationUtils.state.debug)
4497
- console.log('stream | recordStream');
4493
+ console.log(`stream | recordStream`);
4498
4494
  if (this.mediaRecorder && this.mediaRecorder.state == 'recording')
4499
4495
  return;
4500
4496
  var options = { mimeType: Stream.webmMimeType.mime, videoBitsPerSecond: 1500000 };
@@ -4506,12 +4502,12 @@ class Stream {
4506
4502
  this.mediaRecorder = new MediaRecorder(this.stream, options);
4507
4503
  this.mediaRecorder.ondataavailable = event => {
4508
4504
  if (TranslationUtils.state.debug)
4509
- console.log('stream | recordStream | ondataavailable');
4505
+ console.log(`stream | recordStream | ondataavailable`);
4510
4506
  this.recordedChunks.push(event.data);
4511
4507
  };
4512
4508
  this.mediaRecorder.onstop = _e => {
4513
4509
  if (TranslationUtils.state.debug)
4514
- console.log('stream | recordStream | onstop');
4510
+ console.log(`stream | recordStream | onstop`);
4515
4511
  var rec = new Blob(this.recordedChunks, {
4516
4512
  type: options.mimeType.split(';')[0],
4517
4513
  });
@@ -4543,7 +4539,7 @@ class Stream {
4543
4539
  }
4544
4540
  async takePhoto() {
4545
4541
  if (TranslationUtils.state.debug)
4546
- console.log('stream | takePhoto');
4542
+ console.log(`stream | takePhoto`);
4547
4543
  const canvas = document.createElement('canvas');
4548
4544
  canvas.style.visibility = 'hidden';
4549
4545
  canvas.width = this.videoElement.videoWidth;
@@ -4552,7 +4548,7 @@ class Stream {
4552
4548
  }
4553
4549
  getFrame(canvas) {
4554
4550
  if (TranslationUtils.state.debug)
4555
- console.log('stream | getFrame');
4551
+ console.log(`stream | getFrame`);
4556
4552
  return new Promise(resolve => {
4557
4553
  const context = canvas.getContext('2d');
4558
4554
  context.drawImage(this.videoElement, 0, 0, canvas.width, canvas.height);
@@ -4560,7 +4556,7 @@ class Stream {
4560
4556
  if (frame.type === ImageFormat.JPEG && !TranslationUtils.state.device.isAppleDevice) {
4561
4557
  try {
4562
4558
  if (TranslationUtils.state.debug)
4563
- console.log('stream | getFrame | addExifInImg');
4559
+ console.log(`stream | getFrame | addExifInImg`);
4564
4560
  addExifInImg(frame, this.stream.getTracks()[0], this.videoSize).then(updatedFrame => resolve(updatedFrame));
4565
4561
  }
4566
4562
  catch (e) {
@@ -4570,7 +4566,7 @@ class Stream {
4570
4566
  }
4571
4567
  else {
4572
4568
  if (TranslationUtils.state.debug)
4573
- console.log('stream | getFrame | resolve');
4569
+ console.log(`stream | getFrame | resolve`);
4574
4570
  resolve(frame);
4575
4571
  }
4576
4572
  }, ImageFormat.PNG, 1);
@@ -4579,7 +4575,7 @@ class Stream {
4579
4575
  async startIdDetection() {
4580
4576
  if (this.streamPaused)
4581
4577
  return;
4582
- this.idML5Detector.initDetector(this.verificationMode);
4578
+ this.idML5Detector.initDetector();
4583
4579
  }
4584
4580
  async startFaceDetection() {
4585
4581
  if (this.streamPaused)
@@ -4821,10 +4817,12 @@ const HowToInfo = class {
4821
4817
  index.registerInstance(this, hostRef);
4822
4818
  this.apiErrorEvent = index.createEvent(this, "apiError", 7);
4823
4819
  this.loadImage = src => new Promise((resolve, reject) => {
4824
- this.image.onload = () => resolve(this.image);
4820
+ this.image.onload = () => {
4821
+ this.imageLoaded = true;
4822
+ resolve(this.image);
4823
+ };
4825
4824
  this.image.onerror = reject;
4826
4825
  this.image.src = src;
4827
- this.imageLoaded = true;
4828
4826
  });
4829
4827
  this.showVideo = undefined;
4830
4828
  this.topTitle = undefined;
@@ -4880,13 +4878,13 @@ const HowToInfo = class {
4880
4878
  this.buttonText = this.translations.HowToValues.IdButton;
4881
4879
  }
4882
4880
  render() {
4883
- let titleClass = 'color-white text-center';
4881
+ let titleClass = 'color-black-2';
4884
4882
  let bgDemo = 'container';
4885
4883
  if (TranslationUtils.state.flowStatus == TranslationUtils.FlowStatus.IDBACKHOWTO) {
4886
- titleClass = 'color-black-2 text-center';
4884
+ titleClass = 'color-white';
4887
4885
  bgDemo = 'container bg-black';
4888
4886
  }
4889
- return (index.h("div", { class: bgDemo }, index.h("div", { class: "row", hidden: TranslationUtils.state.flowStatus == TranslationUtils.FlowStatus.LIVENESSGESTUREHOWTO || this.imageLoaded == false }, index.h("div", { class: "div-ci align-center", hidden: this.showVideo }, index.h("img", { ref: el => (this.image = el) })), index.h("div", { hidden: this.showVideo == false }, index.h("video", { id: "howTo", class: "video-demo", playsinline: true, ref: el => (this.demoVideo = el) }, index.h("source", { type: "video/mp4" }))), index.h("div", { class: "text-center" }, index.h("h1", { class: titleClass }, this.topTitle), index.h("p", { class: "font-size-2", hidden: this.subTitle == '' }, this.subTitle)), index.h("div", { class: "pos-relative show-bottom" }, index.h("div", { class: "btn-buletin" }, index.h("button", { class: "main-button", disabled: !this.buttonEnabled, onClick: () => this.buttonClick(), hidden: this.showVideo == true }, this.buttonText), index.h("p", { class: "main-text font-size-18 text-right mb-0" }, this.translations.GlobalValues.FooterText))))));
4887
+ return (index.h("div", { class: bgDemo }, index.h("div", { class: "row", hidden: this.imageLoaded == false }, index.h("div", { class: "div-ci align-center", hidden: this.showVideo }, index.h("img", { ref: el => (this.image = el) })), index.h("div", { hidden: this.showVideo == false }, index.h("video", { id: "howTo", class: "video-demo", playsinline: true, ref: el => (this.demoVideo = el) }, index.h("source", { type: "video/mp4" }))), index.h("div", { class: "text-center" }, index.h("h1", { class: titleClass }, this.topTitle), index.h("p", { class: "font-size-2", hidden: this.subTitle == '' }, this.subTitle)), index.h("div", { class: "pos-relative show-bottom" }, index.h("div", { class: "btn-buletin" }, index.h("button", { class: "main-button", disabled: !this.buttonEnabled, onClick: () => this.buttonClick(), hidden: this.showVideo == true }, this.buttonText), index.h("p", { class: "main-text font-size-18 text-right mb-0" }, this.translations.GlobalValues.FooterText))))));
4890
4888
  }
4891
4889
  };
4892
4890
  HowToInfo.style = howToInfoCss;
@@ -5058,7 +5056,7 @@ const IdCapture = class {
5058
5056
  }
5059
5057
  async componentWillLoad() {
5060
5058
  if (TranslationUtils.state.debug)
5061
- console.log('id-capture | componentWillLoad');
5059
+ console.log(`id-capture | componentWillLoad`);
5062
5060
  this.translations = await TranslationUtils.Translations.getValues();
5063
5061
  if (!navigator.mediaDevices) {
5064
5062
  this.apiErrorEvent.emit({ message: 'This browser does not support webRTC' });
@@ -5066,29 +5064,26 @@ const IdCapture = class {
5066
5064
  }
5067
5065
  initVariables() {
5068
5066
  if (TranslationUtils.state.debug)
5069
- console.log('id-capture | initVariables');
5067
+ console.log(`id-capture | initVariables`);
5070
5068
  if (TranslationUtils.state.flowStatus == TranslationUtils.FlowStatus.IDFRONT) {
5071
5069
  this.pose = IDPose.Straight;
5072
5070
  this.flowStep = TranslationUtils.FlowSteps.CiFrontCapture;
5073
5071
  this.titleMesage = this.translations.IdCaptureValues.Title;
5074
- this.verificationMode = VerificationMode.Full;
5075
5072
  }
5076
5073
  else if (TranslationUtils.state.flowStatus == TranslationUtils.FlowStatus.IDBACK) {
5077
5074
  this.pose = IDPose.BackStraight;
5078
5075
  this.flowStep = TranslationUtils.FlowSteps.CiBackCapture;
5079
5076
  this.titleMesage = this.translations.IdCaptureValues.TtileRotate;
5080
- this.verificationMode = VerificationMode.Full;
5081
5077
  }
5082
5078
  else if (TranslationUtils.state.flowStatus == TranslationUtils.FlowStatus.IDTILT) {
5083
5079
  this.titleMesage = this.translations.IdCaptureValues.IDPoseMapping;
5084
5080
  this.pose = IDPose.Tilted;
5085
5081
  this.flowStep = TranslationUtils.FlowSteps.CiTilt;
5086
- this.verificationMode = VerificationMode.Tilt;
5087
5082
  }
5088
5083
  }
5089
5084
  async componentDidLoad() {
5090
5085
  if (TranslationUtils.state.debug)
5091
- console.log('id-capture | componentDidLoad');
5086
+ console.log(`id-capture | componentDidLoad`);
5092
5087
  this.initVariables();
5093
5088
  await BaseComponent.logStep(this.flowStep, TranslationUtils.FlowMoments.Initialized);
5094
5089
  this.demoVideo.src = TranslationUtils.IdCaptureValues.IDPoseDemoMapping[this.pose];
@@ -5099,7 +5094,7 @@ const IdCapture = class {
5099
5094
  }
5100
5095
  async openCamera() {
5101
5096
  if (TranslationUtils.state.debug)
5102
- console.log('id-capture | openCamera');
5097
+ console.log(`id-capture | openCamera`);
5103
5098
  if (!TranslationUtils.state.cameraId) {
5104
5099
  await Cameras.InitCameras(TranslationUtils.state.device);
5105
5100
  }
@@ -5109,8 +5104,8 @@ const IdCapture = class {
5109
5104
  .getUserMedia(constraints)
5110
5105
  .then(stream => {
5111
5106
  if (TranslationUtils.state.debug)
5112
- console.log('id-capture | openCamera | streamObtained');
5113
- const superStream = Stream.getNewInstance(this.verificationMode);
5107
+ console.log(`id-capture | openCamera | streamObtained`);
5108
+ const superStream = Stream.getNewInstance(null);
5114
5109
  superStream.initStream(stream);
5115
5110
  })
5116
5111
  .catch(e => {
@@ -5121,34 +5116,34 @@ const IdCapture = class {
5121
5116
  }
5122
5117
  closeCamera() {
5123
5118
  if (TranslationUtils.state.debug)
5124
- console.log('id-capture | closeCamera');
5119
+ console.log(`id-capture | closeCamera`);
5125
5120
  if (Stream.instance) {
5126
5121
  Stream.instance.dropStream();
5127
5122
  }
5128
5123
  }
5129
5124
  disconnectedCallback() {
5130
- if (TranslationUtils.state.debug)
5131
- console.log('id-capture | disconnectedCallback');
5132
5125
  this.closeCamera();
5133
5126
  Stream.instance = null;
5134
5127
  IDML5Detector.instance = null;
5135
5128
  FaceML5Detector.instance = null;
5129
+ if (TranslationUtils.state.debug)
5130
+ console.log(`id-capture | disconnectedCallback`);
5136
5131
  }
5137
5132
  async takePhoto() {
5138
5133
  if (TranslationUtils.state.debug)
5139
- console.log('id-capture | takePhoto');
5134
+ console.log(`id-capture | takePhoto`);
5140
5135
  if (this.captureTaken)
5141
5136
  return;
5142
5137
  this.captureTaken = true;
5143
5138
  if (TranslationUtils.state.debug)
5144
- console.log('id-capture | takePhoto | sendingPhoto');
5139
+ console.log(`id-capture | takePhoto | sendingPhoto`);
5145
5140
  let res = await Stream.instance.takePhoto();
5146
5141
  this.eventPhotoCapture.emit(res);
5147
5142
  await BaseComponent.logStep(this.flowStep, TranslationUtils.FlowMoments.Finalized);
5148
5143
  }
5149
5144
  async verificationFinished() {
5150
5145
  if (TranslationUtils.state.debug)
5151
- console.log('id-capture | verificationFinished');
5146
+ console.log(`id-capture | verificationFinished`);
5152
5147
  if (this.verified)
5153
5148
  return;
5154
5149
  this.verified = true;
@@ -5245,7 +5240,7 @@ function v4(options, buf, offset) {
5245
5240
  }
5246
5241
 
5247
5242
  const name = "@ekyc_qoobiss/qbs-ect-cmp";
5248
- const version$1 = "3.6.74";
5243
+ const version$1 = "3.6.76";
5249
5244
  const description = "Person Identification Component";
5250
5245
  const main = "./dist/index.cjs.js";
5251
5246
  const module$1 = "./dist/index.js";
@@ -11,10 +11,12 @@ import { IDPose } from '../../../libs/IDML5Detector/IDPose';
11
11
  export class HowToInfo {
12
12
  constructor() {
13
13
  this.loadImage = src => new Promise((resolve, reject) => {
14
- this.image.onload = () => resolve(this.image);
14
+ this.image.onload = () => {
15
+ this.imageLoaded = true;
16
+ resolve(this.image);
17
+ };
15
18
  this.image.onerror = reject;
16
19
  this.image.src = src;
17
- this.imageLoaded = true;
18
20
  });
19
21
  this.showVideo = undefined;
20
22
  this.topTitle = undefined;
@@ -70,13 +72,13 @@ export class HowToInfo {
70
72
  this.buttonText = this.translations.HowToValues.IdButton;
71
73
  }
72
74
  render() {
73
- let titleClass = 'color-white text-center';
75
+ let titleClass = 'color-black-2';
74
76
  let bgDemo = 'container';
75
77
  if (store.flowStatus == FlowStatus.IDBACKHOWTO) {
76
- titleClass = 'color-black-2 text-center';
78
+ titleClass = 'color-white';
77
79
  bgDemo = 'container bg-black';
78
80
  }
79
- return (h("div", { class: bgDemo }, h("div", { class: "row", hidden: store.flowStatus == FlowStatus.LIVENESSGESTUREHOWTO || this.imageLoaded == false }, h("div", { class: "div-ci align-center", hidden: this.showVideo }, h("img", { ref: el => (this.image = el) })), h("div", { hidden: this.showVideo == false }, h("video", { id: "howTo", class: "video-demo", playsinline: true, ref: el => (this.demoVideo = el) }, h("source", { type: "video/mp4" }))), h("div", { class: "text-center" }, h("h1", { class: titleClass }, this.topTitle), h("p", { class: "font-size-2", hidden: this.subTitle == '' }, this.subTitle)), h("div", { class: "pos-relative show-bottom" }, h("div", { class: "btn-buletin" }, h("button", { class: "main-button", disabled: !this.buttonEnabled, onClick: () => this.buttonClick(), hidden: this.showVideo == true }, this.buttonText), h("p", { class: "main-text font-size-18 text-right mb-0" }, this.translations.GlobalValues.FooterText))))));
81
+ return (h("div", { class: bgDemo }, h("div", { class: "row", hidden: this.imageLoaded == false }, h("div", { class: "div-ci align-center", hidden: this.showVideo }, h("img", { ref: el => (this.image = el) })), h("div", { hidden: this.showVideo == false }, h("video", { id: "howTo", class: "video-demo", playsinline: true, ref: el => (this.demoVideo = el) }, h("source", { type: "video/mp4" }))), h("div", { class: "text-center" }, h("h1", { class: titleClass }, this.topTitle), h("p", { class: "font-size-2", hidden: this.subTitle == '' }, this.subTitle)), h("div", { class: "pos-relative show-bottom" }, h("div", { class: "btn-buletin" }, h("button", { class: "main-button", disabled: !this.buttonEnabled, onClick: () => this.buttonClick(), hidden: this.showVideo == true }, this.buttonText), h("p", { class: "main-text font-size-18 text-right mb-0" }, this.translations.GlobalValues.FooterText))))));
80
82
  }
81
83
  static get is() { return "how-to-info"; }
82
84
  static get originalStyleUrls() {
@@ -9,7 +9,6 @@ import { delay } from '../../../utils/utils';
9
9
  import store from '../../../helpers/store';
10
10
  import { BaseComponent } from '../../base-component';
11
11
  import { FlowMoments, FlowSteps } from '../../../models/FlowSteps';
12
- import { VerificationMode } from '../../../models/IVerificationMode';
13
12
  import { Translations } from '../../../helpers/TranslationUtils';
14
13
  import { FlowStatus } from '../../../models/FlowStatus';
15
14
  // import { IDPose } from '../../libs/IDML5Detector/IDPose';
@@ -32,7 +31,7 @@ export class IdCapture {
32
31
  }
33
32
  async componentWillLoad() {
34
33
  if (store.debug)
35
- console.log('id-capture | componentWillLoad');
34
+ console.log(`id-capture | componentWillLoad`);
36
35
  this.translations = await Translations.getValues();
37
36
  if (!navigator.mediaDevices) {
38
37
  this.apiErrorEvent.emit({ message: 'This browser does not support webRTC' });
@@ -40,29 +39,26 @@ export class IdCapture {
40
39
  }
41
40
  initVariables() {
42
41
  if (store.debug)
43
- console.log('id-capture | initVariables');
42
+ console.log(`id-capture | initVariables`);
44
43
  if (store.flowStatus == FlowStatus.IDFRONT) {
45
44
  this.pose = IDPose.Straight;
46
45
  this.flowStep = FlowSteps.CiFrontCapture;
47
46
  this.titleMesage = this.translations.IdCaptureValues.Title;
48
- this.verificationMode = VerificationMode.Full;
49
47
  }
50
48
  else if (store.flowStatus == FlowStatus.IDBACK) {
51
49
  this.pose = IDPose.BackStraight;
52
50
  this.flowStep = FlowSteps.CiBackCapture;
53
51
  this.titleMesage = this.translations.IdCaptureValues.TtileRotate;
54
- this.verificationMode = VerificationMode.Full;
55
52
  }
56
53
  else if (store.flowStatus == FlowStatus.IDTILT) {
57
54
  this.titleMesage = this.translations.IdCaptureValues.IDPoseMapping;
58
55
  this.pose = IDPose.Tilted;
59
56
  this.flowStep = FlowSteps.CiTilt;
60
- this.verificationMode = VerificationMode.Tilt;
61
57
  }
62
58
  }
63
59
  async componentDidLoad() {
64
60
  if (store.debug)
65
- console.log('id-capture | componentDidLoad');
61
+ console.log(`id-capture | componentDidLoad`);
66
62
  this.initVariables();
67
63
  await BaseComponent.logStep(this.flowStep, FlowMoments.Initialized);
68
64
  this.demoVideo.src = IdCaptureValues.IDPoseDemoMapping[this.pose];
@@ -73,7 +69,7 @@ export class IdCapture {
73
69
  }
74
70
  async openCamera() {
75
71
  if (store.debug)
76
- console.log('id-capture | openCamera');
72
+ console.log(`id-capture | openCamera`);
77
73
  if (!store.cameraId) {
78
74
  await Cameras.InitCameras(store.device);
79
75
  }
@@ -83,8 +79,8 @@ export class IdCapture {
83
79
  .getUserMedia(constraints)
84
80
  .then(stream => {
85
81
  if (store.debug)
86
- console.log('id-capture | openCamera | streamObtained');
87
- const superStream = Stream.getNewInstance(this.verificationMode);
82
+ console.log(`id-capture | openCamera | streamObtained`);
83
+ const superStream = Stream.getNewInstance(null);
88
84
  superStream.initStream(stream);
89
85
  })
90
86
  .catch(e => {
@@ -95,34 +91,34 @@ export class IdCapture {
95
91
  }
96
92
  closeCamera() {
97
93
  if (store.debug)
98
- console.log('id-capture | closeCamera');
94
+ console.log(`id-capture | closeCamera`);
99
95
  if (Stream.instance) {
100
96
  Stream.instance.dropStream();
101
97
  }
102
98
  }
103
99
  disconnectedCallback() {
104
- if (store.debug)
105
- console.log('id-capture | disconnectedCallback');
106
100
  this.closeCamera();
107
101
  Stream.instance = null;
108
102
  IDML5Detector.instance = null;
109
103
  FaceML5Detector.instance = null;
104
+ if (store.debug)
105
+ console.log(`id-capture | disconnectedCallback`);
110
106
  }
111
107
  async takePhoto() {
112
108
  if (store.debug)
113
- console.log('id-capture | takePhoto');
109
+ console.log(`id-capture | takePhoto`);
114
110
  if (this.captureTaken)
115
111
  return;
116
112
  this.captureTaken = true;
117
113
  if (store.debug)
118
- console.log('id-capture | takePhoto | sendingPhoto');
114
+ console.log(`id-capture | takePhoto | sendingPhoto`);
119
115
  let res = await Stream.instance.takePhoto();
120
116
  this.eventPhotoCapture.emit(res);
121
117
  await BaseComponent.logStep(this.flowStep, FlowMoments.Finalized);
122
118
  }
123
119
  async verificationFinished() {
124
120
  if (store.debug)
125
- console.log('id-capture | verificationFinished');
121
+ console.log(`id-capture | verificationFinished`);
126
122
  if (this.verified)
127
123
  return;
128
124
  this.verified = true;
@@ -39,7 +39,7 @@ export class Stream {
39
39
  this.recordedChunks = [];
40
40
  this.videoSize = { width: 0, height: 0 };
41
41
  if (store.debug)
42
- console.log('stream | constructor');
42
+ console.log(`stream | constructor`);
43
43
  this.initFacePose();
44
44
  this.idML5Detector = IDML5Detector.getInstance(this, store.device.isMobile);
45
45
  this.faceML5Detector = FaceML5Detector.getInstance(this, store.device.isMobile);
@@ -49,25 +49,25 @@ export class Stream {
49
49
  if (store.debug)
50
50
  console.log('stream | getNewInstance');
51
51
  if (!Stream.instance) {
52
- if (store.debug)
53
- console.log('stream | getNewInstance | new instance');
54
52
  Stream.instance = new Stream(mode);
53
+ if (store.debug)
54
+ console.log(`stream | getNewInstance | new instance`);
55
55
  }
56
56
  return Stream.instance;
57
57
  }
58
58
  autoCapturing() {
59
59
  if (store.debug)
60
- console.log('stream | autoCapturing');
60
+ console.log(`stream | autoCapturing`);
61
61
  this.callbackAutoCapturing();
62
62
  }
63
63
  timeElapsed() {
64
64
  if (store.debug)
65
- console.log('stream | timeElapsed');
65
+ console.log(`stream | timeElapsed`);
66
66
  this.callbackTimeElapsed();
67
67
  }
68
68
  verificationReady() {
69
69
  if (store.debug)
70
- console.log('stream | verificationReady');
70
+ console.log(`stream | verificationReady`);
71
71
  this.verificationFinished();
72
72
  }
73
73
  updateHtmlElements(videoElement, canvasElement, component) {
@@ -78,7 +78,7 @@ export class Stream {
78
78
  }
79
79
  startStream(stream) {
80
80
  if (store.debug)
81
- console.log('stream | startStream');
81
+ console.log(`stream | startStream`);
82
82
  if (this.stream)
83
83
  this.stream.getTracks().forEach((track) => track.stop());
84
84
  this.stream = stream;
@@ -111,7 +111,7 @@ export class Stream {
111
111
  }
112
112
  recordStream() {
113
113
  if (store.debug)
114
- console.log('stream | recordStream');
114
+ console.log(`stream | recordStream`);
115
115
  if (this.mediaRecorder && this.mediaRecorder.state == 'recording')
116
116
  return;
117
117
  var options = { mimeType: Stream.webmMimeType.mime, videoBitsPerSecond: 1500000 };
@@ -123,12 +123,12 @@ export class Stream {
123
123
  this.mediaRecorder = new MediaRecorder(this.stream, options);
124
124
  this.mediaRecorder.ondataavailable = event => {
125
125
  if (store.debug)
126
- console.log('stream | recordStream | ondataavailable');
126
+ console.log(`stream | recordStream | ondataavailable`);
127
127
  this.recordedChunks.push(event.data);
128
128
  };
129
129
  this.mediaRecorder.onstop = _e => {
130
130
  if (store.debug)
131
- console.log('stream | recordStream | onstop');
131
+ console.log(`stream | recordStream | onstop`);
132
132
  var rec = new Blob(this.recordedChunks, {
133
133
  type: options.mimeType.split(';')[0],
134
134
  });
@@ -160,7 +160,7 @@ export class Stream {
160
160
  }
161
161
  async takePhoto() {
162
162
  if (store.debug)
163
- console.log('stream | takePhoto');
163
+ console.log(`stream | takePhoto`);
164
164
  const canvas = document.createElement('canvas');
165
165
  canvas.style.visibility = 'hidden';
166
166
  canvas.width = this.videoElement.videoWidth;
@@ -169,7 +169,7 @@ export class Stream {
169
169
  }
170
170
  getFrame(canvas) {
171
171
  if (store.debug)
172
- console.log('stream | getFrame');
172
+ console.log(`stream | getFrame`);
173
173
  return new Promise(resolve => {
174
174
  const context = canvas.getContext('2d');
175
175
  context.drawImage(this.videoElement, 0, 0, canvas.width, canvas.height);
@@ -177,7 +177,7 @@ export class Stream {
177
177
  if (frame.type === ImageFormat.JPEG && !store.device.isAppleDevice) {
178
178
  try {
179
179
  if (store.debug)
180
- console.log('stream | getFrame | addExifInImg');
180
+ console.log(`stream | getFrame | addExifInImg`);
181
181
  addExifInImg(frame, this.stream.getTracks()[0], this.videoSize).then(updatedFrame => resolve(updatedFrame));
182
182
  }
183
183
  catch (e) {
@@ -187,7 +187,7 @@ export class Stream {
187
187
  }
188
188
  else {
189
189
  if (store.debug)
190
- console.log('stream | getFrame | resolve');
190
+ console.log(`stream | getFrame | resolve`);
191
191
  resolve(frame);
192
192
  }
193
193
  }, ImageFormat.PNG, 1);
@@ -196,7 +196,7 @@ export class Stream {
196
196
  async startIdDetection() {
197
197
  if (this.streamPaused)
198
198
  return;
199
- this.idML5Detector.initDetector(this.verificationMode);
199
+ this.idML5Detector.initDetector();
200
200
  }
201
201
  async startFaceDetection() {
202
202
  if (this.streamPaused)
@@ -4,7 +4,6 @@ import id_white_svg from '../../assets/canvas-masks/id_white.svg';
4
4
  // @ts-ignore
5
5
  import id_green_svg from '../../assets/canvas-masks/id_green.svg';
6
6
  import { delay } from '../../utils/utils';
7
- import { VerificationMode } from '../../models/IVerificationMode';
8
7
  import store from '../../helpers/store';
9
8
  export class IDML5Detector {
10
9
  static getInstance(stream, isMobile) {
@@ -26,13 +25,9 @@ export class IDML5Detector {
26
25
  this.canvasElement = canvasElement;
27
26
  // this.component = component;
28
27
  }
29
- initDetector(mode) {
28
+ initDetector() {
30
29
  this.initTime = Date.now();
31
30
  this.continue = true;
32
- if (mode == VerificationMode.Full)
33
- this.targetedLabel = 'full';
34
- else
35
- this.targetedLabel = 'tilted';
36
31
  // this.width = this.videoElement.videoWidth;
37
32
  // this.height = this.videoElement.videoHeight;
38
33
  this.drawFrame('white');
@@ -60,14 +55,14 @@ export class IDML5Detector {
60
55
  this.stream.timeElapsed();
61
56
  return;
62
57
  }
63
- if (results[0].label == this.targetedLabel && results[0].confidence > 0.9 && !this.checked) {
58
+ if (results[0].label == 'full' && results[0].confidence > 0.9 && !this.checked) {
64
59
  this.checked = true;
65
60
  if (store.debug)
66
61
  console.log('idml5detector | gotResults | autoCapturing');
67
62
  this.stream.autoCapturing();
68
63
  await this.drawFrame('green');
69
64
  }
70
- if (results[0].label == this.targetedLabel && results[0].confidence > 0.8 && !this.checked) {
65
+ if (results[0].label == 'tilted' && results[0].confidence > 0.8 && !this.checked) {
71
66
  this.checked = true;
72
67
  await this.drawFrame('green');
73
68
  }