@ekyc_qoobiss/qbs-ect-cmp 3.2.1 → 3.2.3

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.
Files changed (60) hide show
  1. package/dist/cjs/agreement-check_18.cjs.entry.js +379 -267
  2. package/dist/cjs/loader.cjs.js +1 -1
  3. package/dist/cjs/qbs-ect-cmp.cjs.js +1 -1
  4. package/dist/collection/components/base-component.js +48 -0
  5. package/dist/collection/components/common/camera-error/camera-error.js +9 -36
  6. package/dist/collection/components/common/id-back-capture/id-back-capture.js +2 -27
  7. package/dist/collection/components/common/id-capture/id-capture.js +2 -27
  8. package/dist/collection/components/common/selfie-capture/selfie-capture.js +4 -28
  9. package/dist/collection/components/controls/camera/camera.js +3 -23
  10. package/dist/collection/components/flow/agreement-info/agreement-info.js +6 -9
  11. package/dist/collection/components/flow/end-redirect/end-redirect.js +4 -9
  12. package/dist/collection/components/flow/id-double-side/id-double-side.js +31 -51
  13. package/dist/collection/components/flow/id-single-side/id-single-side.js +14 -42
  14. package/dist/collection/components/flow/landing-validation/landing-validation.js +19 -40
  15. package/dist/collection/components/flow/mobile-redirect/mobile-redirect.js +7 -10
  16. package/dist/collection/components/flow/sms-code-validation/sms-code-validation.js +12 -15
  17. package/dist/collection/components/flow/user-liveness/user-liveness.js +29 -49
  18. package/dist/collection/components/identification-component/identification-component.js +14 -15
  19. package/dist/collection/helpers/ApiCall.js +3 -3
  20. package/dist/collection/helpers/Cameras.js +3 -2
  21. package/dist/collection/helpers/DeviceDetection.js +83 -0
  22. package/dist/collection/helpers/Events.js +9 -0
  23. package/dist/collection/helpers/Stream.js +9 -8
  24. package/dist/collection/helpers/index.js +0 -33
  25. package/dist/collection/helpers/store.js +2 -0
  26. package/dist/collection/models/FlowSteps.js +19 -13
  27. package/dist/collection/models/IDevice.js +22 -1
  28. package/dist/collection/models/IEctStore.js +1 -0
  29. package/dist/esm/agreement-check_18.entry.js +379 -267
  30. package/dist/esm/loader.js +1 -1
  31. package/dist/esm/qbs-ect-cmp.js +1 -1
  32. package/dist/qbs-ect-cmp/{p-92eaaff9.entry.js → p-f242dbd4.entry.js} +2 -2
  33. package/dist/qbs-ect-cmp/qbs-ect-cmp.esm.js +1 -1
  34. package/dist/types/components/base-component.d.ts +14 -0
  35. package/dist/types/components/common/camera-error/camera-error.d.ts +1 -3
  36. package/dist/types/components/common/id-back-capture/id-back-capture.d.ts +0 -2
  37. package/dist/types/components/common/id-capture/id-capture.d.ts +0 -2
  38. package/dist/types/components/common/selfie-capture/selfie-capture.d.ts +0 -2
  39. package/dist/types/components/controls/camera/camera.d.ts +0 -2
  40. package/dist/types/components/flow/agreement-info/agreement-info.d.ts +3 -3
  41. package/dist/types/components/flow/end-redirect/end-redirect.d.ts +1 -1
  42. package/dist/types/components/flow/id-double-side/id-double-side.d.ts +4 -5
  43. package/dist/types/components/flow/id-single-side/id-single-side.d.ts +3 -5
  44. package/dist/types/components/flow/landing-validation/landing-validation.d.ts +2 -3
  45. package/dist/types/components/flow/mobile-redirect/mobile-redirect.d.ts +1 -1
  46. package/dist/types/components/flow/sms-code-validation/sms-code-validation.d.ts +2 -2
  47. package/dist/types/components/flow/user-liveness/user-liveness.d.ts +3 -4
  48. package/dist/types/components/identification-component/identification-component.d.ts +1 -2
  49. package/dist/types/components.d.ts +0 -19
  50. package/dist/types/helpers/ApiCall.d.ts +4 -4
  51. package/dist/types/helpers/Cameras.d.ts +4 -4
  52. package/dist/types/helpers/DeviceDetection.d.ts +18 -0
  53. package/dist/types/helpers/Events.d.ts +2 -0
  54. package/dist/types/helpers/Stream.d.ts +1 -3
  55. package/dist/types/helpers/index.d.ts +0 -2
  56. package/dist/types/helpers/store.d.ts +2 -17
  57. package/dist/types/models/FlowSteps.d.ts +18 -13
  58. package/dist/types/models/IDevice.d.ts +32 -9
  59. package/dist/types/models/IEctStore.d.ts +20 -0
  60. package/package.json +1 -1
@@ -1,13 +1,12 @@
1
1
  import { h } from '@stencil/core';
2
- import { ApiCall } from '../../../helpers/ApiCall';
3
2
  import store from '../../../helpers/store';
4
3
  import { Stream } from '../../../helpers/Stream';
5
4
  import { FlowStatus } from '../../../models/FlowStatus';
6
5
  import { FlowSteps } from '../../../models/FlowSteps';
7
6
  import { getLogMessage } from '../../../utils/utils';
7
+ import { BaseComponent } from '../../base-component';
8
8
  export class UserLiveness {
9
9
  constructor() {
10
- this.device = undefined;
11
10
  this.showError = undefined;
12
11
  this.showHowTo = undefined;
13
12
  this.selfieFlow = {
@@ -17,15 +16,11 @@ export class UserLiveness {
17
16
  photoFile: null,
18
17
  recordingFile: null,
19
18
  };
20
- this.apiCall = new ApiCall();
19
+ this.baseComponent = new BaseComponent(FlowSteps.Selfie);
20
+ this.baseComponent.setEventEmitter(this.apiErrorEvent);
21
21
  }
22
22
  async componentDidLoad() {
23
- try {
24
- await this.apiCall.AddStep(FlowSteps.Selfie);
25
- }
26
- catch (e) {
27
- this.apiErrorEvent.emit(e);
28
- }
23
+ await this.baseComponent.initialize();
29
24
  }
30
25
  componentWillLoad() {
31
26
  this.showHowTo = true;
@@ -46,7 +41,7 @@ export class UserLiveness {
46
41
  async captureSelfieImage(event) {
47
42
  let selfiePhoto = event.detail;
48
43
  if (selfiePhoto.length == 0 || selfiePhoto.size == 0) {
49
- await this.apiCall.AddLog({ message: 'Empty selfie', blobData: selfiePhoto }, getLogMessage());
44
+ await this.baseComponent.apiCall.AddLog({ message: 'Empty selfie', blobData: selfiePhoto }, getLogMessage());
50
45
  return;
51
46
  }
52
47
  try {
@@ -60,7 +55,7 @@ export class UserLiveness {
60
55
  async capturedSelfieRecording(event) {
61
56
  let selfieRecording = event.detail;
62
57
  if (selfieRecording.length == 0 || selfieRecording.size == 0) {
63
- await this.apiCall.AddLog({ message: 'Empty recording', blobData: selfieRecording }, getLogMessage());
58
+ await this.baseComponent.apiCall.AddLog({ message: 'Empty recording', blobData: selfieRecording }, getLogMessage());
64
59
  return;
65
60
  }
66
61
  let mimeType = selfieRecording.type == Stream.mp4MimeType.type ? Stream.mp4MimeType : Stream.webmMimeType;
@@ -69,42 +64,49 @@ export class UserLiveness {
69
64
  await this.uploadRecording();
70
65
  }
71
66
  catch (e) {
72
- this.apiErrorEvent.emit(e);
67
+ if (store.recordingRetryCount < 3) {
68
+ store.recordingRetryCount++;
69
+ this.triggerErrorFlow();
70
+ }
71
+ else {
72
+ this.apiErrorEvent.emit(e);
73
+ }
73
74
  }
74
75
  }
75
76
  async verificationFinished(_event) {
76
77
  this.selfieFlow.verificationFinished = true;
77
- this.endFlow();
78
+ await this.endFlow();
78
79
  }
79
80
  async uploadPhoto() {
80
81
  if (this.selfieFlow.photoFile == null || this.selfieFlow.photoDone) {
81
82
  return;
82
83
  }
83
- this.selfieFlow.photoDone = await this.apiCall.UploadFileForRequestB64(store.requestId, 'Selfie', this.selfieFlow.photoFile);
84
+ this.selfieFlow.photoDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, 'Selfie', this.selfieFlow.photoFile);
84
85
  if (this.selfieFlow.photoDone) {
85
- this.endFlow();
86
+ await this.endFlow();
86
87
  }
87
88
  else {
88
- this.selfieFlow.photoFile = null;
89
- this.selfieFlow.recordingFile = null;
90
- this.showError = true;
89
+ this.triggerErrorFlow();
91
90
  }
92
91
  }
93
92
  async uploadRecording() {
94
93
  if (this.selfieFlow.recordingFile == null || this.selfieFlow.recordingDone) {
95
94
  return;
96
95
  }
97
- this.selfieFlow.recordingDone = await this.apiCall.UploadFileForRequestB64(store.requestId, 'SelfieVideo', this.selfieFlow.recordingFile);
96
+ this.selfieFlow.recordingDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, 'SelfieVideo', this.selfieFlow.recordingFile);
98
97
  if (this.selfieFlow.recordingDone) {
99
- this.endFlow();
98
+ await this.endFlow();
100
99
  }
101
100
  else {
102
- this.selfieFlow.photoFile = null;
103
- this.selfieFlow.recordingFile = null;
104
- this.showError = true;
101
+ this.triggerErrorFlow();
105
102
  }
106
103
  }
107
- endFlow() {
104
+ triggerErrorFlow() {
105
+ this.selfieFlow.photoFile = null;
106
+ this.selfieFlow.recordingFile = null;
107
+ this.showError = true;
108
+ }
109
+ async endFlow() {
108
110
  if (!this.selfieFlow.photoDone) {
109
111
  return;
110
112
  }
@@ -114,11 +116,13 @@ export class UserLiveness {
114
116
  if (!this.selfieFlow.verificationFinished) {
115
117
  return;
116
118
  }
119
+ store.recordingRetryCount = 0;
120
+ await this.baseComponent.finalize();
117
121
  store.flowStatus = FlowStatus.COMPLETE;
118
122
  }
119
123
  render() {
120
124
  let howTo = h("how-to-info", { idSide: "" });
121
- let capture = h("selfie-capture", { device: this.device, id: "camera" });
125
+ let capture = h("selfie-capture", { id: "camera" });
122
126
  let error = h("capture-error", { type: "LIVENESS" });
123
127
  return this.showHowTo ? howTo : this.showError ? error : capture;
124
128
  }
@@ -133,30 +137,6 @@ export class UserLiveness {
133
137
  "$": ["user-liveness.css"]
134
138
  };
135
139
  }
136
- static get properties() {
137
- return {
138
- "device": {
139
- "type": "unknown",
140
- "mutable": false,
141
- "complexType": {
142
- "original": "Device",
143
- "resolved": "Device",
144
- "references": {
145
- "Device": {
146
- "location": "import",
147
- "path": "../../../models/IDevice"
148
- }
149
- }
150
- },
151
- "required": false,
152
- "optional": false,
153
- "docs": {
154
- "tags": [],
155
- "text": ""
156
- }
157
- }
158
- };
159
- }
160
140
  static get states() {
161
141
  return {
162
142
  "showError": {},
@@ -1,7 +1,5 @@
1
1
  import { h } from '@stencil/core';
2
- import { initDevice } from '../../helpers';
3
2
  import { SessionKeys } from '../../helpers/textValues';
4
- import { ApiCall } from '../../helpers/ApiCall';
5
3
  import store from '../../helpers/store';
6
4
  import { ML5 } from '../../helpers/ML5';
7
5
  import { FlowStatus } from '../../models/FlowStatus';
@@ -9,6 +7,7 @@ import Events from '../../helpers/Events';
9
7
  import * as uuid from 'uuid';
10
8
  import packageJson from '../../../package.json';
11
9
  import { getLogMessage } from '../../utils/utils';
10
+ import { BaseComponent } from '../base-component';
12
11
  export class IdentificationComponent {
13
12
  async onTokenChange(newValue, _oldValue) {
14
13
  if (store.debug)
@@ -75,7 +74,7 @@ export class IdentificationComponent {
75
74
  }
76
75
  agreementAcceptanceEmitted(data) {
77
76
  try {
78
- this.apiCall.GenerateAgreement(data.detail.agreementType);
77
+ this.baseComponent.apiCall.GenerateAgreement(data.detail.agreementType);
79
78
  }
80
79
  catch (e) {
81
80
  this.apiErrorEmitter(e, 'Agreement Acceptance');
@@ -97,7 +96,7 @@ export class IdentificationComponent {
97
96
  else {
98
97
  this.errorTitle = data;
99
98
  }
100
- await this.apiCall.AddLog(apiLogData, getLogMessage(this.order_id, this.redirect_id, this.token));
99
+ await this.baseComponent.apiCall.AddLog(apiLogData, getLogMessage(this.order_id, this.redirect_id, this.token));
101
100
  Events.flowError(data);
102
101
  store.flowStatus = FlowStatus.ERROREND;
103
102
  }
@@ -112,7 +111,8 @@ export class IdentificationComponent {
112
111
  this.idSide = '';
113
112
  this.errorMessage = undefined;
114
113
  this.errorTitle = undefined;
115
- this.device = initDevice();
114
+ this.baseComponent = new BaseComponent(null);
115
+ this.baseComponent.setErrorCallback(this.apiErrorEmitter);
116
116
  }
117
117
  async componentWillLoad() {
118
118
  Events.init(window);
@@ -183,7 +183,6 @@ export class IdentificationComponent {
183
183
  flowStatusToSet = FlowStatus.LANDING;
184
184
  }
185
185
  }
186
- this.apiCall = new ApiCall();
187
186
  await this.initializeRequest();
188
187
  store.flowStatus = flowStatusToSet;
189
188
  }
@@ -202,16 +201,16 @@ export class IdentificationComponent {
202
201
  }
203
202
  try {
204
203
  if (store.debug)
205
- this.apiCall.AddLog('init log', this.logInit);
204
+ this.baseComponent.apiCall.AddLog('init log', this.logInit);
206
205
  }
207
206
  catch (_a) { }
208
207
  try {
209
- if (!this.device.isMobile && store.redirectId == '') {
208
+ if (!store.device.isMobile && store.redirectId == '') {
210
209
  store.redirectId = uuid.v4();
211
210
  this.redirect_id = store.redirectId;
212
211
  }
213
212
  if (store.token != '' && (store.requestId != '' || store.redirectId != '')) {
214
- store.initialised = await this.apiCall.AddIdentificationRequest(this.device, packageJson.version);
213
+ store.initialised = await this.baseComponent.apiCall.AddIdentificationRequest(store.device, packageJson.version);
215
214
  if (!this.order_id || this.order_id == '') {
216
215
  this.order_id = store.requestId;
217
216
  }
@@ -224,9 +223,9 @@ export class IdentificationComponent {
224
223
  }
225
224
  render() {
226
225
  let currentBlock = h("div", null);
227
- if (this.device.isMobile || store.environment == 'DEMO') {
226
+ if (store.device.isMobile || store.environment == 'DEMO') {
228
227
  if (store.flowStatus == FlowStatus.LANDING) {
229
- currentBlock = h("landing-validation", { device: this.device });
228
+ currentBlock = h("landing-validation", null);
230
229
  }
231
230
  }
232
231
  else {
@@ -245,13 +244,13 @@ export class IdentificationComponent {
245
244
  currentBlock = h("sms-code-validation", null);
246
245
  }
247
246
  if (store.flowStatus == FlowStatus.ID && !store.hasIdBack) {
248
- currentBlock = h("id-single-side", { id: "idFront", device: this.device });
247
+ currentBlock = h("id-single-side", { id: "idFront" });
249
248
  }
250
249
  if (store.flowStatus == FlowStatus.ID && store.hasIdBack) {
251
- currentBlock = h("id-double-side", { id: "idFront", device: this.device });
250
+ currentBlock = h("id-double-side", { id: "idFront" });
252
251
  }
253
252
  if (store.flowStatus == FlowStatus.LIVENESS) {
254
- currentBlock = h("user-liveness", { device: this.device, id: "camera" });
253
+ currentBlock = h("user-liveness", { id: "camera" });
255
254
  }
256
255
  if (store.flowStatus == FlowStatus.COMPLETE) {
257
256
  currentBlock = h("end-redirect", null);
@@ -260,7 +259,7 @@ export class IdentificationComponent {
260
259
  currentBlock = h("error-end", { errorTitle: this.errorTitle, message: this.errorMessage });
261
260
  }
262
261
  if (store.flowStatus == FlowStatus.CAMERAERROR) {
263
- currentBlock = h("camera-error", { device: this.device });
262
+ currentBlock = h("camera-error", null);
264
263
  }
265
264
  return h("div", null, currentBlock);
266
265
  }
@@ -2,7 +2,7 @@ import { OrderStatuses } from '../models/OrderStatuses';
2
2
  import store from './store';
3
3
  import { ApiUrls } from './textValues';
4
4
  import { FlowStatus } from '../models/FlowStatus';
5
- import { FlowSteps } from '../models/FlowSteps';
5
+ import { FlowMoments, FlowSteps } from '../models/FlowSteps';
6
6
  export class ApiCall {
7
7
  constructor() {
8
8
  this.toBase64 = (file) => new Promise((resolve, reject) => {
@@ -123,8 +123,8 @@ export class ApiCall {
123
123
  }
124
124
  catch (_a) { }
125
125
  }
126
- async AddStep(step) {
127
- let data = { requestId: store.requestId, redirectId: store.redirectId, step: FlowSteps[step] };
126
+ async AddStep(step, moment) {
127
+ let data = { requestId: store.requestId, redirectId: store.redirectId, step: FlowSteps[step], moment: FlowMoments[moment] };
128
128
  let result = await this.post(this.urls.AddStep, JSON.stringify(data));
129
129
  return result.saved;
130
130
  }
@@ -1,3 +1,4 @@
1
+ import { Browser } from '../models/IDevice';
1
2
  import store from './store';
2
3
  export class Cameras {
3
4
  async GetCameras(deviceInfo) {
@@ -9,7 +10,7 @@ export class Cameras {
9
10
  const stream = await navigator.mediaDevices.getUserMedia(updatedConstraints);
10
11
  stream.getVideoTracks().forEach(track => {
11
12
  var _a, _b;
12
- if (deviceInfo.isFirefox) {
13
+ if (deviceInfo.browser === Browser.Firefox) {
13
14
  const settings = track.getSettings();
14
15
  let facingMode = settings.facingMode && settings.facingMode.length > 0 ? settings.facingMode[0] : '';
15
16
  facingMode = facingMode === 'e' ? 'environment' : facingMode;
@@ -75,7 +76,7 @@ export class Cameras {
75
76
  exact: selectedDeviceId,
76
77
  };
77
78
  }
78
- if (device.isWin) {
79
+ if (device.isDesktop) {
79
80
  constraints.video.width = { ideal: 1280 };
80
81
  }
81
82
  else {
@@ -0,0 +1,83 @@
1
+ import { Browser, DesktopOS, MobileOS } from '../models/IDevice';
2
+ export class DeviceDetection {
3
+ constructor() {
4
+ var _a, _b, _c, _d;
5
+ this.supportedScreenOrientation = (_b = (_a = ((screen === null || screen === void 0 ? void 0 : screen.orientation) || {}).type) !== null && _a !== void 0 ? _a : screen.mozOrientation) !== null && _b !== void 0 ? _b : screen.msOrientation;
6
+ this.safariScreenOrientation = !(screen === null || screen === void 0 ? void 0 : screen.orientation) && matchMedia('(orientation: portrait)').matches ? 'portrait-primary' : 'landscape-primary';
7
+ this.initialScreenOrientation = (_d = (_c = this.supportedScreenOrientation) !== null && _c !== void 0 ? _c : this.safariScreenOrientation) !== null && _d !== void 0 ? _d : 'portrait-primary';
8
+ this.userAgent = navigator.userAgent || navigator.vendor || window.opera || undefined;
9
+ this.isMobile = this.isMobileDevice();
10
+ this.isTablet = this.isTabletDevice();
11
+ this.isDesktop = !this.isMobile && !this.isTablet;
12
+ }
13
+ // Device typology
14
+ isMobileDevice() {
15
+ const regexs = [/(Android)(.+)(Mobile)/i, /BlackBerry/i, /iPhone|iPod/i, /Opera Mini/i, /IEMobile/i];
16
+ return regexs.some(b => this.userAgent.match(b));
17
+ }
18
+ isTabletDevice() {
19
+ const regex = /(ipad|tablet|(android(?!.*mobile))|(windows(?!.*phone)(.*touch))|kindle|playbook|silk|(puffin(?!.*(IP|AP|WP))))/;
20
+ return regex.test(this.userAgent.toLowerCase());
21
+ }
22
+ // Device Operating System
23
+ getMobileOS() {
24
+ if (this.isMobileDevice()) {
25
+ if (/windows phone/i.test(this.userAgent))
26
+ return MobileOS.WindowsPhone;
27
+ else if (/android/i.test(this.userAgent))
28
+ return MobileOS.Android;
29
+ else if (/iPad|iPhone|iPod/.test(this.userAgent) && !window.MSStream)
30
+ return MobileOS.iOS;
31
+ return MobileOS.Unknown;
32
+ }
33
+ else
34
+ return undefined;
35
+ }
36
+ getDesktopOS() {
37
+ if (this.isDesktop) {
38
+ if (this.userAgent.indexOf('Win') !== -1)
39
+ return DesktopOS.Windows;
40
+ else if (this.userAgent.indexOf('Mac') !== -1)
41
+ return DesktopOS.MacOS;
42
+ else if (this.userAgent.indexOf('X11') !== -1)
43
+ return DesktopOS.Unix;
44
+ else if (this.userAgent.indexOf('Linux') !== -1)
45
+ return DesktopOS.Linux;
46
+ return DesktopOS.Unknown;
47
+ }
48
+ else
49
+ return undefined;
50
+ }
51
+ getDeviceOS() {
52
+ var _a;
53
+ return (_a = this.getMobileOS()) !== null && _a !== void 0 ? _a : this.getDesktopOS();
54
+ }
55
+ getBrowser() {
56
+ var isChrome = /chrome/i.test(this.userAgent);
57
+ if (isChrome)
58
+ return Browser.Chrome;
59
+ if (/firefox/i.test(navigator.userAgent))
60
+ return Browser.Firefox;
61
+ else if (!isChrome && /safari/i.test(navigator.userAgent))
62
+ return Browser.Safari;
63
+ else
64
+ return Browser.Unknown;
65
+ }
66
+ getDevice() {
67
+ var device = {
68
+ isDesktop: this.isDesktop,
69
+ desktopOS: this.getDesktopOS(),
70
+ isWindowsDesktop: this.getDeviceOS() === DesktopOS.Windows,
71
+ isLinuxOrUnixDesktop: this.getDeviceOS() === DesktopOS.Linux || this.getDeviceOS() === DesktopOS.Unix,
72
+ isMobile: this.isMobile,
73
+ mobileOS: this.getMobileOS(),
74
+ isAndroidDevice: this.getDeviceOS() === MobileOS.Android,
75
+ isAppleDevice: this.getDeviceOS() === MobileOS.iOS || this.getDeviceOS() === DesktopOS.MacOS,
76
+ isUnknownMobileDevice: this.getDeviceOS() === MobileOS.Unknown,
77
+ browser: this.getBrowser(),
78
+ isTablet: this.isTablet,
79
+ initialScreenOrientation: this.initialScreenOrientation,
80
+ };
81
+ return device;
82
+ }
83
+ }
@@ -2,6 +2,15 @@ export default class Events {
2
2
  static init(element) {
3
3
  this.callingModule = element;
4
4
  }
5
+ static flowEvent(step, moment) {
6
+ const eventName = `ect-${step.toString()}-${moment.toString()}-event`;
7
+ this.callingModule.dispatchEvent(new CustomEvent(eventName, {
8
+ detail: {},
9
+ bubbles: true,
10
+ cancelable: true,
11
+ composed: true,
12
+ }));
13
+ }
5
14
  static flowStarted() {
6
15
  this.callingModule.dispatchEvent(new CustomEvent('ect-started', {
7
16
  detail: {},
@@ -3,6 +3,8 @@ import { FaceML5Detector } from '../libs/FaceML5Detector/FaceML5Detector';
3
3
  import { FacePose } from '../libs/FaceML5Detector/FacePose';
4
4
  import { FacePosePick } from '../libs/FaceML5Detector/FacePose';
5
5
  import { addExifInImg } from './security';
6
+ import store from './store';
7
+ import { Browser, MobileOS } from '../models/IDevice';
6
8
  var ImageFormat;
7
9
  (function (ImageFormat) {
8
10
  ImageFormat["JPEG"] = "image/jpeg";
@@ -44,7 +46,7 @@ export class Stream {
44
46
  setVerificationFinished(fun) {
45
47
  this.verificationFinished = fun;
46
48
  }
47
- constructor(device, _modelPath) {
49
+ constructor(_modelPath) {
48
50
  this.streamPaused = false;
49
51
  this.recordedChunks = [];
50
52
  this.videoSize = { width: 0, height: 0 };
@@ -55,13 +57,12 @@ export class Stream {
55
57
  // this.dropMask();
56
58
  // if (this.faceDetection) Detector.getInstance().stopDetector();
57
59
  };
58
- this.device = device;
59
- this.idML5Detector = IDML5Detector.getInstance(this, device.isMobile);
60
- this.faceML5Detector = FaceML5Detector.getInstance(this, device.isMobile);
60
+ this.idML5Detector = IDML5Detector.getInstance(this, store.device.isMobile);
61
+ this.faceML5Detector = FaceML5Detector.getInstance(this, store.device.isMobile);
61
62
  }
62
- static getInstance(device, modelPath) {
63
+ static getInstance(modelPath) {
63
64
  if (!Stream.instance) {
64
- Stream.instance = new Stream(device, modelPath);
65
+ Stream.instance = new Stream(modelPath);
65
66
  }
66
67
  return Stream.instance;
67
68
  }
@@ -122,7 +123,7 @@ export class Stream {
122
123
  recordStream() {
123
124
  var options = { mimeType: Stream.webmMimeType.mime, videoBitsPerSecond: 1500000 };
124
125
  if (!MediaRecorder.isTypeSupported(options.mimeType)) {
125
- if (this.device.isIos || this.device.isSafari)
126
+ if (store.device.mobileOS == MobileOS.iOS || store.device.browser == Browser.Safari)
126
127
  options.mimeType = Stream.mp4MimeType.mime;
127
128
  }
128
129
  this.recordedChunks = [];
@@ -177,7 +178,7 @@ export class Stream {
177
178
  const context = canvas.getContext('2d');
178
179
  context.drawImage(this.videoElement, 0, 0, canvas.width, canvas.height);
179
180
  canvas.toBlob((frame) => {
180
- if (frame.type === ImageFormat.JPEG && !this.device.isIos) {
181
+ if (frame.type === ImageFormat.JPEG && !store.device.isAppleDevice) {
181
182
  try {
182
183
  addExifInImg(frame, this.stream.getTracks()[0], this.videoSize).then(updatedFrame => resolve(updatedFrame));
183
184
  }
@@ -1,36 +1,3 @@
1
- export const initDevice = () => {
2
- let device = {
3
- isMobile: false,
4
- isAndroid: false,
5
- isLinux: false,
6
- isMac: false,
7
- isWin: false,
8
- isChrome: false,
9
- isFirefox: false,
10
- isSafari: false,
11
- isIos: false,
12
- };
13
- device.isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent);
14
- device.isAndroid = /Android/i.test(navigator.userAgent);
15
- device.isIos = /iPhone|iPad|iPod/i.test(navigator.userAgent);
16
- device.isLinux = /linux/i.test(navigator.platform);
17
- device.isMac = /mac/i.test(navigator.platform);
18
- device.isWin = /win/i.test(navigator.platform);
19
- device.isChrome = /chrome/i.test(navigator.userAgent);
20
- device.isFirefox = /firefox/i.test(navigator.userAgent);
21
- device.isSafari = !device.isChrome ? /safari/i.test(navigator.userAgent) : false;
22
- device.isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent);
23
- device.isAndroid = /Android/i.test(navigator.userAgent);
24
- device.isIos = /iPhone|iPad|iPod/i.test(navigator.userAgent);
25
- if (!device.isIos) {
26
- const isIPad = navigator.userAgent.match(/Mac/) && navigator.maxTouchPoints && navigator.maxTouchPoints > 2;
27
- if (isIPad) {
28
- device.isIos = true;
29
- device.isMobile = true;
30
- }
31
- }
32
- return device;
33
- };
34
1
  export const convertToDataUrl = async (file) => {
35
2
  return new Promise(async (resolve) => {
36
3
  let arr = [];
@@ -16,6 +16,8 @@ const { state, onChange } = createStore({
16
16
  phoneValidation: true,
17
17
  phoneNumber: '',
18
18
  apiBaseUrl: 'https://apiro.id-kyc.com',
19
+ device: null,
20
+ recordingRetryCount: 0,
19
21
  });
20
22
  onChange('environment', value => {
21
23
  state.debug = value == 'QA';
@@ -1,16 +1,22 @@
1
1
  export var FlowSteps;
2
2
  (function (FlowSteps) {
3
- FlowSteps[FlowSteps["MobileRedirect"] = 0] = "MobileRedirect";
4
- FlowSteps[FlowSteps["Landing"] = 1] = "Landing";
5
- FlowSteps[FlowSteps["Agreements"] = 2] = "Agreements";
6
- FlowSteps[FlowSteps["OtpSend"] = 3] = "OtpSend";
7
- FlowSteps[FlowSteps["OtpCheck"] = 4] = "OtpCheck";
8
- FlowSteps[FlowSteps["CiFrontHowTo"] = 5] = "CiFrontHowTo";
9
- FlowSteps[FlowSteps["CiFront"] = 6] = "CiFront";
10
- FlowSteps[FlowSteps["CiBackHowTo"] = 7] = "CiBackHowTo";
11
- FlowSteps[FlowSteps["CiBack"] = 8] = "CiBack";
12
- FlowSteps[FlowSteps["SelfieHowTo"] = 9] = "SelfieHowTo";
13
- FlowSteps[FlowSteps["Selfie"] = 10] = "Selfie";
14
- FlowSteps[FlowSteps["End"] = 11] = "End";
15
- FlowSteps[FlowSteps["CameraError"] = 12] = "CameraError";
3
+ FlowSteps[FlowSteps["MobileRedirect"] = 'mobile-redirect'] = "MobileRedirect";
4
+ FlowSteps[FlowSteps["Landing"] = 'landing'] = "Landing";
5
+ FlowSteps[FlowSteps["Agreements"] = 'agreements'] = "Agreements";
6
+ FlowSteps[FlowSteps["OtpSend"] = 'otp-send'] = "OtpSend";
7
+ FlowSteps[FlowSteps["OtpCheck"] = 'otp-check'] = "OtpCheck";
8
+ FlowSteps[FlowSteps["CiFrontHowTo"] = 'ci-front-how-to'] = "CiFrontHowTo";
9
+ FlowSteps[FlowSteps["CiFront"] = 'ci-front'] = "CiFront";
10
+ FlowSteps[FlowSteps["CiBackHowTo"] = 'ci-back-how-to'] = "CiBackHowTo";
11
+ FlowSteps[FlowSteps["CiBack"] = 'ci-back'] = "CiBack";
12
+ FlowSteps[FlowSteps["SelfieHowTo"] = 'selfie-how-to'] = "SelfieHowTo";
13
+ FlowSteps[FlowSteps["Selfie"] = 'selfie'] = "Selfie";
14
+ FlowSteps[FlowSteps["End"] = 'end'] = "End";
15
+ FlowSteps[FlowSteps["CameraError"] = 'camera-error'] = "CameraError";
16
16
  })(FlowSteps || (FlowSteps = {}));
17
+ export var FlowMoments;
18
+ (function (FlowMoments) {
19
+ FlowMoments[FlowMoments["Initialized"] = 'initialized'] = "Initialized";
20
+ FlowMoments[FlowMoments["Finalized"] = 'finalized'] = "Finalized";
21
+ FlowMoments[FlowMoments["None"] = 'none'] = "None";
22
+ })(FlowMoments || (FlowMoments = {}));
@@ -1 +1,22 @@
1
- export {};
1
+ export var MobileOS;
2
+ (function (MobileOS) {
3
+ MobileOS["Android"] = "android";
4
+ MobileOS["iOS"] = "ios";
5
+ MobileOS["Unknown"] = "unknown";
6
+ MobileOS["WindowsPhone"] = "Windows Phone";
7
+ })(MobileOS || (MobileOS = {}));
8
+ export var DesktopOS;
9
+ (function (DesktopOS) {
10
+ DesktopOS["Linux"] = "linux";
11
+ DesktopOS["MacOS"] = "mac_os";
12
+ DesktopOS["Unix"] = "unix";
13
+ DesktopOS["Unknown"] = "unknown";
14
+ DesktopOS["Windows"] = "windows";
15
+ })(DesktopOS || (DesktopOS = {}));
16
+ export var Browser;
17
+ (function (Browser) {
18
+ Browser["Chrome"] = "chrome";
19
+ Browser["Firefox"] = "firefox";
20
+ Browser["Safari"] = "safari";
21
+ Browser["Unknown"] = "unknown";
22
+ })(Browser || (Browser = {}));
@@ -0,0 +1 @@
1
+ export {};