@ekyc_qoobiss/qbs-ect-cmp 3.6.14 → 3.6.15

package/dist/collection/components/flow/user-liveness/user-liveness.js

@@ -5,18 +5,13 @@ import { FlowStatus } from '../../../models/FlowStatus';
 import { FlowSteps } from '../../../models/FlowSteps';
 import { getLogMessage } from '../../../utils/utils';
 import { BaseComponent } from '../../base-component';
+import { CaptureUploadTypes, SelfieFlowStatus } from '../../../models/CaptureFlow';
 export class UserLiveness {
   constructor() {
     this.recordingResultCount = 0;
     this.showError = undefined;
-    this.showHowTo = undefined;
-    this.selfieFlow = {
-      photoDone: false,
-      recordingDone: false,
-      verificationFinished: false,
-      photoFile: null,
-      recordingFile: null,
-    };
+    this.captureStep = undefined;
+    this.flow = undefined;
     this.baseComponent = new BaseComponent(FlowSteps.Selfie);
     this.baseComponent.setEventEmitter(this.apiErrorEvent);
   }
@@ -24,20 +19,46 @@ export class UserLiveness {
     await this.baseComponent.initialize();
   }
   componentWillLoad() {
-    this.showHowTo = true;
+    this.flow = {
+      front: {
+        photoDone: false,
+        recordingDone: false,
+        fileName: 'selfie.png',
+        recName: 'selfieVideo.',
+        photoType: CaptureUploadTypes.Selfie,
+        recType: CaptureUploadTypes.SelfieVideo,
+      },
+      back: null,
+      tilt: null,
+    };
+    if (store.hasSelfieGesture) {
+      this.flow.tilt = {
+        photoDone: true,
+        recordingDone: false,
+        fileName: '',
+        recName: 'selfieTiltVideo.',
+        photoType: CaptureUploadTypes.None,
+        recType: CaptureUploadTypes.SelfieGestureVideo,
+      };
+    }
+    this.captureStep = SelfieFlowStatus.HowToSelfie;
   }
   howToDone() {
-    this.showHowTo = false;
+    this.captureStep = SelfieFlowStatus.Selfie;
   }
   timeElapsed() {
     this.showError = true;
   }
   captureErrorDone() {
     this.showError = false;
-    this.selfieFlow.photoDone = false;
-    this.selfieFlow.recordingDone = false;
-    this.selfieFlow.photoFile = null;
-    this.selfieFlow.recordingFile = null;
+    if (this.captureStep == SelfieFlowStatus.Selfie) {
+      this.flow.front.photoDone = false;
+      this.flow.front.recordingDone = false;
+    }
+    if (this.captureStep == SelfieFlowStatus.Gesture) {
+      this.flow.tilt.photoDone = false;
+      this.flow.tilt.recordingDone = false;
+    }
   }
   async captureSelfieImage(event) {
     let selfiePhoto = event.detail;
@@ -47,8 +68,8 @@ export class UserLiveness {
       return;
     }
     try {
-      this.selfieFlow.photoFile = new File([selfiePhoto], 'selfie.png', { type: 'image/png' });
-      await this.uploadPhoto();
+      var uploadPhoto = new File([selfiePhoto], this.flow.front.fileName, { type: 'image/png' });
+      await this.uploadPhoto(uploadPhoto);
     }
     catch (e) {
       this.apiErrorEvent.emit(e);
@@ -66,9 +87,17 @@ export class UserLiveness {
       return;
     }
     let mimeType = selfieRecording.type == Stream.mp4MimeType.type ? Stream.mp4MimeType : Stream.webmMimeType;
+    let currentFlow;
+    if (this.captureStep == SelfieFlowStatus.Selfie) {
+      currentFlow = this.flow.front;
+    }
+    if (this.captureStep == SelfieFlowStatus.Gesture) {
+      currentFlow = this.flow.tilt;
+    }
     try {
-      this.selfieFlow.recordingFile = new File([selfieRecording], 'selfieVideo.' + mimeType.extension, { type: mimeType.type });
-      await this.uploadRecording();
+      let uploadRec = new File([selfieRecording], currentFlow.recName + mimeType.extension, { type: mimeType.type });
+      currentFlow.recordingDone = await this.uploadRecording(uploadRec);
+      await this.endFlow();
     }
     catch (e) {
       if (store.recordingRetryCount < 3) {
@@ -81,49 +110,55 @@ export class UserLiveness {
     }
   }
   async verificationFinished(_event) {
-    this.selfieFlow.verificationFinished = true;
+    this.captureStep = SelfieFlowStatus.End;
     await this.endFlow();
   }
   async disconnectedCallback() {
     await this.baseComponent.finalize();
   }
-  async uploadPhoto() {
-    if (this.selfieFlow.photoFile == null || this.selfieFlow.photoDone) {
+  async uploadPhoto(photoFile) {
+    if (this.flow.front.photoDone) {
       return;
     }
-    this.selfieFlow.photoDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, 'Selfie', this.selfieFlow.photoFile);
-    if (this.selfieFlow.photoDone) {
+    this.flow.front.photoDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, 'Selfie', photoFile);
+    if (this.flow.front.photoDone) {
       await this.endFlow();
     }
     else {
       this.triggerErrorFlow();
     }
   }
-  async uploadRecording() {
-    if (this.selfieFlow.recordingFile == null || this.selfieFlow.recordingDone) {
-      return;
-    }
-    this.selfieFlow.recordingDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, 'SelfieVideo', this.selfieFlow.recordingFile);
-    if (this.selfieFlow.recordingDone) {
-      await this.endFlow();
+  async uploadRecording(uploadRec) {
+    let uplodDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, 'SelfieVideo', uploadRec);
+    if (uplodDone) {
+      return true;
     }
     else {
       this.triggerErrorFlow();
     }
+    return false;
   }
   triggerErrorFlow() {
-    this.selfieFlow.photoFile = null;
-    this.selfieFlow.recordingFile = null;
     this.showError = true;
   }
   async endFlow() {
-    if (!this.selfieFlow.photoDone) {
-      return;
+    if (this.captureStep == SelfieFlowStatus.Selfie) {
+      if (this.flow.front.photoDone && this.flow.front.recordingDone) {
+        this.captureStep = SelfieFlowStatus.Gesture;
+      }
+      else {
+        return;
+      }
     }
-    if (!this.selfieFlow.recordingDone) {
-      return;
+    if (this.captureStep == SelfieFlowStatus.Gesture) {
+      if (this.flow.tilt.photoDone && this.flow.tilt.recordingDone) {
+        this.captureStep = SelfieFlowStatus.End;
+      }
+      else {
+        return;
+      }
     }
-    if (!this.selfieFlow.verificationFinished) {
+    if (this.captureStep != SelfieFlowStatus.End) {
       return;
     }
     store.recordingRetryCount = 0;
@@ -132,8 +167,21 @@ export class UserLiveness {
   render() {
     let howTo = h("how-to-info", { idSide: "" });
     let capture = h("selfie-capture", { id: "camera" });
+    let tilt = h("selfie-tilt", { id: "camera" });
     let error = h("capture-error", { type: "LIVENESS" });
-    return this.showHowTo ? howTo : this.showError ? error : capture;
+    if (this.showError) {
+      return error;
+    }
+    if (this.captureStep == SelfieFlowStatus.HowToSelfie) {
+      return howTo;
+    }
+    if (this.captureStep == SelfieFlowStatus.Selfie) {
+      return capture;
+    }
+    if (this.captureStep == SelfieFlowStatus.Gesture) {
+      return tilt;
+    }
+    return capture;
   }
   static get is() { return "user-liveness"; }
   static get originalStyleUrls() {
@@ -149,8 +197,8 @@ export class UserLiveness {
   static get states() {
     return {
       "showError": {},
-      "showHowTo": {},
-      "selfieFlow": {}
+      "captureStep": {},
+      "flow": {}
     };
   }
   static get events() {

package/dist/collection/helpers/Stream.js

@@ -202,7 +202,7 @@ export class Stream {
   async startFaceDetection() {
     if (this.streamPaused)
       return;
-    this.faceML5Detector.initDetector();
+    this.faceML5Detector.initDetector(this.verificationMode);
   }
   requestFacePose() {
     var pose = FacePosePick.randomEnum(FacePose);

package/dist/collection/libs/FaceML5Detector/FaceML5Detector.js

@@ -9,6 +9,7 @@ import face_green_svg from '../../assets/canvas-masks/face_green.svg';
 import { GlobalValues } from '../../helpers/textValues';
 import store from '../../helpers/store';
 import { delay } from '../../utils/utils';
+import { VerificationMode } from '../../models/IVerificationMode';
 export class FaceML5Detector {
   static getInstance(stream, isMobile) {
     if (!FaceML5Detector.instance) {
@@ -25,7 +26,7 @@ export class FaceML5Detector {
     this.requestedFacePose = null;
     this.presentedFacePose = null;
     this.validFacePose = false;
-    this.validFaceFoundAgain = false;
+    this.checkPose = false;
     this.MAX_NUMBER_FACES = 1;
     this.MIN_FACE_SCORE = 0.65;
     // private readonly MIN_FACE_SIZE_FOR_MOBILE = 200;
@@ -43,9 +44,10 @@ export class FaceML5Detector {
     this.canvasElement = canvasElement;
     // this.component = component;
   }
-  initDetector() {
+  initDetector(mode) {
     this.initTime = Date.now();
     this.continue = true;
+    this.checkPose = mode == VerificationMode.Tilt;
     this.width = this.videoElement.videoWidth;
     this.height = this.videoElement.videoHeight;
     // this.videoRatio = getVideoRatio(this.videoElement);
@@ -53,7 +55,7 @@ export class FaceML5Detector {
     delay(2000).then(() => this.detectFaces());
   }
   detectFaces() {
-    if (this.validFaceFoundAgain) {
+    if (this.validFaceFound) {
       if (this.start == null)
         this.start = Date.now();
       if (Date.now() > this.start + 3000) {
@@ -79,17 +81,19 @@ export class FaceML5Detector {
       return;
     }
     if (results.length > 0) {
-      if (this.isSingleFace(results) && this.checkProbability(results) && this.checkFaceSize(results) && this.checkFaceIndent(results)) {
-        if (!this.validFaceFound) {
-          this.validFaceFound = true;
-          this.stream.autoCapturing();
-          // this.frontFace = new FaceLandmarks(results[0], this.width, this.height);
-          await this.drawFrame('green');
-          this.requestedFacePose = this.stream.requestFacePose();
-          await delay(GlobalValues.VideoLenght);
-        }
-        else if (this.validFaceFound && !this.validFaceFoundAgain) {
-          await this.checkFacePose(results);
+      if (this.checkPose) {
+        this.requestedFacePose = this.stream.requestFacePose();
+        await this.checkFacePose(results);
+      }
+      else {
+        if (this.isSingleFace(results) && this.checkProbability(results) && this.checkFaceSize(results) && this.checkFaceIndent(results)) {
+          if (!this.validFaceFound) {
+            this.validFaceFound = true;
+            this.stream.autoCapturing();
+            // this.frontFace = new FaceLandmarks(results[0], this.width, this.height);
+            await this.drawFrame('green');
+            await delay(GlobalValues.VideoLenght);
+          }
         }
       }
     }
@@ -210,7 +214,6 @@ export class FaceML5Detector {
       if (this.requestedFacePose !== null) {
         await delay(3000);
         this.validFacePose = true;
-        this.validFaceFoundAgain = true;
         await this.drawFrame('green', true);
       }
     }

package/dist/collection/models/CaptureFlow.js

@@ -4,17 +4,25 @@ export var CaptureUploadTypes;
   CaptureUploadTypes["IdBack"] = "IdBack";
   CaptureUploadTypes["IdFrontVideo"] = "IdFrontVideo";
   CaptureUploadTypes["IdBackVideo"] = "IdBackVideo";
+  CaptureUploadTypes["Selfie"] = "Selfie";
   CaptureUploadTypes["SelfieVideo"] = "SelfieVideo";
   CaptureUploadTypes["SelfieGestureVideo"] = "SelfieGestureVideo";
   CaptureUploadTypes["TiltVideo"] = "TiltVideo";
   CaptureUploadTypes["None"] = "None";
 })(CaptureUploadTypes || (CaptureUploadTypes = {}));
-export var CaptureFlowStatus;
-(function (CaptureFlowStatus) {
-  CaptureFlowStatus[CaptureFlowStatus["HowToFront"] = 0] = "HowToFront";
-  CaptureFlowStatus[CaptureFlowStatus["IdFront"] = 1] = "IdFront";
-  CaptureFlowStatus[CaptureFlowStatus["HowToBack"] = 2] = "HowToBack";
-  CaptureFlowStatus[CaptureFlowStatus["IdBack"] = 3] = "IdBack";
-  CaptureFlowStatus[CaptureFlowStatus["Tilt"] = 4] = "Tilt";
-  CaptureFlowStatus[CaptureFlowStatus["End"] = 5] = "End";
-})(CaptureFlowStatus || (CaptureFlowStatus = {}));
+export var IdCaptureFlowStatus;
+(function (IdCaptureFlowStatus) {
+  IdCaptureFlowStatus[IdCaptureFlowStatus["HowToFront"] = 0] = "HowToFront";
+  IdCaptureFlowStatus[IdCaptureFlowStatus["IdFront"] = 1] = "IdFront";
+  IdCaptureFlowStatus[IdCaptureFlowStatus["HowToBack"] = 2] = "HowToBack";
+  IdCaptureFlowStatus[IdCaptureFlowStatus["IdBack"] = 3] = "IdBack";
+  IdCaptureFlowStatus[IdCaptureFlowStatus["Tilt"] = 4] = "Tilt";
+  IdCaptureFlowStatus[IdCaptureFlowStatus["End"] = 5] = "End";
+})(IdCaptureFlowStatus || (IdCaptureFlowStatus = {}));
+export var SelfieFlowStatus;
+(function (SelfieFlowStatus) {
+  SelfieFlowStatus[SelfieFlowStatus["HowToSelfie"] = 0] = "HowToSelfie";
+  SelfieFlowStatus[SelfieFlowStatus["Selfie"] = 1] = "Selfie";
+  SelfieFlowStatus[SelfieFlowStatus["Gesture"] = 2] = "Gesture";
+  SelfieFlowStatus[SelfieFlowStatus["End"] = 3] = "End";
+})(SelfieFlowStatus || (SelfieFlowStatus = {}));

package/dist/collection/models/FlowSteps.js

@@ -8,20 +8,17 @@ export var FlowSteps;
   FlowSteps[FlowSteps["OtpCheck"] = 'otp-check'] = "OtpCheck";
   FlowSteps[FlowSteps["CiFront"] = 'ci-front'] = "CiFront";
   FlowSteps[FlowSteps["CiFrontHowTo"] = 'ci-front-how-to'] = "CiFrontHowTo";
-  FlowSteps[FlowSteps["CiFrontHoldAnimation"] = 'ci-front-hold-animation'] = "CiFrontHoldAnimation";
-  FlowSteps[FlowSteps["CiFrontTiltAnimation"] = 'ci-front-tilt-animation'] = "CiFrontTiltAnimation";
   FlowSteps[FlowSteps["CiFrontCapture"] = 'ci-front-capture'] = "CiFrontCapture";
   FlowSteps[FlowSteps["CiBack"] = 'ci-back'] = "CiBack";
   FlowSteps[FlowSteps["CiBackHowTo"] = 'ci-back-how-to'] = "CiBackHowTo";
-  FlowSteps[FlowSteps["CiBackHoldAnimation"] = 'ci-back-hold-animation'] = "CiBackHoldAnimation";
-  FlowSteps[FlowSteps["CiBackTiltAnimation"] = 'ci-back-tilt-animation'] = "CiBackTiltAnimation";
   FlowSteps[FlowSteps["CiBackCapture"] = 'ci-back-capture'] = "CiBackCapture";
   FlowSteps[FlowSteps["CiTilt"] = 'ci-tilt'] = "CiTilt";
+  FlowSteps[FlowSteps["CiError"] = 'ci-error'] = "CiError";
   FlowSteps[FlowSteps["SelfieHowTo"] = 'selfie-how-to'] = "SelfieHowTo";
-  FlowSteps[FlowSteps["SelfieHoldAnimation"] = 'selfie-hold-animation'] = "SelfieHoldAnimation";
-  FlowSteps[FlowSteps["SelfieTiltAnimation"] = 'selfie-tilt-animation'] = "SelfieTiltAnimation";
+  FlowSteps[FlowSteps["SelfieTilt"] = 'selfie-tilt'] = "SelfieTilt";
   FlowSteps[FlowSteps["SelfieCapture"] = 'selfie-capture'] = "SelfieCapture";
   FlowSteps[FlowSteps["Selfie"] = 'selfie'] = "Selfie";
+  FlowSteps[FlowSteps["SelfieError"] = 'selfie-error'] = "SelfieError";
   FlowSteps[FlowSteps["End"] = 'end'] = "End";
   FlowSteps[FlowSteps["CameraError"] = 'camera-error'] = "CameraError";
 })(FlowSteps || (FlowSteps = {}));