@ekyc_qoobiss/qbs-ect-cmp 3.6.39 → 3.6.41
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/{TranslationUtils-bfe4477a.js → TranslationUtils-dd73945b.js} +31 -43
- package/dist/cjs/{agreement-check_19.cjs.entry.js → agreement-check_17.cjs.entry.js} +245 -882
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/qbs-ect-cmp.cjs.js +1 -1
- package/dist/cjs/random-actions.cjs.entry.js +1 -1
- package/dist/collection/collection-manifest.json +1 -3
- package/dist/collection/components/common/how-to-info/how-to-info.js +11 -34
- package/dist/collection/components/common/id-capture/id-capture.js +39 -19
- package/dist/collection/components/common/selfie-capture/selfie-capture.js +26 -27
- package/dist/collection/components/controls/camera/camera.js +1 -62
- package/dist/collection/components/flow/agreement-info/agreement-info.js +4 -5
- package/dist/collection/components/flow/landing-validation/landing-validation.js +11 -19
- package/dist/collection/components/flow/mobile-redirect/mobile-redirect.js +1 -1
- package/dist/collection/components/flow/process-id/process-id.js +47 -161
- package/dist/collection/components/flow/sms-code-validation/sms-code-validation.js +7 -56
- package/dist/collection/components/flow/sms-send/sms-send.css +0 -0
- package/dist/collection/components/flow/sms-send/sms-send.js +91 -0
- package/dist/collection/components/flow/user-liveness/user-liveness.js +45 -118
- package/dist/collection/components/identification-component/identification-component.js +14 -41
- package/dist/collection/helpers/ApiCall.js +14 -15
- package/dist/collection/helpers/ML5.js +1 -1
- package/dist/collection/helpers/Stream.js +1 -47
- package/dist/collection/helpers/store.js +0 -18
- package/dist/collection/helpers/textValues.js +2 -0
- package/dist/collection/models/CaptureFlow.js +0 -16
- package/dist/collection/models/FlowStatus.js +16 -10
- package/dist/esm/{TranslationUtils-7e68bc94.js → TranslationUtils-741a728a.js} +31 -43
- package/dist/esm/{agreement-check_19.entry.js → agreement-check_17.entry.js} +245 -880
- package/dist/esm/loader.js +1 -1
- package/dist/esm/qbs-ect-cmp.js +1 -1
- package/dist/esm/random-actions.entry.js +1 -1
- package/dist/qbs-ect-cmp/p-87c689d6.js +1 -0
- package/dist/qbs-ect-cmp/{p-d1d9feaf.entry.js → p-a130edd5.entry.js} +1 -1
- package/dist/qbs-ect-cmp/{p-4e3b735b.entry.js → p-b3fa0a37.entry.js} +2 -2
- package/dist/qbs-ect-cmp/qbs-ect-cmp.esm.js +1 -1
- package/dist/types/components/common/how-to-info/how-to-info.d.ts +0 -1
- package/dist/types/components/common/id-capture/id-capture.d.ts +5 -1
- package/dist/types/components/common/selfie-capture/selfie-capture.d.ts +3 -2
- package/dist/types/components/controls/camera/camera.d.ts +0 -7
- package/dist/types/components/flow/process-id/process-id.d.ts +0 -3
- package/dist/types/components/flow/sms-code-validation/sms-code-validation.d.ts +0 -3
- package/dist/types/components/flow/sms-send/sms-send.d.ts +17 -0
- package/dist/types/components/flow/user-liveness/user-liveness.d.ts +2 -6
- package/dist/types/components/identification-component/identification-component.d.ts +1 -2
- package/dist/types/components.d.ts +18 -65
- package/dist/types/helpers/ApiCall.d.ts +9 -3
- package/dist/types/helpers/Stream.d.ts +0 -11
- package/dist/types/helpers/textValues.d.ts +2 -0
- package/dist/types/models/CaptureFlow.d.ts +2 -19
- package/dist/types/models/FlowStatus.d.ts +18 -10
- package/dist/types/models/IAbortResult.d.ts +1 -0
- package/dist/types/models/IAddRequest.d.ts +1 -1
- package/dist/types/models/IEctStore.d.ts +0 -6
- package/dist/types/models/IOtpCheck.d.ts +1 -0
- package/dist/types/models/IOtpSend.d.ts +1 -0
- package/dist/types/models/IUploadFile.d.ts +1 -0
- package/package.json +1 -1
- package/dist/collection/components/common/id-back-capture/id-back-capture.css +0 -35
- package/dist/collection/components/common/id-back-capture/id-back-capture.js +0 -219
- package/dist/collection/components/common/id-tilt/id-tilt.css +0 -35
- package/dist/collection/components/common/id-tilt/id-tilt.js +0 -220
- package/dist/collection/components/common/selfie-tilt/selfie-tilt.css +0 -7
- package/dist/collection/components/common/selfie-tilt/selfie-tilt.js +0 -221
- package/dist/qbs-ect-cmp/p-d35256e9.js +0 -1
- package/dist/types/components/common/id-back-capture/id-back-capture.d.ts +0 -28
- package/dist/types/components/common/id-tilt/id-tilt.d.ts +0 -28
- package/dist/types/components/common/selfie-tilt/selfie-tilt.d.ts +0 -31
|
@@ -5,63 +5,57 @@ import { FlowStatus } from '../../../models/FlowStatus';
|
|
|
5
5
|
import { FlowSteps } from '../../../models/FlowSteps';
|
|
6
6
|
import { getLogMessage } from '../../../utils/utils';
|
|
7
7
|
import { BaseComponent } from '../../base-component';
|
|
8
|
-
import { CaptureUploadTypes
|
|
8
|
+
import { CaptureUploadTypes } from '../../../models/CaptureFlow';
|
|
9
9
|
export class UserLiveness {
|
|
10
10
|
constructor() {
|
|
11
11
|
this.recordingResultCount = 0;
|
|
12
12
|
this.recordingRetryCount = 0;
|
|
13
13
|
this.showError = undefined;
|
|
14
|
-
this.captureStep = undefined;
|
|
15
14
|
this.flow = undefined;
|
|
16
|
-
this.
|
|
17
|
-
this.baseComponent.setEventEmitter(this.apiErrorEvent);
|
|
15
|
+
this.howToDone = false;
|
|
18
16
|
}
|
|
19
17
|
async componentDidLoad() {
|
|
20
18
|
await this.baseComponent.initialize();
|
|
21
19
|
}
|
|
22
20
|
componentWillLoad() {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
tilt: null,
|
|
34
|
-
};
|
|
35
|
-
if (store.hasSelfieGesture) {
|
|
36
|
-
this.flow.tilt = {
|
|
37
|
-
photoDone: true,
|
|
38
|
-
recordingDone: false,
|
|
39
|
-
fileName: '',
|
|
40
|
-
recName: 'selfieTiltVideo.',
|
|
41
|
-
photoType: CaptureUploadTypes.None,
|
|
42
|
-
recType: CaptureUploadTypes.SelfieGestureVideo,
|
|
21
|
+
if (store.flowStatus == FlowStatus.LIVENESS) {
|
|
22
|
+
this.baseComponent = new BaseComponent(FlowSteps.Selfie);
|
|
23
|
+
this.flow = {
|
|
24
|
+
capture: {
|
|
25
|
+
fileName: 'selfie.png',
|
|
26
|
+
recName: 'selfieVideo.',
|
|
27
|
+
photoType: CaptureUploadTypes.Selfie,
|
|
28
|
+
recType: CaptureUploadTypes.SelfieVideo,
|
|
29
|
+
},
|
|
30
|
+
howToDone: false,
|
|
43
31
|
};
|
|
44
32
|
}
|
|
45
|
-
|
|
33
|
+
else if (store.flowStatus == FlowStatus.LIVENESSGESTURE) {
|
|
34
|
+
this.baseComponent = new BaseComponent(FlowSteps.SelfieTilt);
|
|
35
|
+
this.flow = {
|
|
36
|
+
capture: {
|
|
37
|
+
fileName: '',
|
|
38
|
+
recName: 'selfieTiltVideo.',
|
|
39
|
+
photoType: CaptureUploadTypes.None,
|
|
40
|
+
recType: CaptureUploadTypes.SelfieGestureVideo,
|
|
41
|
+
},
|
|
42
|
+
howToDone: false,
|
|
43
|
+
};
|
|
44
|
+
}
|
|
45
|
+
this.baseComponent.setEventEmitter(this.apiErrorEvent);
|
|
46
46
|
}
|
|
47
|
-
|
|
48
|
-
this.
|
|
47
|
+
howToDoneEvent() {
|
|
48
|
+
this.howToDone = true;
|
|
49
49
|
}
|
|
50
50
|
timeElapsed() {
|
|
51
51
|
this.showError = true;
|
|
52
52
|
}
|
|
53
53
|
captureErrorDone() {
|
|
54
54
|
this.showError = false;
|
|
55
|
-
if (this.captureStep == SelfieFlowStatus.Selfie) {
|
|
56
|
-
this.flow.front.photoDone = false;
|
|
57
|
-
this.flow.front.recordingDone = false;
|
|
58
|
-
}
|
|
59
|
-
if (this.captureStep == SelfieFlowStatus.Gesture) {
|
|
60
|
-
this.flow.tilt.photoDone = false;
|
|
61
|
-
this.flow.tilt.recordingDone = false;
|
|
62
|
-
}
|
|
63
55
|
}
|
|
64
56
|
async captureSelfieImage(event) {
|
|
57
|
+
if (store.flowStatus == FlowStatus.LIVENESSGESTURE)
|
|
58
|
+
return;
|
|
65
59
|
let selfiePhoto = event.detail;
|
|
66
60
|
if (selfiePhoto.size == 0) {
|
|
67
61
|
await this.baseComponent.apiCall.AddLog({ message: 'Empty selfie', blobData: selfiePhoto }, getLogMessage());
|
|
@@ -69,8 +63,11 @@ export class UserLiveness {
|
|
|
69
63
|
return;
|
|
70
64
|
}
|
|
71
65
|
try {
|
|
72
|
-
var uploadPhoto = new File([selfiePhoto], this.flow.
|
|
73
|
-
await this.
|
|
66
|
+
var uploadPhoto = new File([selfiePhoto], this.flow.capture.fileName, { type: 'image/png' });
|
|
67
|
+
let photoUploaded = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, this.flow.capture.photoType, uploadPhoto);
|
|
68
|
+
if (!photoUploaded) {
|
|
69
|
+
this.triggerErrorFlow();
|
|
70
|
+
}
|
|
74
71
|
}
|
|
75
72
|
catch (e) {
|
|
76
73
|
this.apiErrorEvent.emit(e);
|
|
@@ -90,18 +87,11 @@ export class UserLiveness {
|
|
|
90
87
|
}
|
|
91
88
|
let mimeType = selfieRecording.type == Stream.mp4MimeType.type ? Stream.mp4MimeType : Stream.webmMimeType;
|
|
92
89
|
try {
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
}
|
|
97
|
-
else if (this.captureStep == SelfieFlowStatus.Gesture) {
|
|
98
|
-
let uploadRec = new File([selfieRecording], this.flow.tilt.recName + mimeType.extension, { type: mimeType.type });
|
|
99
|
-
this.flow.tilt.recordingDone = await this.uploadRecording(uploadRec, this.flow.tilt.recType);
|
|
100
|
-
}
|
|
101
|
-
else {
|
|
90
|
+
let uploadRec = new File([selfieRecording], this.flow.capture.recName + mimeType.extension, { type: mimeType.type });
|
|
91
|
+
let uplodDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, this.flow.capture.recType, uploadRec);
|
|
92
|
+
if (!uplodDone) {
|
|
102
93
|
this.triggerErrorFlow();
|
|
103
94
|
}
|
|
104
|
-
this.endFlow();
|
|
105
95
|
}
|
|
106
96
|
catch (e) {
|
|
107
97
|
if (this.recordingRetryCount < 3) {
|
|
@@ -113,82 +103,25 @@ export class UserLiveness {
|
|
|
113
103
|
}
|
|
114
104
|
}
|
|
115
105
|
}
|
|
116
|
-
async verificationFinished(_event) {
|
|
117
|
-
this.endFlow();
|
|
118
|
-
}
|
|
119
106
|
async disconnectedCallback() {
|
|
120
107
|
await this.baseComponent.finalize();
|
|
121
108
|
}
|
|
122
|
-
async uploadPhoto(photoFile, photoType) {
|
|
123
|
-
if (this.flow.front.photoDone) {
|
|
124
|
-
return;
|
|
125
|
-
}
|
|
126
|
-
this.flow.front.photoDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, photoType, photoFile);
|
|
127
|
-
if (this.flow.front.photoDone) {
|
|
128
|
-
this.endFlow();
|
|
129
|
-
}
|
|
130
|
-
else {
|
|
131
|
-
this.triggerErrorFlow();
|
|
132
|
-
}
|
|
133
|
-
}
|
|
134
|
-
async uploadRecording(uploadRec, recType) {
|
|
135
|
-
let uplodDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, recType, uploadRec);
|
|
136
|
-
if (uplodDone) {
|
|
137
|
-
return true;
|
|
138
|
-
}
|
|
139
|
-
else {
|
|
140
|
-
this.triggerErrorFlow();
|
|
141
|
-
}
|
|
142
|
-
return false;
|
|
143
|
-
}
|
|
144
109
|
triggerErrorFlow() {
|
|
145
110
|
this.showError = true;
|
|
146
111
|
}
|
|
147
|
-
endFlow() {
|
|
148
|
-
if (this.captureStep == SelfieFlowStatus.Selfie) {
|
|
149
|
-
if (this.flow.front.photoDone && this.flow.front.recordingDone) {
|
|
150
|
-
if (store.hasSelfieGesture) {
|
|
151
|
-
this.captureStep = SelfieFlowStatus.Gesture;
|
|
152
|
-
}
|
|
153
|
-
else {
|
|
154
|
-
this.captureStep = SelfieFlowStatus.End;
|
|
155
|
-
}
|
|
156
|
-
}
|
|
157
|
-
else {
|
|
158
|
-
return;
|
|
159
|
-
}
|
|
160
|
-
}
|
|
161
|
-
if (this.captureStep == SelfieFlowStatus.Gesture) {
|
|
162
|
-
if (this.flow.tilt.photoDone && this.flow.tilt.recordingDone) {
|
|
163
|
-
this.captureStep = SelfieFlowStatus.End;
|
|
164
|
-
}
|
|
165
|
-
else {
|
|
166
|
-
return;
|
|
167
|
-
}
|
|
168
|
-
}
|
|
169
|
-
if (this.captureStep != SelfieFlowStatus.End) {
|
|
170
|
-
return;
|
|
171
|
-
}
|
|
172
|
-
store.flowStatus = FlowStatus.COMPLETE;
|
|
173
|
-
}
|
|
174
112
|
render() {
|
|
175
|
-
let howTo = h("how-to-info",
|
|
176
|
-
let capture = h("selfie-capture",
|
|
177
|
-
let tilt = h("selfie-tilt", { id: "camera" });
|
|
113
|
+
let howTo = h("how-to-info", null);
|
|
114
|
+
let capture = h("selfie-capture", null);
|
|
178
115
|
let error = h("capture-error", { type: "LIVENESS" });
|
|
179
116
|
if (this.showError) {
|
|
180
117
|
return error;
|
|
181
118
|
}
|
|
182
|
-
if (this.
|
|
183
|
-
return howTo;
|
|
184
|
-
}
|
|
185
|
-
if (this.captureStep == SelfieFlowStatus.Selfie) {
|
|
119
|
+
if (this.howToDone) {
|
|
186
120
|
return capture;
|
|
187
121
|
}
|
|
188
|
-
|
|
189
|
-
return
|
|
122
|
+
else {
|
|
123
|
+
return howTo;
|
|
190
124
|
}
|
|
191
|
-
return h("div", null);
|
|
192
125
|
}
|
|
193
126
|
static get is() { return "user-liveness"; }
|
|
194
127
|
static get originalStyleUrls() {
|
|
@@ -204,8 +137,8 @@ export class UserLiveness {
|
|
|
204
137
|
static get states() {
|
|
205
138
|
return {
|
|
206
139
|
"showError": {},
|
|
207
|
-
"
|
|
208
|
-
"
|
|
140
|
+
"flow": {},
|
|
141
|
+
"howToDone": {}
|
|
209
142
|
};
|
|
210
143
|
}
|
|
211
144
|
static get events() {
|
|
@@ -229,7 +162,7 @@ export class UserLiveness {
|
|
|
229
162
|
static get listeners() {
|
|
230
163
|
return [{
|
|
231
164
|
"name": "howToInfoDone",
|
|
232
|
-
"method": "
|
|
165
|
+
"method": "howToDoneEvent",
|
|
233
166
|
"target": undefined,
|
|
234
167
|
"capture": false,
|
|
235
168
|
"passive": false
|
|
@@ -257,12 +190,6 @@ export class UserLiveness {
|
|
|
257
190
|
"target": undefined,
|
|
258
191
|
"capture": false,
|
|
259
192
|
"passive": false
|
|
260
|
-
}, {
|
|
261
|
-
"name": "verificationFinished",
|
|
262
|
-
"method": "verificationFinished",
|
|
263
|
-
"target": undefined,
|
|
264
|
-
"capture": false,
|
|
265
|
-
"passive": false
|
|
266
193
|
}];
|
|
267
194
|
}
|
|
268
195
|
}
|
|
@@ -65,6 +65,7 @@ export class IdentificationComponent {
|
|
|
65
65
|
constructor() {
|
|
66
66
|
this.logInit = {};
|
|
67
67
|
this.flowStatusToSet = FlowStatus.NONE;
|
|
68
|
+
this.initialised = false;
|
|
68
69
|
this.token = undefined;
|
|
69
70
|
this.order_id = undefined;
|
|
70
71
|
this.api_url = undefined;
|
|
@@ -72,7 +73,6 @@ export class IdentificationComponent {
|
|
|
72
73
|
this.redirect_id = undefined;
|
|
73
74
|
this.phone_number = undefined;
|
|
74
75
|
this.lang_iso = undefined;
|
|
75
|
-
this.idSide = '';
|
|
76
76
|
this.errorMessage = undefined;
|
|
77
77
|
this.errorTitle = undefined;
|
|
78
78
|
}
|
|
@@ -107,33 +107,14 @@ export class IdentificationComponent {
|
|
|
107
107
|
if (this.lang_iso && this.lang_iso != '') {
|
|
108
108
|
store.langIso = this.lang_iso;
|
|
109
109
|
}
|
|
110
|
-
var ini = sessionStorage.getItem(SessionKeys.InitialisedKey);
|
|
111
|
-
if (ini && ini.toLowerCase() == 'true') {
|
|
112
|
-
store.initialised = true;
|
|
113
|
-
}
|
|
114
|
-
var hasIdBk = sessionStorage.getItem(SessionKeys.HasIdBackKey);
|
|
115
|
-
if (hasIdBk && hasIdBk.toLowerCase() == 'true') {
|
|
116
|
-
store.hasIdBack = true;
|
|
117
|
-
}
|
|
118
|
-
var agrVal = sessionStorage.getItem(SessionKeys.AgreementValidationKey);
|
|
119
|
-
if (agrVal && agrVal.toLowerCase() == 'true') {
|
|
120
|
-
store.agreementsValidation = true;
|
|
121
|
-
}
|
|
122
|
-
var phoneVal = sessionStorage.getItem(SessionKeys.PhoneValidationKey);
|
|
123
|
-
if (phoneVal && phoneVal.toLowerCase() == 'true') {
|
|
124
|
-
store.phoneValidation = true;
|
|
125
|
-
}
|
|
126
110
|
const savedRequest = sessionStorage.getItem(SessionKeys.RequestIdKey);
|
|
111
|
+
if (savedRequest && savedRequest != '' && savedRequest != this.order_id && store.debug) {
|
|
112
|
+
console.log('Session RequestId: ' + savedRequest + ' has different value than property one: ' + this.order_id);
|
|
113
|
+
}
|
|
127
114
|
if (this.order_id && this.order_id != '') {
|
|
128
115
|
store.requestId = this.order_id;
|
|
129
116
|
if (store.debug)
|
|
130
117
|
console.log('Current RequestId has value: ' + this.order_id);
|
|
131
|
-
if (savedRequest && savedRequest != '' && savedRequest != this.order_id) {
|
|
132
|
-
if (store.debug)
|
|
133
|
-
console.log('Session RequestId: ' + savedRequest + ' has different value than property one: ' + this.order_id);
|
|
134
|
-
this.flowStatusToSet = FlowStatus.LANDING;
|
|
135
|
-
store.initialised = false;
|
|
136
|
-
}
|
|
137
118
|
}
|
|
138
119
|
else if (savedRequest) {
|
|
139
120
|
if (store.debug)
|
|
@@ -155,17 +136,12 @@ export class IdentificationComponent {
|
|
|
155
136
|
await this.initializeRequest();
|
|
156
137
|
store.flowStatus = this.flowStatusToSet;
|
|
157
138
|
}
|
|
158
|
-
componentWillRender() {
|
|
159
|
-
if (this.idSide == '') {
|
|
160
|
-
this.idSide = store.hasIdBack ? 'front' : '';
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
139
|
async initializeRequest() {
|
|
164
|
-
if (
|
|
140
|
+
if (this.initialised) {
|
|
165
141
|
return;
|
|
166
142
|
}
|
|
143
|
+
this.initialised = true;
|
|
167
144
|
if (store.environment == 'DEMO') {
|
|
168
|
-
store.initialised = true;
|
|
169
145
|
return;
|
|
170
146
|
}
|
|
171
147
|
if (store.device.browser == Browser.Mi) {
|
|
@@ -183,7 +159,7 @@ export class IdentificationComponent {
|
|
|
183
159
|
this.redirect_id = store.redirectId;
|
|
184
160
|
}
|
|
185
161
|
if (store.token != '' && (store.requestId != '' || store.redirectId != '')) {
|
|
186
|
-
|
|
162
|
+
await this.baseComponent.apiCall.AddIdentificationRequest(store.device, packageJson.version);
|
|
187
163
|
if (!this.order_id || this.order_id == '') {
|
|
188
164
|
this.order_id = store.requestId;
|
|
189
165
|
}
|
|
@@ -199,19 +175,17 @@ export class IdentificationComponent {
|
|
|
199
175
|
}
|
|
200
176
|
render() {
|
|
201
177
|
let currentBlock = (h("div", { class: "container" }, h("div", { class: "row" }, h("div", { class: "div-ci align-center" }, h("img", { src: loaderImg })))));
|
|
202
|
-
if (store.
|
|
203
|
-
|
|
204
|
-
currentBlock = h("landing-validation", null);
|
|
205
|
-
}
|
|
178
|
+
if (store.flowStatus == FlowStatus.LANDING) {
|
|
179
|
+
currentBlock = h("landing-validation", null);
|
|
206
180
|
}
|
|
207
|
-
|
|
181
|
+
if (store.flowStatus == FlowStatus.MOBILE) {
|
|
208
182
|
currentBlock = h("mobile-redirect", null);
|
|
209
183
|
}
|
|
210
184
|
if (store.flowStatus == FlowStatus.AGREEMENT) {
|
|
211
185
|
currentBlock = h("agreement-info", null);
|
|
212
186
|
}
|
|
213
187
|
if (store.flowStatus == FlowStatus.PHONE) {
|
|
214
|
-
currentBlock = h("sms-
|
|
188
|
+
currentBlock = h("sms-send", null);
|
|
215
189
|
}
|
|
216
190
|
if (store.flowStatus == FlowStatus.CODE) {
|
|
217
191
|
currentBlock = h("sms-code-validation", null);
|
|
@@ -219,11 +193,11 @@ export class IdentificationComponent {
|
|
|
219
193
|
if (store.flowStatus == FlowStatus.CODEERROR) {
|
|
220
194
|
currentBlock = h("sms-code-validation", null);
|
|
221
195
|
}
|
|
222
|
-
if (store.flowStatus
|
|
196
|
+
if (store.flowStatus in [FlowStatus.IDFRONT, FlowStatus.IDBACK, FlowStatus.IDTILT]) {
|
|
223
197
|
currentBlock = h("process-id", null);
|
|
224
198
|
}
|
|
225
|
-
if (store.flowStatus
|
|
226
|
-
currentBlock = h("user-liveness",
|
|
199
|
+
if (store.flowStatus in [FlowStatus.LIVENESS, FlowStatus.LIVENESSGESTURE]) {
|
|
200
|
+
currentBlock = h("user-liveness", null);
|
|
227
201
|
}
|
|
228
202
|
if (store.flowStatus == FlowStatus.COMPLETE) {
|
|
229
203
|
currentBlock = h("end-redirect", null);
|
|
@@ -373,7 +347,6 @@ export class IdentificationComponent {
|
|
|
373
347
|
}
|
|
374
348
|
static get states() {
|
|
375
349
|
return {
|
|
376
|
-
"idSide": {},
|
|
377
350
|
"errorMessage": {},
|
|
378
351
|
"errorTitle": {}
|
|
379
352
|
};
|
|
@@ -134,12 +134,12 @@ export class ApiCall {
|
|
|
134
134
|
async SendOTPCode(requestId, phoneNumber) {
|
|
135
135
|
let data = { requestId: requestId, phone: phoneNumber };
|
|
136
136
|
let jsonResp = await this.post(this.urls.OtpSend, JSON.stringify(data));
|
|
137
|
-
return jsonResp
|
|
137
|
+
return jsonResp;
|
|
138
138
|
}
|
|
139
139
|
async CheckOTPCode(requestId, otpCode) {
|
|
140
140
|
let data = { requestId: requestId, otp: otpCode };
|
|
141
141
|
let jsonResp = await this.post(this.urls.OtpCheck, JSON.stringify(data));
|
|
142
|
-
return jsonResp
|
|
142
|
+
return jsonResp;
|
|
143
143
|
}
|
|
144
144
|
async AddIdentificationRequest(deviceInfo, version) {
|
|
145
145
|
if (store.debug)
|
|
@@ -155,12 +155,8 @@ export class ApiCall {
|
|
|
155
155
|
if (store.requestId == '') {
|
|
156
156
|
store.requestId = jsonResp.requestId;
|
|
157
157
|
}
|
|
158
|
-
store.hasIdBack = jsonResp.hasIdBack;
|
|
159
|
-
store.hasIdTilt = jsonResp.hasIdTilt;
|
|
160
|
-
store.hasSelfieGesture = jsonResp.hasSelfieGesture;
|
|
161
|
-
store.agreementsValidation = jsonResp.agreementsValidation;
|
|
162
|
-
store.phoneValidation = jsonResp.phoneValidation;
|
|
163
158
|
store.phoneNumber = jsonResp.phoneNumber;
|
|
159
|
+
store.flowStatus = FlowStatus[jsonResp.status];
|
|
164
160
|
return true;
|
|
165
161
|
}
|
|
166
162
|
async UploadFileForRequestB64(requestId, type, file) {
|
|
@@ -170,13 +166,8 @@ export class ApiCall {
|
|
|
170
166
|
data: await this.toBase64(file),
|
|
171
167
|
};
|
|
172
168
|
let respJson = await this.post(this.urls.UploadCapture, JSON.stringify(data));
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
}
|
|
176
|
-
if (store.hasIdBack && type == 'IdBack') {
|
|
177
|
-
return respJson.isValid;
|
|
178
|
-
}
|
|
179
|
-
if (type == 'Selfie') {
|
|
169
|
+
store.flowStatus = FlowStatus[respJson.state];
|
|
170
|
+
if (type in ['IdFront', 'IdBack', 'Selfie']) {
|
|
180
171
|
return respJson.isValid;
|
|
181
172
|
}
|
|
182
173
|
return true;
|
|
@@ -218,10 +209,18 @@ export class ApiCall {
|
|
|
218
209
|
}
|
|
219
210
|
async AbortRequest() {
|
|
220
211
|
let result = await this.post(this.urls.AbortRequest, JSON.stringify({ requestId: store.requestId }));
|
|
221
|
-
return result
|
|
212
|
+
return result;
|
|
222
213
|
}
|
|
223
214
|
async GetTranslations(langIso) {
|
|
224
215
|
let result = await this.get(this.urls.Translations + '?langIso=' + langIso);
|
|
225
216
|
return result;
|
|
226
217
|
}
|
|
218
|
+
async LandingValidationStartFlow(cameraIsAccessible) {
|
|
219
|
+
let result = await this.post(this.urls.StartFlow, JSON.stringify({ requesId: store.requestId, cameraIsAccessible: cameraIsAccessible }));
|
|
220
|
+
return FlowStatus[result.state];
|
|
221
|
+
}
|
|
222
|
+
async GetNextFlowState() {
|
|
223
|
+
let result = await this.get(this.urls.StartFlow + '?requesId=' + store.requestId);
|
|
224
|
+
return FlowStatus[result.state];
|
|
225
|
+
}
|
|
227
226
|
}
|
|
@@ -14,7 +14,7 @@ export class ML5 {
|
|
|
14
14
|
}
|
|
15
15
|
async init() {
|
|
16
16
|
return new Promise(async (resolve) => {
|
|
17
|
-
const modelPath = store.
|
|
17
|
+
const modelPath = store.apiBaseUrl.includes("apimd") ? 'https://ekyc.blob.core.windows.net/$web/md/model.json' : 'https://ekyc.blob.core.windows.net/$web/model.json';
|
|
18
18
|
this.classifier = await ml5.imageClassifier(modelPath, this.loaded);
|
|
19
19
|
this.faceapi = await ml5.faceApi({ withLandmarks: true, withDescriptors: false }, this.loaded);
|
|
20
20
|
//warmup
|
|
@@ -19,24 +19,12 @@ export class Stream {
|
|
|
19
19
|
this.idDetection = val;
|
|
20
20
|
this.faceDetection = !val;
|
|
21
21
|
}
|
|
22
|
-
// public setProbabilityThreshold(val: number): void {
|
|
23
|
-
// Detector.getInstance().setProbabilityThreshold(val);
|
|
24
|
-
// }
|
|
25
|
-
setCallbackChangeTitle(fun) {
|
|
26
|
-
this.callbackChangeTitle = fun;
|
|
27
|
-
}
|
|
28
22
|
setCallbackVideoStarted(fun) {
|
|
29
23
|
this.callbackVideoStarted = fun;
|
|
30
24
|
}
|
|
31
|
-
setCallbackErrors(fun) {
|
|
32
|
-
this.callbackErrors = fun;
|
|
33
|
-
}
|
|
34
25
|
setCallbackAutoCapturing(fun) {
|
|
35
26
|
this.callbackAutoCapturing = fun;
|
|
36
27
|
}
|
|
37
|
-
// public setCallbackFaceDetectionErrors(fun: (e: PipelineResult) => void): void {
|
|
38
|
-
// this.callbackFaceDetectionErrors = fun;
|
|
39
|
-
// }
|
|
40
28
|
setCallbackRecordingReady(fun) {
|
|
41
29
|
this.callbackRecordingReady = fun;
|
|
42
30
|
}
|
|
@@ -50,13 +38,6 @@ export class Stream {
|
|
|
50
38
|
this.streamPaused = false;
|
|
51
39
|
this.recordedChunks = [];
|
|
52
40
|
this.videoSize = { width: 0, height: 0 };
|
|
53
|
-
this.pauseStream = () => {
|
|
54
|
-
this.streamPaused = true;
|
|
55
|
-
this.mediaRecorder.pause();
|
|
56
|
-
this.videoElement.pause();
|
|
57
|
-
// this.dropMask();
|
|
58
|
-
// if (this.faceDetection) Detector.getInstance().stopDetector();
|
|
59
|
-
};
|
|
60
41
|
this.initFacePose();
|
|
61
42
|
this.idML5Detector = IDML5Detector.getInstance(this, store.device.isMobile);
|
|
62
43
|
this.faceML5Detector = FaceML5Detector.getInstance(this, store.device.isMobile);
|
|
@@ -68,9 +49,6 @@ export class Stream {
|
|
|
68
49
|
}
|
|
69
50
|
return Stream.instance;
|
|
70
51
|
}
|
|
71
|
-
// public returnErrors(errors: PipelineResult) {
|
|
72
|
-
// this.callbackFaceDetectionErrors(errors);
|
|
73
|
-
// }
|
|
74
52
|
autoCapturing() {
|
|
75
53
|
this.callbackAutoCapturing();
|
|
76
54
|
}
|
|
@@ -86,7 +64,6 @@ export class Stream {
|
|
|
86
64
|
this.idML5Detector.updateHtmlElements(this.videoElement, this.canvasElement, component);
|
|
87
65
|
this.faceML5Detector.updateHtmlElements(this.videoElement, this.canvasElement, component);
|
|
88
66
|
}
|
|
89
|
-
static orientationChange() { }
|
|
90
67
|
startStream(stream) {
|
|
91
68
|
if (this.stream)
|
|
92
69
|
this.stream.getTracks().forEach((track) => track.stop());
|
|
@@ -118,13 +95,6 @@ export class Stream {
|
|
|
118
95
|
this.startStream(stream);
|
|
119
96
|
this.recordStream();
|
|
120
97
|
}
|
|
121
|
-
async resumeStream() {
|
|
122
|
-
this.streamPaused = false;
|
|
123
|
-
this.mediaRecorder.resume();
|
|
124
|
-
await this.videoElement.play();
|
|
125
|
-
// this.drawMask();
|
|
126
|
-
// if (this.faceDetection) await Detector.getInstance().startDetector();
|
|
127
|
-
}
|
|
128
98
|
recordStream() {
|
|
129
99
|
if (this.mediaRecorder && this.mediaRecorder.state == 'recording')
|
|
130
100
|
return;
|
|
@@ -164,7 +134,6 @@ export class Stream {
|
|
|
164
134
|
if (this.mediaRecorder && this.mediaRecorder.state != 'inactive') {
|
|
165
135
|
this.mediaRecorder.stop();
|
|
166
136
|
}
|
|
167
|
-
// if (this.faceDetection) Detector.getInstance().stopDetector();
|
|
168
137
|
}
|
|
169
138
|
streamStopped() {
|
|
170
139
|
return !(this.stream && this.stream.getTracks && this.stream.getTracks().length > 0);
|
|
@@ -187,15 +156,13 @@ export class Stream {
|
|
|
187
156
|
}
|
|
188
157
|
catch (e) {
|
|
189
158
|
resolve(frame);
|
|
190
|
-
this.
|
|
159
|
+
this.timeElapsed();
|
|
191
160
|
}
|
|
192
161
|
}
|
|
193
162
|
else {
|
|
194
163
|
resolve(frame);
|
|
195
164
|
}
|
|
196
165
|
}, ImageFormat.PNG, 1);
|
|
197
|
-
//let outCanvContext = this.canvasElement.getContext('2d');
|
|
198
|
-
//outCanvContext.drawImage(this.videoElement, 0, 0, this.canvasElement.width, this.canvasElement.height);
|
|
199
166
|
});
|
|
200
167
|
}
|
|
201
168
|
async startIdDetection() {
|
|
@@ -211,19 +178,6 @@ export class Stream {
|
|
|
211
178
|
initFacePose() {
|
|
212
179
|
this.facePose = FacePosePick.randomEnum(FacePose);
|
|
213
180
|
}
|
|
214
|
-
requestFacePose() {
|
|
215
|
-
// var pose = FacePose.TiltLeft;
|
|
216
|
-
this.callbackChangeTitle(this.facePose);
|
|
217
|
-
return this.facePose;
|
|
218
|
-
}
|
|
219
|
-
changeFacePose() {
|
|
220
|
-
this.callbackChangeTitle(null);
|
|
221
|
-
}
|
|
222
|
-
changeIDPose(pose) {
|
|
223
|
-
this.callbackChangeTitle(pose);
|
|
224
|
-
}
|
|
225
181
|
}
|
|
226
182
|
Stream.mp4MimeType = { type: 'video/mp4', codec: 'codecs:h264', extension: 'mp4', mime: 'video/mp4;codecs:h264' };
|
|
227
183
|
Stream.webmMimeType = { type: 'video/webm', codec: 'codecs=vp8', extension: 'webm', mime: 'video/webm;codecs=vp8' };
|
|
228
|
-
window.addEventListener('resize', Stream.orientationChange, false);
|
|
229
|
-
window.addEventListener('orientationchange', Stream.orientationChange, false);
|
|
@@ -7,15 +7,9 @@ const { state, onChange } = createStore({
|
|
|
7
7
|
debug: false,
|
|
8
8
|
requestId: '',
|
|
9
9
|
redirectId: '',
|
|
10
|
-
initialised: false,
|
|
11
10
|
token: '',
|
|
12
11
|
cameraIds: [],
|
|
13
12
|
cameraId: '',
|
|
14
|
-
hasIdBack: false,
|
|
15
|
-
hasSelfieGesture: false,
|
|
16
|
-
hasIdTilt: false,
|
|
17
|
-
agreementsValidation: true,
|
|
18
|
-
phoneValidation: true,
|
|
19
13
|
phoneNumber: '',
|
|
20
14
|
apiBaseUrl: 'https://apiro.id-kyc.com',
|
|
21
15
|
device: null,
|
|
@@ -33,16 +27,4 @@ onChange('token', value => {
|
|
|
33
27
|
onChange('requestId', value => {
|
|
34
28
|
sessionStorage.setItem(SessionKeys.RequestIdKey, value);
|
|
35
29
|
});
|
|
36
|
-
onChange('initialised', value => {
|
|
37
|
-
sessionStorage.setItem(SessionKeys.InitialisedKey, String(value));
|
|
38
|
-
});
|
|
39
|
-
onChange('hasIdBack', value => {
|
|
40
|
-
sessionStorage.setItem(SessionKeys.HasIdBackKey, String(value));
|
|
41
|
-
});
|
|
42
|
-
onChange('agreementsValidation', value => {
|
|
43
|
-
sessionStorage.setItem(SessionKeys.AgreementValidationKey, String(value));
|
|
44
|
-
});
|
|
45
|
-
onChange('phoneValidation', value => {
|
|
46
|
-
sessionStorage.setItem(SessionKeys.PhoneValidationKey, String(value));
|
|
47
|
-
});
|
|
48
30
|
export default state;
|
|
@@ -45,5 +45,7 @@ export class ApiUrls {
|
|
|
45
45
|
this.AddStep = this.uriEnv + 'validation/logs/step';
|
|
46
46
|
this.AbortRequest = this.uriEnv + 'validation/identity/abort';
|
|
47
47
|
this.Translations = this.uriEnv + 'validation/translations/get';
|
|
48
|
+
this.StartFlow = this.uriEnv + 'flowstate/startflow';
|
|
49
|
+
this.NextFlowState = this.uriEnv + 'flowstate/getnextstate';
|
|
48
50
|
}
|
|
49
51
|
}
|
|
@@ -10,19 +10,3 @@ export var CaptureUploadTypes;
|
|
|
10
10
|
CaptureUploadTypes["TiltVideo"] = "TiltVideo";
|
|
11
11
|
CaptureUploadTypes["None"] = "None";
|
|
12
12
|
})(CaptureUploadTypes || (CaptureUploadTypes = {}));
|
|
13
|
-
export var IdCaptureFlowStatus;
|
|
14
|
-
(function (IdCaptureFlowStatus) {
|
|
15
|
-
IdCaptureFlowStatus[IdCaptureFlowStatus["HowToFront"] = 0] = "HowToFront";
|
|
16
|
-
IdCaptureFlowStatus[IdCaptureFlowStatus["IdFront"] = 1] = "IdFront";
|
|
17
|
-
IdCaptureFlowStatus[IdCaptureFlowStatus["HowToBack"] = 2] = "HowToBack";
|
|
18
|
-
IdCaptureFlowStatus[IdCaptureFlowStatus["IdBack"] = 3] = "IdBack";
|
|
19
|
-
IdCaptureFlowStatus[IdCaptureFlowStatus["Tilt"] = 4] = "Tilt";
|
|
20
|
-
IdCaptureFlowStatus[IdCaptureFlowStatus["End"] = 5] = "End";
|
|
21
|
-
})(IdCaptureFlowStatus || (IdCaptureFlowStatus = {}));
|
|
22
|
-
export var SelfieFlowStatus;
|
|
23
|
-
(function (SelfieFlowStatus) {
|
|
24
|
-
SelfieFlowStatus[SelfieFlowStatus["HowToSelfie"] = 0] = "HowToSelfie";
|
|
25
|
-
SelfieFlowStatus[SelfieFlowStatus["Selfie"] = 1] = "Selfie";
|
|
26
|
-
SelfieFlowStatus[SelfieFlowStatus["Gesture"] = 2] = "Gesture";
|
|
27
|
-
SelfieFlowStatus[SelfieFlowStatus["End"] = 3] = "End";
|
|
28
|
-
})(SelfieFlowStatus || (SelfieFlowStatus = {}));
|
|
@@ -1,14 +1,20 @@
|
|
|
1
1
|
export var FlowStatus;
|
|
2
2
|
(function (FlowStatus) {
|
|
3
3
|
FlowStatus[FlowStatus["LANDING"] = 0] = "LANDING";
|
|
4
|
-
FlowStatus[FlowStatus["
|
|
5
|
-
FlowStatus[FlowStatus["
|
|
6
|
-
FlowStatus[FlowStatus["
|
|
7
|
-
FlowStatus[FlowStatus["
|
|
8
|
-
FlowStatus[FlowStatus["
|
|
9
|
-
FlowStatus[FlowStatus["
|
|
10
|
-
FlowStatus[FlowStatus["
|
|
11
|
-
FlowStatus[FlowStatus["
|
|
12
|
-
FlowStatus[FlowStatus["
|
|
13
|
-
FlowStatus[FlowStatus["
|
|
4
|
+
FlowStatus[FlowStatus["MOBILE"] = 1] = "MOBILE";
|
|
5
|
+
FlowStatus[FlowStatus["AGREEMENT"] = 2] = "AGREEMENT";
|
|
6
|
+
FlowStatus[FlowStatus["PHONE"] = 3] = "PHONE";
|
|
7
|
+
FlowStatus[FlowStatus["CODE"] = 4] = "CODE";
|
|
8
|
+
FlowStatus[FlowStatus["CODEERROR"] = 5] = "CODEERROR";
|
|
9
|
+
FlowStatus[FlowStatus["IDFRONT"] = 6] = "IDFRONT";
|
|
10
|
+
FlowStatus[FlowStatus["IDBACK"] = 7] = "IDBACK";
|
|
11
|
+
FlowStatus[FlowStatus["IDTILT"] = 8] = "IDTILT";
|
|
12
|
+
FlowStatus[FlowStatus["LIVENESS"] = 9] = "LIVENESS";
|
|
13
|
+
FlowStatus[FlowStatus["LIVENESSGESTURE"] = 10] = "LIVENESSGESTURE";
|
|
14
|
+
FlowStatus[FlowStatus["COMPLETE"] = 11] = "COMPLETE";
|
|
15
|
+
FlowStatus[FlowStatus["ERROREND"] = 12] = "ERROREND";
|
|
16
|
+
FlowStatus[FlowStatus["CAMERAERROR"] = 13] = "CAMERAERROR";
|
|
17
|
+
FlowStatus[FlowStatus["ABORTED"] = 14] = "ABORTED";
|
|
18
|
+
FlowStatus[FlowStatus["NONE"] = 15] = "NONE";
|
|
14
19
|
})(FlowStatus || (FlowStatus = {}));
|
|
20
|
+
;
|