idmission-web-sdk 2.3.67 → 2.3.68
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/components/common/InvisibleCanvas.d.ts +1 -0
- package/dist/components/common/InvisibleCanvas.d.ts.map +1 -1
- package/dist/components/id_capture/BarcodeReadabilityModelProvider.d.ts +29 -0
- package/dist/components/id_capture/BarcodeReadabilityModelProvider.d.ts.map +1 -0
- package/dist/components/id_capture/CapturedDocuments.d.ts +2 -1
- package/dist/components/id_capture/CapturedDocuments.d.ts.map +1 -1
- package/dist/components/id_capture/FocusModelProvider.d.ts.map +1 -1
- package/dist/components/id_capture/IdCapture.d.ts +1 -1
- package/dist/components/id_capture/IdCapture.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureModelsProvider.d.ts +17 -1
- package/dist/components/id_capture/IdCaptureModelsProvider.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureStateProvider.d.ts +7 -0
- package/dist/components/id_capture/IdCaptureStateProvider.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureSuccess.d.ts.map +1 -1
- package/dist/components/id_capture/IdCaptureWizard.d.ts +1 -0
- package/dist/components/id_capture/IdCaptureWizard.d.ts.map +1 -1
- package/dist/components/submission/SubmissionProvider.d.ts +6 -0
- package/dist/components/submission/SubmissionProvider.d.ts.map +1 -1
- package/dist/components/submission/types.d.ts +2 -0
- package/dist/components/submission/types.d.ts.map +1 -1
- package/dist/lib/models/BarcodeReadability.d.ts +50 -0
- package/dist/lib/models/BarcodeReadability.d.ts.map +1 -0
- package/dist/lib/models/DocumentDetection.d.ts +1 -0
- package/dist/lib/models/DocumentDetection.d.ts.map +1 -1
- package/dist/lib/models/Focus.d.ts.map +1 -1
- package/dist/lib/models/defaults/BarcodeReadability.d.ts +2 -0
- package/dist/lib/models/defaults/BarcodeReadability.d.ts.map +1 -0
- package/dist/lib/models/defaults/index.d.ts +7 -0
- package/dist/lib/models/defaults/index.d.ts.map +1 -1
- package/dist/lib/models/preloadModels.d.ts +9 -5
- package/dist/lib/models/preloadModels.d.ts.map +1 -1
- package/dist/lib/utils/cropping.d.ts +3 -1
- package/dist/lib/utils/cropping.d.ts.map +1 -1
- package/dist/sdk2.cjs.development.js +1955 -1602
- package/dist/sdk2.cjs.development.js.map +1 -1
- package/dist/sdk2.cjs.production.js +1 -1
- package/dist/sdk2.cjs.production.js.map +1 -1
- package/dist/sdk2.esm.js +1956 -1603
- package/dist/sdk2.esm.js.map +1 -1
- package/dist/sdk2.umd.development.js +1608 -1255
- package/dist/sdk2.umd.development.js.map +1 -1
- package/dist/sdk2.umd.production.js +1 -1
- package/dist/sdk2.umd.production.js.map +1 -1
- package/dist/version.d.ts +1 -1
- package/package.json +1 -1
package/dist/sdk2.esm.js
CHANGED
|
@@ -7,7 +7,7 @@ import { createPortal } from 'react-dom';
|
|
|
7
7
|
import { useTranslation, initReactI18next } from 'react-i18next';
|
|
8
8
|
import { Upload } from 'tus-js-client';
|
|
9
9
|
import SparkMD5 from 'spark-md5';
|
|
10
|
-
import { ImageSegmenter, FilesetResolver, ImageClassifier, FaceDetector
|
|
10
|
+
import { ImageSegmenter, FilesetResolver, ObjectDetector, ImageClassifier, FaceDetector } from '@mediapipe/tasks-vision';
|
|
11
11
|
import { useStore, createStore, create } from 'zustand';
|
|
12
12
|
import LanguageDetector from 'i18next-browser-languagedetector';
|
|
13
13
|
import i18n from 'i18next';
|
|
@@ -205,7 +205,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
205
205
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
206
206
|
};
|
|
207
207
|
|
|
208
|
-
var webSdkVersion = '2.3.
|
|
208
|
+
var webSdkVersion = '2.3.68';
|
|
209
209
|
|
|
210
210
|
function getPlatform() {
|
|
211
211
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
@@ -466,27 +466,27 @@ var GuidanceMessageContainer = function GuidanceMessageContainer(props) {
|
|
|
466
466
|
if (!portalLocation) return element;
|
|
467
467
|
return /*#__PURE__*/createPortal(element, portalLocation);
|
|
468
468
|
};
|
|
469
|
-
var GuidanceMessage = styled.div(templateObject_2$
|
|
469
|
+
var GuidanceMessage = styled.div(templateObject_2$J || (templateObject_2$J = __makeTemplateObject(["\n margin-left: auto;\n margin-right: auto;\n background: ", ";\n color: ", ";\n border-radius: 8px;\n z-index: 10001;\n padding: 16px 24px;\n font-size: 18px;\n font-weight: bold;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"], ["\n margin-left: auto;\n margin-right: auto;\n background: ", ";\n color: ", ";\n border-radius: 8px;\n z-index: 10001;\n padding: 16px 24px;\n font-size: 18px;\n font-weight: bold;\n box-shadow:\n 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n"])), function (props) {
|
|
470
470
|
var _a, _b, _c, _d, _e, _f;
|
|
471
471
|
return (_f = (_a = props.$background) !== null && _a !== void 0 ? _a : (_e = (_c = (_b = props.theme) === null || _b === void 0 ? void 0 : _b.guidanceMessages) === null || _c === void 0 ? void 0 : _c[(_d = props.$variant) !== null && _d !== void 0 ? _d : 'default']) === null || _e === void 0 ? void 0 : _e.backgroundColor) !== null && _f !== void 0 ? _f : 'white';
|
|
472
472
|
}, function (props) {
|
|
473
473
|
var _a, _b, _c, _d, _e, _f;
|
|
474
474
|
return (_f = (_a = props.$textColor) !== null && _a !== void 0 ? _a : (_e = (_c = (_b = props.theme) === null || _b === void 0 ? void 0 : _b.guidanceMessages) === null || _c === void 0 ? void 0 : _c[(_d = props.$variant) !== null && _d !== void 0 ? _d : 'default']) === null || _e === void 0 ? void 0 : _e.textColor) !== null && _f !== void 0 ? _f : 'black';
|
|
475
475
|
});
|
|
476
|
-
var templateObject_1$Q, templateObject_2$
|
|
476
|
+
var templateObject_1$Q, templateObject_2$J;
|
|
477
477
|
|
|
478
478
|
var wavesAnimation = keyframes(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n 0% {\n opacity: 0;\n transform: scale3d(1, 1, 1);\n }\n 80% {\n opacity: 1;\n }\n 100% {\n transform: scale3d(2, 2, 1);\n opacity: 0;\n }\n"], ["\n 0% {\n opacity: 0;\n transform: scale3d(1, 1, 1);\n }\n 80% {\n opacity: 1;\n }\n 100% {\n transform: scale3d(2, 2, 1);\n opacity: 0;\n }\n"])));
|
|
479
|
-
var progressBarAnimation = keyframes(templateObject_2$
|
|
479
|
+
var progressBarAnimation = keyframes(templateObject_2$I || (templateObject_2$I = __makeTemplateObject(["\n 0% {\n width: 0;\n }\n 100% {\n width: 100%;\n }\n"], ["\n 0% {\n width: 0;\n }\n 100% {\n width: 100%;\n }\n"])));
|
|
480
480
|
var dualRingSpinnerAnimation = keyframes(templateObject_3$u || (templateObject_3$u = __makeTemplateObject(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"], ["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"])));
|
|
481
481
|
var progressBorderAnimation = keyframes(templateObject_4$n || (templateObject_4$n = __makeTemplateObject(["\n to {\n stroke-dashoffset: 0;\n }\n"], ["\n to {\n stroke-dashoffset: 0;\n }\n"])));
|
|
482
|
-
var templateObject_1$P, templateObject_2$
|
|
482
|
+
var templateObject_1$P, templateObject_2$I, templateObject_3$u, templateObject_4$n;
|
|
483
483
|
|
|
484
484
|
var OverlayContainer = styled.div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n\n display: flex;\n flex-direction: column;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n background: ", ";\n ", "\n\n z-index: 10000;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n\n display: flex;\n flex-direction: column;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n background: ", ";\n ", "\n\n z-index: 10000;\n"])), function (props) {
|
|
485
485
|
return props.theme.background ? "".concat(props.theme.background) : "white";
|
|
486
486
|
}, function (props) {
|
|
487
487
|
return props.theme.textColor ? "color: ".concat(props.theme.textColor, ";") : "";
|
|
488
488
|
});
|
|
489
|
-
var OverlayInner$2 = styled.div(templateObject_2$
|
|
489
|
+
var OverlayInner$2 = styled.div(templateObject_2$H || (templateObject_2$H = __makeTemplateObject(["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n width: 100%;\n height: 100%;\n ", "\n"], ["\n text-align: ", ";\n display: flex;\n flex-direction: column;\n flex-wrap: nowrap;\n width: 100%;\n height: 100%;\n ", "\n"])), function (props) {
|
|
490
490
|
var _a;
|
|
491
491
|
return (_a = props.theme.textAlign) !== null && _a !== void 0 ? _a : 'center';
|
|
492
492
|
}, function (props) {
|
|
@@ -534,7 +534,7 @@ var LoadingOverlayLoadingListItem = styled.li(templateObject_19 || (templateObje
|
|
|
534
534
|
var LoadingOverlayProgressContainer = styled.div(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n"])));
|
|
535
535
|
var LoadingOverlayCustomLoadingGraphic = styled.img(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n transform-style: preserve-3d;\n"], ["\n transform-style: preserve-3d;\n"])));
|
|
536
536
|
var LoadingOverlayContinueButtonContainer = styled.div(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
537
|
-
var templateObject_1$O, templateObject_2$
|
|
537
|
+
var templateObject_1$O, templateObject_2$H, templateObject_3$t, templateObject_4$m, templateObject_5$e, templateObject_6$9, templateObject_7$5, templateObject_8$4, templateObject_9$2, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22;
|
|
538
538
|
|
|
539
539
|
var GeolocationAccessDeniedOverlay = function GeolocationAccessDeniedOverlay(_a) {
|
|
540
540
|
var accessBlockedImageUrl = _a.accessBlockedImageUrl;
|
|
@@ -1103,6 +1103,11 @@ var SubmissionContext = /*#__PURE__*/createContext({
|
|
|
1103
1103
|
idFrontImage: null,
|
|
1104
1104
|
idBackImage: null,
|
|
1105
1105
|
passportImage: null,
|
|
1106
|
+
idFrontIrImage: null,
|
|
1107
|
+
idBackIrImage: null,
|
|
1108
|
+
idFrontUvImage: null,
|
|
1109
|
+
idBackUvImage: null,
|
|
1110
|
+
idBarcodeImage: null,
|
|
1106
1111
|
selfieImage: null,
|
|
1107
1112
|
signatureData: null,
|
|
1108
1113
|
signatureVideoUrl: null,
|
|
@@ -1133,6 +1138,9 @@ var SubmissionContext = /*#__PURE__*/createContext({
|
|
|
1133
1138
|
setIdBackUvImage: function setIdBackUvImage() {
|
|
1134
1139
|
return null;
|
|
1135
1140
|
},
|
|
1141
|
+
setIdBarcodeImage: function setIdBarcodeImage() {
|
|
1142
|
+
return null;
|
|
1143
|
+
},
|
|
1136
1144
|
setSelfieImage: function setSelfieImage() {
|
|
1137
1145
|
return null;
|
|
1138
1146
|
},
|
|
@@ -1300,53 +1308,56 @@ var SubmissionProvider = function SubmissionProvider(_a) {
|
|
|
1300
1308
|
passportImage = _13[0],
|
|
1301
1309
|
setPassportImage = _13[1];
|
|
1302
1310
|
var _14 = useState(null),
|
|
1303
|
-
|
|
1304
|
-
|
|
1311
|
+
idBarcodeImage = _14[0],
|
|
1312
|
+
setIdBarcodeImage = _14[1];
|
|
1305
1313
|
var _15 = useState(null),
|
|
1306
|
-
|
|
1307
|
-
|
|
1314
|
+
selfieImage = _15[0],
|
|
1315
|
+
setSelfieImage = _15[1];
|
|
1308
1316
|
var _16 = useState(null),
|
|
1309
|
-
|
|
1310
|
-
|
|
1317
|
+
signatureData = _16[0],
|
|
1318
|
+
setSignatureData = _16[1];
|
|
1311
1319
|
var _17 = useState(null),
|
|
1312
|
-
|
|
1313
|
-
|
|
1320
|
+
signatureVideoUrl = _17[0],
|
|
1321
|
+
setSignatureVideoUrl = _17[1];
|
|
1314
1322
|
var _18 = useState(null),
|
|
1315
|
-
|
|
1316
|
-
|
|
1323
|
+
idCaptureVideoUrl = _18[0],
|
|
1324
|
+
setIdCaptureVideoUrl = _18[1];
|
|
1317
1325
|
var _19 = useState(null),
|
|
1318
|
-
|
|
1319
|
-
|
|
1326
|
+
idCaptureVideoIdFrontImage = _19[0],
|
|
1327
|
+
setIdCaptureVideoIdFrontImage = _19[1];
|
|
1320
1328
|
var _20 = useState(null),
|
|
1321
|
-
|
|
1322
|
-
|
|
1329
|
+
idCaptureVideoIdBackImage = _20[0],
|
|
1330
|
+
setIdCaptureVideoIdBackImage = _20[1];
|
|
1323
1331
|
var _21 = useState(null),
|
|
1324
|
-
|
|
1325
|
-
|
|
1332
|
+
idCaptureVideoAudioUrl = _21[0],
|
|
1333
|
+
setIdCaptureVideoAudioUrl = _21[1];
|
|
1326
1334
|
var _22 = useState(null),
|
|
1327
|
-
|
|
1328
|
-
|
|
1335
|
+
idCaptureVideoAudioStartsAt = _22[0],
|
|
1336
|
+
setIdCaptureVideoAudioStartsAt = _22[1];
|
|
1329
1337
|
var _23 = useState(null),
|
|
1330
|
-
|
|
1331
|
-
|
|
1338
|
+
expectedAudioText = _23[0],
|
|
1339
|
+
setExpectedAudioText = _23[1];
|
|
1332
1340
|
var _24 = useState(null),
|
|
1333
|
-
|
|
1334
|
-
|
|
1335
|
-
var _25 = useState(
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
var _26 = useState(
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
var _27 = useState(
|
|
1342
|
-
|
|
1343
|
-
|
|
1341
|
+
additionalDocuments = _24[0],
|
|
1342
|
+
setAdditionalDocuments = _24[1];
|
|
1343
|
+
var _25 = useState(null),
|
|
1344
|
+
geolocationResult = _25[0],
|
|
1345
|
+
setGeolocationResult = _25[1];
|
|
1346
|
+
var _26 = useState(0),
|
|
1347
|
+
geolocationAttempts = _26[0],
|
|
1348
|
+
setGeolocationAttempts = _26[1];
|
|
1349
|
+
var _27 = useState(false),
|
|
1350
|
+
geolocationBlocked = _27[0],
|
|
1351
|
+
setGeolocationBlocked = _27[1];
|
|
1344
1352
|
var _28 = useState([]),
|
|
1345
|
-
|
|
1346
|
-
|
|
1353
|
+
idFrontCaptureAttempts = _28[0],
|
|
1354
|
+
setIdFrontCaptureAttempts = _28[1];
|
|
1347
1355
|
var _29 = useState([]),
|
|
1348
|
-
|
|
1349
|
-
|
|
1356
|
+
idBackCaptureAttempts = _29[0],
|
|
1357
|
+
setIdBackCaptureAttempts = _29[1];
|
|
1358
|
+
var _30 = useState([]),
|
|
1359
|
+
selfieCaptureAttempts = _30[0],
|
|
1360
|
+
setSelfieCaptureAttempts = _30[1];
|
|
1350
1361
|
var logIdFrontCaptureAttempt = useCallback(function (attempt) {
|
|
1351
1362
|
setIdFrontCaptureAttempts(function (attempts) {
|
|
1352
1363
|
return __spreadArray(__spreadArray([], attempts, true), [attempt], false);
|
|
@@ -1472,6 +1483,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
|
|
|
1472
1483
|
idFrontImage: idFrontImage,
|
|
1473
1484
|
idBackImage: idBackImage,
|
|
1474
1485
|
passportImage: passportImage,
|
|
1486
|
+
idBarcodeImage: idBarcodeImage,
|
|
1475
1487
|
selfieImage: selfieImage
|
|
1476
1488
|
};
|
|
1477
1489
|
_a = signatureVideoUrl;
|
|
@@ -1577,6 +1589,9 @@ var SubmissionProvider = function SubmissionProvider(_a) {
|
|
|
1577
1589
|
if (documents.passportImage) {
|
|
1578
1590
|
submissionRequest.customerData.idData.idImageFront = documents.passportImage;
|
|
1579
1591
|
}
|
|
1592
|
+
if (documents.idBarcodeImage) {
|
|
1593
|
+
submissionRequest.customerData.idData.idBarcodeImage = documents.idBarcodeImage;
|
|
1594
|
+
}
|
|
1580
1595
|
if (documents.idFrontIrImage) {
|
|
1581
1596
|
submissionRequest.customerData.idData.idFrontIrImage = documents.idFrontIrImage;
|
|
1582
1597
|
}
|
|
@@ -1665,7 +1680,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
|
|
|
1665
1680
|
}
|
|
1666
1681
|
});
|
|
1667
1682
|
});
|
|
1668
|
-
}, [additionalDocuments, bypassAgeValidation, bypassNameMatching, cardData, clientRequestID, companyId, customerDataMatchConfig, deduplicationEnabled, deduplicationSynchronous, documentServiceUrl, enrollmentId, expectedAudioText, geolocationResult, idBackCaptureAttempts, idBackImage, idBackImageRequired, idBackIrImage, idBackUvImage, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idCardForFaceMatch, idData, idFrontCaptureAttempts, idFrontImage, idFrontIrImage, idFrontUvImage, idImageResolutionCheck, jobId, manualReviewRequired, needImmediateResponse, passportImage, personalData, selfieCaptureAttempts, selfieImage, signatureData, signatureVideoUrl, uploadDocument, verifyIdWithExternalDatabases, webhooksClientTraceId, webhooksEnabled, webhooksFireOnReview, webhooksFireOnReviewURL, webhooksSendInputImages, webhooksSendProcessedImages, webhooksStripSpecialCharacters, webhooksURL]);
|
|
1683
|
+
}, [additionalDocuments, bypassAgeValidation, bypassNameMatching, cardData, clientRequestID, companyId, customerDataMatchConfig, deduplicationEnabled, deduplicationSynchronous, documentServiceUrl, enrollmentId, expectedAudioText, geolocationResult, idBackCaptureAttempts, idBackImage, idBackImageRequired, idBackIrImage, idBackUvImage, idBarcodeImage, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idCardForFaceMatch, idData, idFrontCaptureAttempts, idFrontImage, idFrontIrImage, idFrontUvImage, idImageResolutionCheck, jobId, manualReviewRequired, needImmediateResponse, passportImage, personalData, selfieCaptureAttempts, selfieImage, signatureData, signatureVideoUrl, uploadDocument, verifyIdWithExternalDatabases, webhooksClientTraceId, webhooksEnabled, webhooksFireOnReview, webhooksFireOnReviewURL, webhooksSendInputImages, webhooksSendProcessedImages, webhooksStripSpecialCharacters, webhooksURL]);
|
|
1669
1684
|
var defaultOnSubmit = useCallback(function () {
|
|
1670
1685
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
1671
1686
|
var submissionResponse_1, payload, host, endpoint, response, statusMessage, submissionResponse_2, e_1, err;
|
|
@@ -1943,6 +1958,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
|
|
|
1943
1958
|
idFrontUvImage: idFrontUvImage,
|
|
1944
1959
|
idBackUvImage: idBackUvImage,
|
|
1945
1960
|
passportImage: passportImage,
|
|
1961
|
+
idBarcodeImage: idBarcodeImage,
|
|
1946
1962
|
selfieImage: selfieImage,
|
|
1947
1963
|
signatureData: signatureData,
|
|
1948
1964
|
signatureVideoUrl: signatureVideoUrl,
|
|
@@ -1959,6 +1975,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
|
|
|
1959
1975
|
setIdBackIrImage: setIdBackIrImage,
|
|
1960
1976
|
setIdFrontUvImage: setIdFrontUvImage,
|
|
1961
1977
|
setIdBackUvImage: setIdBackUvImage,
|
|
1978
|
+
setIdBarcodeImage: setIdBarcodeImage,
|
|
1962
1979
|
setSelfieImage: setSelfieImage,
|
|
1963
1980
|
setSignatureData: setSignatureData,
|
|
1964
1981
|
setSignatureVideoUrl: setSignatureVideoUrl,
|
|
@@ -1977,7 +1994,7 @@ var SubmissionProvider = function SubmissionProvider(_a) {
|
|
|
1977
1994
|
checkLiveness: checkLiveness,
|
|
1978
1995
|
retryLocationAccess: retryLocationAccess
|
|
1979
1996
|
};
|
|
1980
|
-
}, [additionalDocuments, checkLiveness, environment, idBackImage, idBackIrImage, idBackUvImage, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idFrontImage, idFrontIrImage, idFrontUvImage, livenessCheckRequest, logIdBackCaptureAttempt, logIdFrontCaptureAttempt, logSelfieCaptureAttempt, passportImage, retryLocationAccess, selfieImage, signatureData, signatureVideoUrl, submissionError, submissionRequest, submissionResponse, submissionStatus, submit, uploadDocument]);
|
|
1997
|
+
}, [additionalDocuments, checkLiveness, environment, idBackImage, idBackIrImage, idBackUvImage, idCaptureVideoAudioStartsAt, idCaptureVideoAudioUrl, idCaptureVideoIdBackImage, idCaptureVideoIdFrontImage, idCaptureVideoUrl, idFrontImage, idFrontIrImage, idFrontUvImage, livenessCheckRequest, logIdBackCaptureAttempt, logIdFrontCaptureAttempt, logSelfieCaptureAttempt, idBarcodeImage, passportImage, retryLocationAccess, selfieImage, signatureData, signatureVideoUrl, submissionError, submissionRequest, submissionResponse, submissionStatus, submit, uploadDocument]);
|
|
1981
1998
|
return /*#__PURE__*/React__default.createElement(SubmissionContext.Provider, {
|
|
1982
1999
|
value: value
|
|
1983
2000
|
}, geolocationRequired && geolocationBlocked ? ( /*#__PURE__*/React__default.createElement(GeolocationAccessDeniedOverlay, null)) : children, submissionError && ( /*#__PURE__*/React__default.createElement(SubmissionErrorOverlay, {
|
|
@@ -2171,97 +2188,6 @@ function preloadVisionRuntime() {
|
|
|
2171
2188
|
});
|
|
2172
2189
|
}
|
|
2173
2190
|
|
|
2174
|
-
function getFrameDimensions(frame) {
|
|
2175
|
-
var frameWidth = frame.width,
|
|
2176
|
-
frameHeight = frame.height;
|
|
2177
|
-
if (frame instanceof HTMLImageElement) {
|
|
2178
|
-
frameWidth = frame.naturalWidth;
|
|
2179
|
-
frameHeight = frame.naturalHeight;
|
|
2180
|
-
}
|
|
2181
|
-
if (frame instanceof HTMLVideoElement) {
|
|
2182
|
-
frameWidth = frame.videoWidth;
|
|
2183
|
-
frameHeight = frame.videoHeight;
|
|
2184
|
-
}
|
|
2185
|
-
return [frameWidth, frameHeight];
|
|
2186
|
-
}
|
|
2187
|
-
|
|
2188
|
-
var InvisibleCanvas = styled.canvas(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
|
|
2189
|
-
function drawToCanvas(canvas, frame, width, height) {
|
|
2190
|
-
if (!canvas) return;
|
|
2191
|
-
var ctx = canvas.getContext('2d');
|
|
2192
|
-
if (!ctx) return;
|
|
2193
|
-
if (!width || !height) {
|
|
2194
|
-
var _a = getFrameDimensions(frame),
|
|
2195
|
-
frameWidth = _a[0],
|
|
2196
|
-
frameHeight = _a[1];
|
|
2197
|
-
width || (width = frameWidth);
|
|
2198
|
-
height || (height = frameHeight);
|
|
2199
|
-
}
|
|
2200
|
-
canvas.width = width;
|
|
2201
|
-
canvas.height = height;
|
|
2202
|
-
ctx.drawImage(frame, 0, 0, width, height);
|
|
2203
|
-
}
|
|
2204
|
-
function clearCanvas(canvas) {
|
|
2205
|
-
var _a;
|
|
2206
|
-
(_a = canvas === null || canvas === void 0 ? void 0 : canvas.getContext('2d')) === null || _a === void 0 ? void 0 : _a.clearRect(0, 0, canvas === null || canvas === void 0 ? void 0 : canvas.width, canvas === null || canvas === void 0 ? void 0 : canvas.height);
|
|
2207
|
-
}
|
|
2208
|
-
var templateObject_1$N;
|
|
2209
|
-
|
|
2210
|
-
function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
|
|
2211
|
-
var _a;
|
|
2212
|
-
if (quality === void 0) {
|
|
2213
|
-
quality = 0.92;
|
|
2214
|
-
}
|
|
2215
|
-
if (!rawCanvas || !cropCanvas || !resizeCanvas) return '';
|
|
2216
|
-
var rawCtx = rawCanvas.getContext('2d');
|
|
2217
|
-
var cropCtx = cropCanvas.getContext('2d');
|
|
2218
|
-
var resizeCtx = resizeCanvas.getContext('2d');
|
|
2219
|
-
if (!rawCtx || !cropCtx || !resizeCtx) throw new Error('could not get 2d context');
|
|
2220
|
-
rawCanvas.width = frame.width;
|
|
2221
|
-
rawCanvas.height = frame.height;
|
|
2222
|
-
rawCtx.putImageData(frame, 0, 0);
|
|
2223
|
-
if (frame.height > frame.width) {
|
|
2224
|
-
cropCanvas.width = frame.width;
|
|
2225
|
-
cropCanvas.height = frame.height;
|
|
2226
|
-
cropCtx.drawImage(rawCanvas, 0, 0, cropCanvas.width, cropCanvas.height);
|
|
2227
|
-
} else {
|
|
2228
|
-
var _b = (_a = face === null || face === void 0 ? void 0 : face.box) !== null && _a !== void 0 ? _a : {
|
|
2229
|
-
xMin: 0,
|
|
2230
|
-
width: frame.width
|
|
2231
|
-
},
|
|
2232
|
-
xMin = _b.xMin,
|
|
2233
|
-
width = _b.width;
|
|
2234
|
-
var desiredWidth = frame.height * 0.6;
|
|
2235
|
-
var faceCenterX = xMin + width / 2;
|
|
2236
|
-
var xPos = Math.max(0, faceCenterX - desiredWidth / 2);
|
|
2237
|
-
cropCanvas.width = desiredWidth;
|
|
2238
|
-
cropCanvas.height = frame.height;
|
|
2239
|
-
cropCtx.drawImage(rawCanvas, xPos, 0, cropCanvas.width, cropCanvas.height, 0, 0, cropCanvas.width, cropCanvas.height);
|
|
2240
|
-
}
|
|
2241
|
-
resizeCanvas.height = maxHeight !== null && maxHeight !== void 0 ? maxHeight : cropCanvas.height;
|
|
2242
|
-
resizeCanvas.width = cropCanvas.width * (resizeCanvas.height / cropCanvas.height);
|
|
2243
|
-
resizeCtx === null || resizeCtx === void 0 ? void 0 : resizeCtx.drawImage(cropCanvas, 0, 0, resizeCanvas.width, resizeCanvas.height);
|
|
2244
|
-
var dataURL = resizeCanvas.toDataURL('image/jpeg', quality);
|
|
2245
|
-
log('cropToShoulders size', new TextEncoder().encode(dataURL).length);
|
|
2246
|
-
clearCanvas(rawCanvas);
|
|
2247
|
-
clearCanvas(cropCanvas);
|
|
2248
|
-
clearCanvas(resizeCanvas);
|
|
2249
|
-
return dataURL;
|
|
2250
|
-
}
|
|
2251
|
-
function cropToDetectedObjectBox(frame, box, canvas) {
|
|
2252
|
-
canvas || (canvas = document.createElement('canvas'));
|
|
2253
|
-
var ctx = canvas.getContext('2d');
|
|
2254
|
-
if (!ctx) throw new Error('could not get 2d context');
|
|
2255
|
-
var xMin = box.xMin,
|
|
2256
|
-
yMin = box.yMin,
|
|
2257
|
-
width = box.width,
|
|
2258
|
-
height = box.height;
|
|
2259
|
-
canvas.width = width;
|
|
2260
|
-
canvas.height = height;
|
|
2261
|
-
ctx.drawImage(frame, xMin, yMin, width, height, 0, 0, width, height);
|
|
2262
|
-
return canvas;
|
|
2263
|
-
}
|
|
2264
|
-
|
|
2265
2191
|
var defaultImageSegmenterModelPath = 'https://websdk-cdn-dev.idmission.com/assets/models/selfiesegmenter20240524/selfie_segmenter.tflite';
|
|
2266
2192
|
var imageSegmenterModelSizeInBytes = 256440.32;
|
|
2267
2193
|
// The idea here is that we globally set a cache key based on the time at page load. That way our built-in speed test
|
|
@@ -2391,6 +2317,192 @@ function giveUpAfter(maxTime) {
|
|
|
2391
2317
|
});
|
|
2392
2318
|
}
|
|
2393
2319
|
|
|
2320
|
+
var DEFAULT_CDN_URL = 'https://websdk-cdn-dev.idmission.com/assets';
|
|
2321
|
+
|
|
2322
|
+
var defaultDocumentDetectorModelPath = "".concat(DEFAULT_CDN_URL, "/models/DocumentDetector/DocumentDetector-20250815_115859.tflite");
|
|
2323
|
+
|
|
2324
|
+
var defaultFocusModelPath = "".concat(DEFAULT_CDN_URL, "/models/Focus/Focus-20241008_102708.tflite");
|
|
2325
|
+
|
|
2326
|
+
var defaultFaceDetectorModelPath = "".concat(DEFAULT_CDN_URL, "/models/blazeface20240207/blaze_face_short_range.tflite");
|
|
2327
|
+
|
|
2328
|
+
var defaultBarcodeReadabilityModelPath = "".concat(DEFAULT_CDN_URL, "/models/BarcodeReadability/BarcodeReadability-20250815_120417.tflite");
|
|
2329
|
+
|
|
2330
|
+
var defaultModelPaths = {
|
|
2331
|
+
documentDetector: defaultDocumentDetectorModelPath,
|
|
2332
|
+
focus: defaultFocusModelPath,
|
|
2333
|
+
faceDetection: defaultFaceDetectorModelPath,
|
|
2334
|
+
barcodeReadability: defaultBarcodeReadabilityModelPath
|
|
2335
|
+
};
|
|
2336
|
+
|
|
2337
|
+
var preloadModels = function preloadModels(_a) {
|
|
2338
|
+
return __awaiter(void 0, [_a], void 0, function (_b) {
|
|
2339
|
+
var preloadTasks;
|
|
2340
|
+
var _c = _b.documentDetectionModel,
|
|
2341
|
+
documentDetectionModel = _c === void 0 ? true : _c,
|
|
2342
|
+
_d = _b.focusModel,
|
|
2343
|
+
focusModel = _d === void 0 ? true : _d,
|
|
2344
|
+
_e = _b.faceDetectionModel,
|
|
2345
|
+
faceDetectionModel = _e === void 0 ? true : _e,
|
|
2346
|
+
_f = _b.barcodeReadabilityModel,
|
|
2347
|
+
barcodeReadabilityModel = _f === void 0 ? true : _f;
|
|
2348
|
+
return __generator(this, function (_g) {
|
|
2349
|
+
switch (_g.label) {
|
|
2350
|
+
case 0:
|
|
2351
|
+
return [4 /*yield*/, probeModelCapabilities()];
|
|
2352
|
+
case 1:
|
|
2353
|
+
_g.sent();
|
|
2354
|
+
preloadTasks = [];
|
|
2355
|
+
if (documentDetectionModel) {
|
|
2356
|
+
preloadTasks.push(preloadDocumentDetectorDependencies);
|
|
2357
|
+
}
|
|
2358
|
+
if (focusModel) {
|
|
2359
|
+
preloadTasks.push(preloadFocusModelDependencies);
|
|
2360
|
+
}
|
|
2361
|
+
if (faceDetectionModel) {
|
|
2362
|
+
preloadTasks.push(preloadFaceDetectorDependencies);
|
|
2363
|
+
}
|
|
2364
|
+
if (barcodeReadabilityModel) {
|
|
2365
|
+
preloadTasks.push(preloadBarcodeReadabilityModelDependencies);
|
|
2366
|
+
}
|
|
2367
|
+
return [4 /*yield*/, Promise.all(preloadTasks)];
|
|
2368
|
+
case 2:
|
|
2369
|
+
_g.sent();
|
|
2370
|
+
return [2 /*return*/];
|
|
2371
|
+
}
|
|
2372
|
+
});
|
|
2373
|
+
});
|
|
2374
|
+
};
|
|
2375
|
+
var progressByUrl = {};
|
|
2376
|
+
var progressByUseCase = {
|
|
2377
|
+
visionRuntime: {
|
|
2378
|
+
loaded: 0,
|
|
2379
|
+
total: 0
|
|
2380
|
+
},
|
|
2381
|
+
documentDetector: {
|
|
2382
|
+
loaded: 0,
|
|
2383
|
+
total: 0
|
|
2384
|
+
},
|
|
2385
|
+
focus: {
|
|
2386
|
+
loaded: 0,
|
|
2387
|
+
total: 0
|
|
2388
|
+
},
|
|
2389
|
+
faceDetection: {
|
|
2390
|
+
loaded: 0,
|
|
2391
|
+
total: 0
|
|
2392
|
+
},
|
|
2393
|
+
barcodeReadability: {
|
|
2394
|
+
loaded: 0,
|
|
2395
|
+
total: 0
|
|
2396
|
+
}
|
|
2397
|
+
};
|
|
2398
|
+
function preloadDependency(url) {
|
|
2399
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
2400
|
+
return __generator(this, function (_a) {
|
|
2401
|
+
return [2 /*return*/, new Promise(function (resolve, reject) {
|
|
2402
|
+
var req = new XMLHttpRequest();
|
|
2403
|
+
req.addEventListener('progress', function (event) {
|
|
2404
|
+
if (!event.lengthComputable) return;
|
|
2405
|
+
progressByUrl[url] = event;
|
|
2406
|
+
document.dispatchEvent(new CustomEvent('idmission.preloadProgress', {
|
|
2407
|
+
detail: {
|
|
2408
|
+
url: url,
|
|
2409
|
+
loaded: event.loaded,
|
|
2410
|
+
total: event.total
|
|
2411
|
+
}
|
|
2412
|
+
}));
|
|
2413
|
+
});
|
|
2414
|
+
req.addEventListener('loadend', function () {
|
|
2415
|
+
resolve(req.readyState === 4 && req.status === 200);
|
|
2416
|
+
});
|
|
2417
|
+
req.addEventListener('error', reject);
|
|
2418
|
+
req.open('GET', url, true);
|
|
2419
|
+
req.send();
|
|
2420
|
+
})];
|
|
2421
|
+
});
|
|
2422
|
+
});
|
|
2423
|
+
}
|
|
2424
|
+
var modelsPreloading = {
|
|
2425
|
+
documentDetector: false,
|
|
2426
|
+
focus: false,
|
|
2427
|
+
faceDetection: false,
|
|
2428
|
+
barcodeReadability: false
|
|
2429
|
+
};
|
|
2430
|
+
var preloadDocumentDetectorDependencies = function preloadDocumentDetectorDependencies() {
|
|
2431
|
+
return preloadModelDependencies('documentDetector');
|
|
2432
|
+
};
|
|
2433
|
+
var preloadFocusModelDependencies = function preloadFocusModelDependencies() {
|
|
2434
|
+
return preloadModelDependencies('focus');
|
|
2435
|
+
};
|
|
2436
|
+
var preloadFaceDetectorDependencies = function preloadFaceDetectorDependencies() {
|
|
2437
|
+
return preloadModelDependencies('faceDetection');
|
|
2438
|
+
};
|
|
2439
|
+
var preloadBarcodeReadabilityModelDependencies = function preloadBarcodeReadabilityModelDependencies() {
|
|
2440
|
+
return preloadModelDependencies('barcodeReadability');
|
|
2441
|
+
};
|
|
2442
|
+
function preloadModelDependencies(model) {
|
|
2443
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
2444
|
+
function handleModelDownloadProgress(event) {
|
|
2445
|
+
var detail = event.detail;
|
|
2446
|
+
if (!dependencies.includes(detail.url)) return;
|
|
2447
|
+
progressByUseCase[model] = sumUpProgressForDependencies(dependencies);
|
|
2448
|
+
document.dispatchEvent(new CustomEvent("idmission.preloadProgress.".concat(model), {
|
|
2449
|
+
detail: progressByUseCase[model]
|
|
2450
|
+
}));
|
|
2451
|
+
}
|
|
2452
|
+
var dependencies;
|
|
2453
|
+
return __generator(this, function (_a) {
|
|
2454
|
+
switch (_a.label) {
|
|
2455
|
+
case 0:
|
|
2456
|
+
if (modelsPreloading[model]) return [2 /*return*/, new Promise(function (resolve) {
|
|
2457
|
+
var i = setInterval(function () {
|
|
2458
|
+
if (!modelsPreloading[model]) {
|
|
2459
|
+
clearInterval(i);
|
|
2460
|
+
resolve();
|
|
2461
|
+
}
|
|
2462
|
+
}, 100);
|
|
2463
|
+
})];
|
|
2464
|
+
modelsPreloading[model] = true;
|
|
2465
|
+
return [4 /*yield*/, probeModelCapabilities()];
|
|
2466
|
+
case 1:
|
|
2467
|
+
_a.sent();
|
|
2468
|
+
if (modelCapabilities.delegate === 'NONE') {
|
|
2469
|
+
throw new Error("No available delegate for ".concat(model, " model."));
|
|
2470
|
+
}
|
|
2471
|
+
dependencies = [defaultModelPaths[model]];
|
|
2472
|
+
document.addEventListener('idmission.preloadProgress', handleModelDownloadProgress);
|
|
2473
|
+
_a.label = 2;
|
|
2474
|
+
case 2:
|
|
2475
|
+
_a.trys.push([2,, 4, 5]);
|
|
2476
|
+
return [4 /*yield*/, Promise.all(dependencies.map(preloadDependency))];
|
|
2477
|
+
case 3:
|
|
2478
|
+
_a.sent();
|
|
2479
|
+
return [3 /*break*/, 5];
|
|
2480
|
+
case 4:
|
|
2481
|
+
document.removeEventListener('idmission.preloadProgress', handleModelDownloadProgress);
|
|
2482
|
+
modelsPreloading[model] = false;
|
|
2483
|
+
return [7 /*endfinally*/];
|
|
2484
|
+
case 5:
|
|
2485
|
+
return [2 /*return*/];
|
|
2486
|
+
}
|
|
2487
|
+
});
|
|
2488
|
+
});
|
|
2489
|
+
}
|
|
2490
|
+
function progressToPercentage(progress) {
|
|
2491
|
+
return progress.total > 0 ? Math.round(100.0 * progress.loaded / progress.total) : 0;
|
|
2492
|
+
}
|
|
2493
|
+
function sumUpProgressForDependencies(dependencies) {
|
|
2494
|
+
return dependencies.reduce(function (result, dependency) {
|
|
2495
|
+
var dependencyProgress = progressByUrl[dependency];
|
|
2496
|
+
if (!dependencyProgress) return result;
|
|
2497
|
+
result.loaded += dependencyProgress.loaded;
|
|
2498
|
+
result.total += dependencyProgress.total;
|
|
2499
|
+
return result;
|
|
2500
|
+
}, {
|
|
2501
|
+
loaded: 0,
|
|
2502
|
+
total: 0
|
|
2503
|
+
});
|
|
2504
|
+
}
|
|
2505
|
+
|
|
2394
2506
|
function convertBoundingBox(box) {
|
|
2395
2507
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
2396
2508
|
return {
|
|
@@ -2445,53 +2557,50 @@ function average(arr) {
|
|
|
2445
2557
|
return sum / len;
|
|
2446
2558
|
}
|
|
2447
2559
|
|
|
2448
|
-
var
|
|
2449
|
-
|
|
2450
|
-
var
|
|
2451
|
-
|
|
2452
|
-
|
|
2453
|
-
|
|
2454
|
-
|
|
2455
|
-
|
|
2456
|
-
|
|
2457
|
-
|
|
2458
|
-
|
|
2459
|
-
|
|
2460
|
-
mobile: 0.3
|
|
2461
|
-
},
|
|
2462
|
-
idCardBack: {
|
|
2463
|
-
desktop: 0,
|
|
2464
|
-
mobile: 0.3
|
|
2465
|
-
},
|
|
2466
|
-
passport: {
|
|
2467
|
-
desktop: 0,
|
|
2468
|
-
mobile: 0.3
|
|
2469
|
-
},
|
|
2470
|
-
singlePage: {
|
|
2471
|
-
desktop: 0,
|
|
2472
|
-
mobile: 0.3
|
|
2560
|
+
var defaultDocumentDetectionScoreThreshold = 0.1;
|
|
2561
|
+
var defaultDocumentDetectionModelLoadTimeoutMs = 45000;
|
|
2562
|
+
var defaultDocumentDetectionThresholds = {
|
|
2563
|
+
idCardFront: 0.6,
|
|
2564
|
+
idCardBack: 0.6,
|
|
2565
|
+
passport: 0.4,
|
|
2566
|
+
singlePage: 0.4,
|
|
2567
|
+
stability: {
|
|
2568
|
+
idCardFront: 0.85,
|
|
2569
|
+
idCardBack: 0.85,
|
|
2570
|
+
passport: 0.5,
|
|
2571
|
+
singlePage: 0.5
|
|
2473
2572
|
}
|
|
2474
2573
|
};
|
|
2475
|
-
var
|
|
2476
|
-
|
|
2477
|
-
|
|
2478
|
-
|
|
2574
|
+
var documentTypeDisplayNames = {
|
|
2575
|
+
idCardFront: 'ID card front',
|
|
2576
|
+
idCardBack: 'ID card back',
|
|
2577
|
+
passport: 'Passport',
|
|
2578
|
+
singlePage: 'Single page',
|
|
2579
|
+
none: 'None'
|
|
2580
|
+
};
|
|
2581
|
+
var detector$1 = null;
|
|
2582
|
+
var detectorSettings$1 = null;
|
|
2583
|
+
function loadDocumentDetector() {
|
|
2584
|
+
return __awaiter(this, arguments, void 0, function (modelAssetPath, scoreThreshold) {
|
|
2479
2585
|
var _a, _b;
|
|
2480
2586
|
if (modelAssetPath === void 0) {
|
|
2481
|
-
modelAssetPath =
|
|
2587
|
+
modelAssetPath = defaultDocumentDetectorModelPath;
|
|
2588
|
+
}
|
|
2589
|
+
if (scoreThreshold === void 0) {
|
|
2590
|
+
scoreThreshold = defaultDocumentDetectionScoreThreshold;
|
|
2482
2591
|
}
|
|
2483
2592
|
return __generator(this, function (_c) {
|
|
2484
2593
|
switch (_c.label) {
|
|
2485
2594
|
case 0:
|
|
2486
|
-
if (
|
|
2487
|
-
|
|
2488
|
-
return [4 /*yield*/,
|
|
2595
|
+
if (detector$1 && (detectorSettings$1 === null || detectorSettings$1 === void 0 ? void 0 : detectorSettings$1.modelAssetPath) === modelAssetPath && (detectorSettings$1 === null || detectorSettings$1 === void 0 ? void 0 : detectorSettings$1.scoreThreshold) === scoreThreshold) return [2 /*return*/, detector$1];
|
|
2596
|
+
closeDocumentDetector();
|
|
2597
|
+
return [4 /*yield*/, preloadDocumentDetectorDependencies()];
|
|
2489
2598
|
case 1:
|
|
2490
2599
|
_c.sent();
|
|
2491
2600
|
if (modelCapabilities.delegate === 'NONE') {
|
|
2492
|
-
throw new Error('No available delegate for
|
|
2601
|
+
throw new Error('No available delegate for document detector.');
|
|
2493
2602
|
}
|
|
2494
|
-
_b = (_a =
|
|
2603
|
+
_b = (_a = ObjectDetector).createFromOptions;
|
|
2495
2604
|
return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
|
|
2496
2605
|
case 2:
|
|
2497
2606
|
return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
|
|
@@ -2500,44 +2609,48 @@ function loadFocusModel() {
|
|
|
2500
2609
|
delegate: modelCapabilities.delegate
|
|
2501
2610
|
},
|
|
2502
2611
|
// canvas: document.createElement('canvas'),
|
|
2612
|
+
scoreThreshold: scoreThreshold,
|
|
2503
2613
|
runningMode: 'VIDEO'
|
|
2504
2614
|
}])];
|
|
2505
2615
|
case 3:
|
|
2506
|
-
|
|
2507
|
-
|
|
2508
|
-
modelAssetPath: modelAssetPath
|
|
2616
|
+
detector$1 = _c.sent();
|
|
2617
|
+
detectorSettings$1 = {
|
|
2618
|
+
modelAssetPath: modelAssetPath,
|
|
2619
|
+
scoreThreshold: scoreThreshold
|
|
2509
2620
|
};
|
|
2510
|
-
return [2 /*return*/,
|
|
2621
|
+
return [2 /*return*/, detector$1];
|
|
2511
2622
|
}
|
|
2512
2623
|
});
|
|
2513
2624
|
});
|
|
2514
2625
|
}
|
|
2515
|
-
function
|
|
2516
|
-
|
|
2517
|
-
|
|
2518
|
-
|
|
2626
|
+
function closeDocumentDetector() {
|
|
2627
|
+
detector$1 === null || detector$1 === void 0 ? void 0 : detector$1.close();
|
|
2628
|
+
detector$1 = null;
|
|
2629
|
+
detectorSettings$1 = null;
|
|
2519
2630
|
}
|
|
2520
|
-
function
|
|
2521
|
-
var _b = _a.
|
|
2522
|
-
|
|
2523
|
-
_c = _a.
|
|
2524
|
-
|
|
2631
|
+
function useLoadDocumentDetector(_a) {
|
|
2632
|
+
var _b = _a.shouldLoadModels,
|
|
2633
|
+
shouldLoadModels = _b === void 0 ? true : _b,
|
|
2634
|
+
_c = _a.modelPath,
|
|
2635
|
+
modelPath = _c === void 0 ? defaultDocumentDetectorModelPath : _c,
|
|
2636
|
+
_d = _a.modelLoadTimeoutMs,
|
|
2637
|
+
modelLoadTimeoutMs = _d === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _d,
|
|
2638
|
+
_e = _a.scoreThreshold,
|
|
2639
|
+
scoreThreshold = _e === void 0 ? defaultDocumentDetectionScoreThreshold : _e,
|
|
2525
2640
|
onModelError = _a.onModelError,
|
|
2526
|
-
videoRef = _a.videoRef
|
|
2527
|
-
|
|
2528
|
-
|
|
2529
|
-
|
|
2530
|
-
modelLoadState = _e[0],
|
|
2531
|
-
setModelLoadState = _e[1];
|
|
2532
|
-
var _f = useState(0),
|
|
2533
|
-
modelDownloadProgress = _f[0],
|
|
2534
|
-
setModelDownloadProgress = _f[1];
|
|
2641
|
+
videoRef = _a.videoRef;
|
|
2642
|
+
var _f = useState('not-started'),
|
|
2643
|
+
modelLoadState = _f[0],
|
|
2644
|
+
setModelLoadState = _f[1];
|
|
2535
2645
|
var _g = useState(null),
|
|
2536
2646
|
modelWarmingStartedAt = _g[0],
|
|
2537
2647
|
setModelWarmingStartedAt = _g[1];
|
|
2538
|
-
var _h = useState(
|
|
2539
|
-
|
|
2540
|
-
|
|
2648
|
+
var _h = useState(0),
|
|
2649
|
+
modelDownloadProgress = _h[0],
|
|
2650
|
+
setModelDownloadProgress = _h[1];
|
|
2651
|
+
var _j = useState(null),
|
|
2652
|
+
modelError = _j[0],
|
|
2653
|
+
setModelError = _j[1];
|
|
2541
2654
|
useEffect(function loadModel() {
|
|
2542
2655
|
var _this = this;
|
|
2543
2656
|
if (!shouldLoadModels) return;
|
|
@@ -2546,21 +2659,24 @@ function useLoadFocusModel(_a) {
|
|
|
2546
2659
|
function handleDownloadProgress(event) {
|
|
2547
2660
|
setModelDownloadProgress(progressToPercentage(event.detail));
|
|
2548
2661
|
}
|
|
2549
|
-
document.addEventListener('idmission.preloadProgress.
|
|
2662
|
+
document.addEventListener('idmission.preloadProgress.documentDetector', handleDownloadProgress);
|
|
2550
2663
|
var modelLoadTimeout = setTimeout(function () {
|
|
2551
2664
|
setModelError(new Error('Model loading time limit exceeded.'));
|
|
2552
2665
|
}, modelLoadTimeoutMs);
|
|
2553
2666
|
var cancelVideoReady = function cancelVideoReady() {};
|
|
2554
|
-
|
|
2667
|
+
loadDocumentDetector(modelPath, scoreThreshold).then(function (model) {
|
|
2555
2668
|
return __awaiter(_this, void 0, void 0, function () {
|
|
2556
2669
|
var _a, videoReady, cancel, cancelled;
|
|
2557
2670
|
return __generator(this, function (_b) {
|
|
2558
2671
|
switch (_b.label) {
|
|
2559
2672
|
case 0:
|
|
2560
2673
|
setModelDownloadProgress(100);
|
|
2561
|
-
clearTimeout(modelLoadTimeout);
|
|
2562
2674
|
setModelLoadState('warming');
|
|
2563
|
-
setModelWarmingStartedAt(
|
|
2675
|
+
setModelWarmingStartedAt(performance.now());
|
|
2676
|
+
clearTimeout(modelLoadTimeout);
|
|
2677
|
+
return [4 /*yield*/, testDocumentDetectionAgainstKnownImage(model)];
|
|
2678
|
+
case 1:
|
|
2679
|
+
_b.sent();
|
|
2564
2680
|
_a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
|
|
2565
2681
|
cancelled = false;
|
|
2566
2682
|
cancelVideoReady = function cancelVideoReady() {
|
|
@@ -2568,11 +2684,11 @@ function useLoadFocusModel(_a) {
|
|
|
2568
2684
|
cancel();
|
|
2569
2685
|
};
|
|
2570
2686
|
return [4 /*yield*/, videoReady];
|
|
2571
|
-
case
|
|
2687
|
+
case 2:
|
|
2572
2688
|
_b.sent();
|
|
2573
2689
|
setTimeout(function () {
|
|
2574
2690
|
if (cancelled) return;
|
|
2575
|
-
|
|
2691
|
+
model.detectForVideo(videoRef.current, performance.now());
|
|
2576
2692
|
setModelLoadState('ready');
|
|
2577
2693
|
}, 500);
|
|
2578
2694
|
return [2 /*return*/];
|
|
@@ -2586,13 +2702,13 @@ function useLoadFocusModel(_a) {
|
|
|
2586
2702
|
clearTimeout(modelLoadTimeout);
|
|
2587
2703
|
});
|
|
2588
2704
|
return function () {
|
|
2589
|
-
log('unloading
|
|
2705
|
+
log('unloading document detection model');
|
|
2590
2706
|
cancelVideoReady();
|
|
2591
|
-
|
|
2707
|
+
closeDocumentDetector();
|
|
2592
2708
|
clearTimeout(modelLoadTimeout);
|
|
2593
|
-
document.removeEventListener('idmission.preloadProgress.
|
|
2709
|
+
document.removeEventListener('idmission.preloadProgress.documentDetector', handleDownloadProgress);
|
|
2594
2710
|
};
|
|
2595
|
-
}, [
|
|
2711
|
+
}, [shouldLoadModels, modelLoadTimeoutMs, modelPath, scoreThreshold, videoRef]);
|
|
2596
2712
|
useEffect(function handleModelError() {
|
|
2597
2713
|
if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
|
|
2598
2714
|
}, [modelError, onModelError]);
|
|
@@ -2602,185 +2718,41 @@ function useLoadFocusModel(_a) {
|
|
|
2602
2718
|
modelLoadState: modelLoadState,
|
|
2603
2719
|
modelDownloadProgress: modelDownloadProgress,
|
|
2604
2720
|
modelWarmingStartedAt: modelWarmingStartedAt,
|
|
2605
|
-
modelError: modelError
|
|
2721
|
+
modelError: modelError,
|
|
2722
|
+
setModelError: setModelError
|
|
2606
2723
|
};
|
|
2607
2724
|
}, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
|
|
2608
2725
|
}
|
|
2609
|
-
|
|
2610
|
-
|
|
2611
|
-
|
|
2612
|
-
|
|
2613
|
-
|
|
2614
|
-
|
|
2615
|
-
|
|
2616
|
-
|
|
2617
|
-
|
|
2618
|
-
|
|
2619
|
-
|
|
2620
|
-
|
|
2621
|
-
|
|
2622
|
-
|
|
2623
|
-
|
|
2624
|
-
|
|
2625
|
-
|
|
2626
|
-
|
|
2627
|
-
|
|
2628
|
-
|
|
2629
|
-
}
|
|
2630
|
-
function cropIfNecessary(imageData, cropCanvas, rotateCanvas, box) {
|
|
2631
|
-
if (!box) return imageData;
|
|
2632
|
-
var cropped = cropToDetectedObjectBox(imageData, box, cropCanvas);
|
|
2633
|
-
var _a = [box.width, box.height],
|
|
2634
|
-
bw = _a[0],
|
|
2635
|
-
bh = _a[1];
|
|
2636
|
-
if (bh <= bw) return cropped;
|
|
2637
|
-
var ctx = rotateCanvas.getContext('2d');
|
|
2638
|
-
if (!ctx) return cropped;
|
|
2639
|
-
rotateCanvas.width = bh;
|
|
2640
|
-
rotateCanvas.height = bw;
|
|
2641
|
-
ctx.clearRect(0, 0, rotateCanvas.width, rotateCanvas.height);
|
|
2642
|
-
ctx.translate(rotateCanvas.width / 2, rotateCanvas.height / 2);
|
|
2643
|
-
ctx.rotate(1.5708); // 90 deg in radians
|
|
2644
|
-
ctx.drawImage(cropped, -bw / 2, -bh / 2);
|
|
2645
|
-
return rotateCanvas;
|
|
2646
|
-
}
|
|
2647
|
-
|
|
2648
|
-
var defaultSelfieCaptureModelLoadTimeoutMs = 45000;
|
|
2649
|
-
var detector$1 = null;
|
|
2650
|
-
var detectorSettings$1 = null;
|
|
2651
|
-
function loadFaceDetector() {
|
|
2652
|
-
return __awaiter(this, arguments, void 0, function (modelAssetPath) {
|
|
2653
|
-
var _a, _b;
|
|
2654
|
-
if (modelAssetPath === void 0) {
|
|
2655
|
-
modelAssetPath = defaultFaceDetectorModelPath;
|
|
2656
|
-
}
|
|
2657
|
-
return __generator(this, function (_c) {
|
|
2658
|
-
switch (_c.label) {
|
|
2659
|
-
case 0:
|
|
2660
|
-
if (detector$1 && (detectorSettings$1 === null || detectorSettings$1 === void 0 ? void 0 : detectorSettings$1.modelAssetPath) === modelAssetPath) return [2 /*return*/, detector$1];
|
|
2661
|
-
closeFaceDetector();
|
|
2662
|
-
return [4 /*yield*/, preloadFaceDetectorDependencies()];
|
|
2663
|
-
case 1:
|
|
2664
|
-
_c.sent();
|
|
2665
|
-
if (modelCapabilities.delegate === 'NONE') {
|
|
2666
|
-
throw new Error('No available delegate for face detector.');
|
|
2667
|
-
}
|
|
2668
|
-
_b = (_a = FaceDetector).createFromOptions;
|
|
2669
|
-
return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
|
|
2670
|
-
case 2:
|
|
2671
|
-
return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
|
|
2672
|
-
// canvas: document.createElement('canvas'),
|
|
2673
|
-
baseOptions: {
|
|
2674
|
-
modelAssetPath: modelAssetPath,
|
|
2675
|
-
delegate: modelCapabilities.delegate
|
|
2676
|
-
},
|
|
2677
|
-
runningMode: 'VIDEO'
|
|
2678
|
-
}])];
|
|
2679
|
-
case 3:
|
|
2680
|
-
detector$1 = _c.sent();
|
|
2681
|
-
detectorSettings$1 = {
|
|
2682
|
-
modelAssetPath: modelAssetPath
|
|
2683
|
-
};
|
|
2684
|
-
return [2 /*return*/, detector$1];
|
|
2726
|
+
function makeDocumentDetectorPrediction(frame) {
|
|
2727
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
2728
|
+
var startedAt, prediction, time, frameWidth, frameHeight;
|
|
2729
|
+
return __generator(this, function (_a) {
|
|
2730
|
+
if (!detector$1) return [2 /*return*/, null];
|
|
2731
|
+
startedAt = performance.now();
|
|
2732
|
+
// Detectors can throw errors, for example when using custom URLs that
|
|
2733
|
+
// contain a model that doesn't provide the expected output.
|
|
2734
|
+
try {
|
|
2735
|
+
prediction = detector$1.detectForVideo(frame, performance.now());
|
|
2736
|
+
time = performance.now() - startedAt;
|
|
2737
|
+
frameWidth = frame.width;
|
|
2738
|
+
frameHeight = frame.height;
|
|
2739
|
+
return [2 /*return*/, _assign(_assign({}, prediction), {
|
|
2740
|
+
time: time,
|
|
2741
|
+
frameWidth: frameWidth,
|
|
2742
|
+
frameHeight: frameHeight
|
|
2743
|
+
})];
|
|
2744
|
+
} catch (e) {
|
|
2745
|
+
error('caught object detection error', e);
|
|
2685
2746
|
}
|
|
2747
|
+
return [2 /*return*/, null];
|
|
2686
2748
|
});
|
|
2687
2749
|
});
|
|
2688
2750
|
}
|
|
2689
|
-
|
|
2690
|
-
|
|
2691
|
-
|
|
2692
|
-
|
|
2693
|
-
|
|
2694
|
-
function useLoadFaceDetector(_a) {
|
|
2695
|
-
var onModelError = _a.onModelError,
|
|
2696
|
-
_b = _a.modelLoadTimeoutMs,
|
|
2697
|
-
modelLoadTimeoutMs = _b === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _b,
|
|
2698
|
-
videoRef = _a.videoRef;
|
|
2699
|
-
var _c = useState('not-started'),
|
|
2700
|
-
modelLoadState = _c[0],
|
|
2701
|
-
setModelLoadState = _c[1];
|
|
2702
|
-
var _d = useState(0),
|
|
2703
|
-
modelDownloadProgress = _d[0],
|
|
2704
|
-
setModelDownloadProgress = _d[1];
|
|
2705
|
-
var _e = useState(null),
|
|
2706
|
-
modelWarmingStartedAt = _e[0],
|
|
2707
|
-
setModelWarmingStartedAt = _e[1];
|
|
2708
|
-
var _f = useState(null),
|
|
2709
|
-
modelError = _f[0],
|
|
2710
|
-
setModelError = _f[1];
|
|
2711
|
-
useEffect(function loadModel() {
|
|
2712
|
-
var _this = this;
|
|
2713
|
-
setModelLoadState('downloading');
|
|
2714
|
-
setModelWarmingStartedAt(null);
|
|
2715
|
-
var modelLoadTimeout = setTimeout(function () {
|
|
2716
|
-
setModelError(new Error('Model loading time limit exceeded.'));
|
|
2717
|
-
}, modelLoadTimeoutMs);
|
|
2718
|
-
function handleDownloadProgress(event) {
|
|
2719
|
-
setModelDownloadProgress(progressToPercentage(event.detail));
|
|
2720
|
-
}
|
|
2721
|
-
document.addEventListener('idmission.preloadProgress.faceDetection', handleDownloadProgress);
|
|
2722
|
-
var cancelVideoReady = function cancelVideoReady() {};
|
|
2723
|
-
loadFaceDetector().then(function (model) {
|
|
2724
|
-
return __awaiter(_this, void 0, void 0, function () {
|
|
2725
|
-
var _a, videoReady, cancel, cancelled;
|
|
2726
|
-
return __generator(this, function (_b) {
|
|
2727
|
-
switch (_b.label) {
|
|
2728
|
-
case 0:
|
|
2729
|
-
setModelDownloadProgress(100);
|
|
2730
|
-
clearTimeout(modelLoadTimeout);
|
|
2731
|
-
setModelLoadState('warming');
|
|
2732
|
-
setModelWarmingStartedAt(new Date().getTime());
|
|
2733
|
-
return [4 /*yield*/, testFaceDetectionAgainstKnownImage(model)];
|
|
2734
|
-
case 1:
|
|
2735
|
-
_b.sent();
|
|
2736
|
-
_a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
|
|
2737
|
-
cancelled = false;
|
|
2738
|
-
cancelVideoReady = function cancelVideoReady() {
|
|
2739
|
-
cancelled = true;
|
|
2740
|
-
cancel();
|
|
2741
|
-
};
|
|
2742
|
-
return [4 /*yield*/, videoReady];
|
|
2743
|
-
case 2:
|
|
2744
|
-
_b.sent();
|
|
2745
|
-
if (cancelled) return [2 /*return*/];
|
|
2746
|
-
model.detectForVideo(videoRef.current, performance.now());
|
|
2747
|
-
setModelLoadState('ready');
|
|
2748
|
-
return [2 /*return*/];
|
|
2749
|
-
}
|
|
2750
|
-
});
|
|
2751
|
-
});
|
|
2752
|
-
})["catch"](function (e) {
|
|
2753
|
-
setModelError(e);
|
|
2754
|
-
setModelLoadState('error');
|
|
2755
|
-
})["finally"](function () {
|
|
2756
|
-
clearTimeout(modelLoadTimeout);
|
|
2757
|
-
});
|
|
2758
|
-
return function () {
|
|
2759
|
-
log('unloading face detection model');
|
|
2760
|
-
cancelVideoReady();
|
|
2761
|
-
closeFaceDetector();
|
|
2762
|
-
clearTimeout(modelLoadTimeout);
|
|
2763
|
-
document.removeEventListener('idmission.preloadProgress.faceDetection', handleDownloadProgress);
|
|
2764
|
-
};
|
|
2765
|
-
}, [modelLoadTimeoutMs, videoRef]);
|
|
2766
|
-
useEffect(function handleModelError() {
|
|
2767
|
-
if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
|
|
2768
|
-
}, [modelError, onModelError]);
|
|
2769
|
-
return useMemo(function () {
|
|
2770
|
-
return {
|
|
2771
|
-
ready: modelLoadState === 'ready',
|
|
2772
|
-
modelLoadState: modelLoadState,
|
|
2773
|
-
modelDownloadProgress: modelDownloadProgress,
|
|
2774
|
-
modelWarmingStartedAt: modelWarmingStartedAt,
|
|
2775
|
-
modelError: modelError
|
|
2776
|
-
};
|
|
2777
|
-
}, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
|
|
2778
|
-
}
|
|
2779
|
-
var lastFaceDetectionAt = 0;
|
|
2780
|
-
var lastFaceDetectionTime = 0;
|
|
2781
|
-
function setLastFaceDetectionAt(time) {
|
|
2782
|
-
lastFaceDetectionTime = time - lastFaceDetectionAt;
|
|
2783
|
-
lastFaceDetectionAt = time;
|
|
2751
|
+
var lastDetectionAt = 0;
|
|
2752
|
+
var lastDetectionTime = 0;
|
|
2753
|
+
function setLastDetectionAt(time) {
|
|
2754
|
+
lastDetectionTime = time - lastDetectionAt;
|
|
2755
|
+
lastDetectionAt = time;
|
|
2784
2756
|
}
|
|
2785
2757
|
var framesNeededSamples$1 = [];
|
|
2786
2758
|
function trackFramesNeeded$1(value, bufferLength) {
|
|
@@ -2790,922 +2762,397 @@ function trackFramesNeeded$1(value, bufferLength) {
|
|
|
2790
2762
|
framesNeededSamples$1.unshift(value);
|
|
2791
2763
|
if (framesNeededSamples$1.length > bufferLength) framesNeededSamples$1.length = bufferLength;
|
|
2792
2764
|
}
|
|
2793
|
-
var
|
|
2765
|
+
var lastNBoxes = [];
|
|
2794
2766
|
var lastNPairs$1 = [];
|
|
2795
|
-
function
|
|
2767
|
+
function trackBox(box, framesNeeded) {
|
|
2796
2768
|
if (framesNeeded === void 0) {
|
|
2797
2769
|
framesNeeded = 12;
|
|
2798
2770
|
}
|
|
2799
|
-
|
|
2800
|
-
if (
|
|
2801
|
-
if (
|
|
2802
|
-
var
|
|
2803
|
-
var iou = calculateIoU(
|
|
2771
|
+
lastNBoxes.unshift(box);
|
|
2772
|
+
if (lastNBoxes.length > framesNeeded) lastNBoxes.length = framesNeeded;
|
|
2773
|
+
if (lastNBoxes.length > 1) {
|
|
2774
|
+
var lastBox = lastNBoxes[1];
|
|
2775
|
+
var iou = calculateIoU(box, lastBox);
|
|
2804
2776
|
lastNPairs$1.unshift({
|
|
2805
|
-
a:
|
|
2806
|
-
b:
|
|
2777
|
+
a: box,
|
|
2778
|
+
b: lastBox,
|
|
2807
2779
|
iou: iou
|
|
2808
2780
|
});
|
|
2809
2781
|
if (lastNPairs$1.length > framesNeeded - 1) lastNPairs$1.length = framesNeeded - 1;
|
|
2810
2782
|
}
|
|
2811
2783
|
}
|
|
2812
|
-
|
|
2813
|
-
|
|
2814
|
-
|
|
2815
|
-
|
|
2816
|
-
|
|
2817
|
-
|
|
2818
|
-
|
|
2819
|
-
|
|
2820
|
-
|
|
2821
|
-
|
|
2822
|
-
|
|
2823
|
-
|
|
2824
|
-
|
|
2825
|
-
|
|
2826
|
-
|
|
2784
|
+
var defaultDocumentDetectionBoundaries = {
|
|
2785
|
+
top: 20,
|
|
2786
|
+
bottom: 20,
|
|
2787
|
+
left: 20,
|
|
2788
|
+
right: 20
|
|
2789
|
+
};
|
|
2790
|
+
function processDocumentDetectorPrediction(prediction, thresholds, boundaries) {
|
|
2791
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
2792
|
+
if (boundaries === void 0) {
|
|
2793
|
+
boundaries = defaultDocumentDetectionBoundaries;
|
|
2794
|
+
}
|
|
2795
|
+
var detections = prediction.detections,
|
|
2796
|
+
frameWidth = prediction.frameWidth,
|
|
2797
|
+
frameHeight = prediction.frameHeight,
|
|
2798
|
+
time = prediction.time;
|
|
2799
|
+
var boundaryTop = (_a = boundaries.top) !== null && _a !== void 0 ? _a : 20;
|
|
2800
|
+
var boundaryLeft = (_b = boundaries.left) !== null && _b !== void 0 ? _b : 20;
|
|
2801
|
+
var boundaryRight = (_c = boundaries.right) !== null && _c !== void 0 ? _c : 20;
|
|
2802
|
+
var boundaryBottom = (_d = boundaries.bottom) !== null && _d !== void 0 ? _d : 20;
|
|
2803
|
+
var frameWidth80Pct = frameWidth * 0.8;
|
|
2804
|
+
var detectedObjects = applyNonMaxSuppression(detections.flatMap(function (d) {
|
|
2805
|
+
return d.categories.map(function (category) {
|
|
2806
|
+
return {
|
|
2807
|
+
label: category === null || category === void 0 ? void 0 : category.categoryName,
|
|
2808
|
+
score: category === null || category === void 0 ? void 0 : category.score,
|
|
2809
|
+
box: convertBoundingBox(d.boundingBox)
|
|
2810
|
+
};
|
|
2811
|
+
});
|
|
2812
|
+
}), function (obj) {
|
|
2813
|
+
var _a = obj.box,
|
|
2814
|
+
xMin = _a.xMin,
|
|
2815
|
+
yMin = _a.yMin,
|
|
2816
|
+
width = _a.width,
|
|
2817
|
+
height = _a.height;
|
|
2818
|
+
return yMin > boundaryTop &&
|
|
2819
|
+
// Is it valid top edge of ID detected?
|
|
2820
|
+
yMin + height + boundaryBottom < frameHeight && (
|
|
2821
|
+
// Is it valid bottom edge less than max video height
|
|
2822
|
+
xMin > boundaryLeft || xMin + width > frameWidth80Pct) &&
|
|
2823
|
+
// If either the left side visible or if not, right edge of ID should be more than 80% of width.
|
|
2824
|
+
xMin + width + boundaryRight < frameWidth // Valid right edge if it's less than video width.
|
|
2825
|
+
;
|
|
2827
2826
|
});
|
|
2828
|
-
|
|
2829
|
-
|
|
2827
|
+
var allZero = detections.length > 0 && !detections.some(function (_a) {
|
|
2828
|
+
var boundingBox = _a.boundingBox;
|
|
2829
|
+
return Object.values(boundingBox !== null && boundingBox !== void 0 ? boundingBox : {}).some(function (n) {
|
|
2830
|
+
return n > 0;
|
|
2831
|
+
});
|
|
2830
2832
|
});
|
|
2831
|
-
|
|
2832
|
-
|
|
2833
|
-
|
|
2834
|
-
|
|
2835
|
-
|
|
2836
|
-
|
|
2837
|
-
|
|
2838
|
-
|
|
2839
|
-
|
|
2840
|
-
var
|
|
2841
|
-
|
|
2842
|
-
|
|
2843
|
-
|
|
2844
|
-
|
|
2845
|
-
|
|
2846
|
-
|
|
2847
|
-
|
|
2848
|
-
|
|
2849
|
-
|
|
2850
|
-
|
|
2851
|
-
|
|
2852
|
-
|
|
2853
|
-
|
|
2854
|
-
|
|
2855
|
-
|
|
2856
|
-
|
|
2857
|
-
|
|
2858
|
-
|
|
2859
|
-
|
|
2860
|
-
|
|
2861
|
-
|
|
2862
|
-
|
|
2863
|
-
|
|
2864
|
-
var isMobile = videoWidth < videoHeight;
|
|
2865
|
-
var tooCloseMultiple = 1.5;
|
|
2866
|
-
var tooFarMultiple = isMobile ? 6 : 7;
|
|
2867
|
-
faceTooClose = face.box.width > videoWidth / tooCloseMultiple;
|
|
2868
|
-
faceTooFar = face.box.width < videoWidth / tooFarMultiple;
|
|
2833
|
+
var bestIdCardFront = detectedObjects.find(function (obj) {
|
|
2834
|
+
return obj.label === 'Document';
|
|
2835
|
+
});
|
|
2836
|
+
var bestIdCardBack = detectedObjects.find(function (obj) {
|
|
2837
|
+
return obj.label === 'Document back';
|
|
2838
|
+
});
|
|
2839
|
+
var bestPassportPage = detectedObjects.find(function (obj) {
|
|
2840
|
+
return obj.label === 'Passport page';
|
|
2841
|
+
});
|
|
2842
|
+
var bestSinglePage = detectedObjects.find(function (obj) {
|
|
2843
|
+
return obj.label === 'Single page';
|
|
2844
|
+
});
|
|
2845
|
+
var idCardFrontDetectionScore = (_e = bestIdCardFront === null || bestIdCardFront === void 0 ? void 0 : bestIdCardFront.score) !== null && _e !== void 0 ? _e : 0;
|
|
2846
|
+
var idCardBackDetectionScore = (_f = bestIdCardBack === null || bestIdCardBack === void 0 ? void 0 : bestIdCardBack.score) !== null && _f !== void 0 ? _f : 0;
|
|
2847
|
+
var passportDetectionScore = (_g = bestPassportPage === null || bestPassportPage === void 0 ? void 0 : bestPassportPage.score) !== null && _g !== void 0 ? _g : 0;
|
|
2848
|
+
var singlePageDetectionScore = (_h = bestSinglePage === null || bestSinglePage === void 0 ? void 0 : bestSinglePage.score) !== null && _h !== void 0 ? _h : 0;
|
|
2849
|
+
var idCardFrontDetectionThresholdMet = idCardFrontDetectionScore >= ((_j = thresholds.idCardFront) !== null && _j !== void 0 ? _j : 0);
|
|
2850
|
+
var idCardBackDetectionThresholdMet = idCardBackDetectionScore >= ((_k = thresholds.idCardBack) !== null && _k !== void 0 ? _k : 0);
|
|
2851
|
+
var passportDetectionThresholdMet = passportDetectionScore >= ((_l = thresholds.passport) !== null && _l !== void 0 ? _l : 0);
|
|
2852
|
+
var singlePageDetectionThresholdMet = singlePageDetectionScore >= ((_m = thresholds.singlePage) !== null && _m !== void 0 ? _m : 0);
|
|
2853
|
+
var bestDocument = singlePageDetectionThresholdMet ? bestSinglePage : passportDetectionThresholdMet ? bestPassportPage : idCardBackDetectionThresholdMet ? bestIdCardBack : bestIdCardFront;
|
|
2854
|
+
var detectionThreshold = singlePageDetectionThresholdMet ? thresholds.singlePage : passportDetectionThresholdMet ? thresholds.passport : idCardBackDetectionThresholdMet ? thresholds.idCardBack : thresholds.idCardFront;
|
|
2855
|
+
var detectionScore = (_o = bestDocument === null || bestDocument === void 0 ? void 0 : bestDocument.score) !== null && _o !== void 0 ? _o : 0;
|
|
2856
|
+
var detectionThresholdMet = detectionScore >= (detectionThreshold !== null && detectionThreshold !== void 0 ? detectionThreshold : 0);
|
|
2857
|
+
var detectedDocumentType = 'none';
|
|
2858
|
+
if (singlePageDetectionThresholdMet) {
|
|
2859
|
+
detectedDocumentType = 'singlePage';
|
|
2860
|
+
} else if (passportDetectionThresholdMet) {
|
|
2861
|
+
detectedDocumentType = 'passport';
|
|
2862
|
+
} else if (idCardBackDetectionThresholdMet) {
|
|
2863
|
+
detectedDocumentType = 'idCardBack';
|
|
2864
|
+
} else if (detectionThresholdMet) {
|
|
2865
|
+
detectedDocumentType = 'idCardFront';
|
|
2869
2866
|
}
|
|
2870
|
-
var
|
|
2871
|
-
if (
|
|
2872
|
-
trackFramesNeeded$1(
|
|
2867
|
+
var documentInBounds = !!bestDocument;
|
|
2868
|
+
if (lastDetectionTime > 0) {
|
|
2869
|
+
trackFramesNeeded$1(1000 / lastDetectionTime);
|
|
2873
2870
|
}
|
|
2874
|
-
var
|
|
2875
|
-
|
|
2876
|
-
|
|
2877
|
-
|
|
2878
|
-
|
|
2879
|
-
|
|
2871
|
+
var documentIsStable = false;
|
|
2872
|
+
var documentTooClose = false;
|
|
2873
|
+
if (bestDocument) {
|
|
2874
|
+
var _q = [bestDocument.box.width / frameWidth, bestDocument.box.height / frameHeight],
|
|
2875
|
+
docWidth = _q[0],
|
|
2876
|
+
docHeight = _q[1];
|
|
2877
|
+
documentTooClose = docWidth > 0.85 || docHeight > 0.85;
|
|
2878
|
+
if (detectionThresholdMet && documentInBounds && !documentTooClose) {
|
|
2879
|
+
var thresholdSet = (_p = thresholds.stability) !== null && _p !== void 0 ? _p : defaultDocumentDetectionThresholds.stability;
|
|
2880
|
+
var threshold_1 = thresholdSet[detectedDocumentType];
|
|
2881
|
+
var framesNeeded = Math.ceil(average(framesNeededSamples$1));
|
|
2882
|
+
trackBox(bestDocument.box, framesNeeded);
|
|
2883
|
+
documentIsStable = lastNBoxes.length >= framesNeeded && !lastNPairs$1.some(function (pair) {
|
|
2884
|
+
return pair.iou < threshold_1;
|
|
2885
|
+
});
|
|
2886
|
+
}
|
|
2887
|
+
}
|
|
2888
|
+
var bestPDF417;
|
|
2889
|
+
if (detectedObjects.length > 0) {
|
|
2890
|
+
bestPDF417 = detectedObjects.find(function (obj) {
|
|
2891
|
+
return obj.label === 'PDF417';
|
|
2880
2892
|
});
|
|
2881
2893
|
}
|
|
2882
|
-
var faceReady = faceInGuides && faceIsStable;
|
|
2883
2894
|
return {
|
|
2884
|
-
|
|
2885
|
-
|
|
2886
|
-
|
|
2887
|
-
|
|
2888
|
-
|
|
2889
|
-
|
|
2890
|
-
|
|
2891
|
-
|
|
2892
|
-
|
|
2893
|
-
|
|
2894
|
-
|
|
2895
|
-
|
|
2896
|
-
|
|
2897
|
-
|
|
2898
|
-
|
|
2899
|
-
|
|
2900
|
-
|
|
2901
|
-
|
|
2902
|
-
|
|
2903
|
-
|
|
2904
|
-
|
|
2905
|
-
|
|
2906
|
-
|
|
2907
|
-
|
|
2908
|
-
|
|
2909
|
-
|
|
2910
|
-
|
|
2911
|
-
|
|
2912
|
-
|
|
2895
|
+
prediction: prediction,
|
|
2896
|
+
detectedObjects: detectedObjects,
|
|
2897
|
+
detectionScore: detectionScore,
|
|
2898
|
+
detectionTime: time,
|
|
2899
|
+
detectionThresholdMet: detectionThresholdMet,
|
|
2900
|
+
detectedDocumentType: detectedDocumentType,
|
|
2901
|
+
idCardFrontDetectionScore: idCardFrontDetectionScore,
|
|
2902
|
+
idCardFrontDetectionThresholdMet: idCardFrontDetectionThresholdMet,
|
|
2903
|
+
idCardBackDetectionScore: idCardBackDetectionScore,
|
|
2904
|
+
idCardBackDetectionThresholdMet: idCardBackDetectionThresholdMet,
|
|
2905
|
+
passportDetectionScore: passportDetectionScore,
|
|
2906
|
+
passportDetectionThresholdMet: passportDetectionThresholdMet,
|
|
2907
|
+
singlePageDetectionScore: singlePageDetectionScore,
|
|
2908
|
+
singlePageDetectionThresholdMet: singlePageDetectionThresholdMet,
|
|
2909
|
+
bestDocument: bestDocument,
|
|
2910
|
+
bestPDF417: bestPDF417,
|
|
2911
|
+
documentInBounds: documentInBounds,
|
|
2912
|
+
documentTooClose: documentTooClose,
|
|
2913
|
+
documentIsStable: documentIsStable,
|
|
2914
|
+
frameWidth: frameWidth,
|
|
2915
|
+
frameHeight: frameHeight,
|
|
2916
|
+
allZero: allZero
|
|
2917
|
+
};
|
|
2918
|
+
}
|
|
2919
|
+
function applyNonMaxSuppression(detectedObjects, isGoodBox) {
|
|
2920
|
+
var maxes = {};
|
|
2921
|
+
detectedObjects.forEach(function (obj, i) {
|
|
2922
|
+
if (obj) {
|
|
2923
|
+
if (!maxes[obj.label]) maxes[obj.label] = [0, -1];
|
|
2924
|
+
if (obj.score > maxes[obj.label][0] && (isGoodBox === null || isGoodBox === void 0 ? void 0 : isGoodBox(obj))) maxes[obj.label] = [obj.score, i];
|
|
2925
|
+
}
|
|
2926
|
+
});
|
|
2927
|
+
return Object.keys(maxes).map(function (label) {
|
|
2928
|
+
return detectedObjects[maxes[label][1]];
|
|
2929
|
+
}).filter(function (obj) {
|
|
2930
|
+
return !!obj;
|
|
2913
2931
|
});
|
|
2914
2932
|
}
|
|
2915
|
-
|
|
2916
|
-
|
|
2917
|
-
|
|
2918
|
-
|
|
2919
|
-
|
|
2920
|
-
|
|
2921
|
-
|
|
2922
|
-
|
|
2923
|
-
|
|
2924
|
-
|
|
2925
|
-
|
|
2926
|
-
|
|
2927
|
-
case 0:
|
|
2928
|
-
return [4 /*yield*/, probeModelCapabilities()];
|
|
2929
|
-
case 1:
|
|
2930
|
-
_f.sent();
|
|
2931
|
-
preloadTasks = [];
|
|
2932
|
-
if (documentDetectionModel) {
|
|
2933
|
-
preloadTasks.push(preloadDocumentDetectorDependencies);
|
|
2934
|
-
}
|
|
2935
|
-
if (focusModel) {
|
|
2936
|
-
preloadTasks.push(preloadFocusModelDependencies);
|
|
2937
|
-
}
|
|
2938
|
-
if (faceDetectionModel) {
|
|
2939
|
-
preloadTasks.push(preloadFaceDetectorDependencies);
|
|
2940
|
-
}
|
|
2941
|
-
return [4 /*yield*/, Promise.all(preloadTasks)];
|
|
2942
|
-
case 2:
|
|
2943
|
-
_f.sent();
|
|
2944
|
-
return [2 /*return*/];
|
|
2933
|
+
function testDocumentDetectionAgainstKnownImage(detector) {
|
|
2934
|
+
return new Promise(function (resolve, reject) {
|
|
2935
|
+
var img = new Image();
|
|
2936
|
+
img.crossOrigin = 'anonymous';
|
|
2937
|
+
img.onload = function () {
|
|
2938
|
+
var prediction = detector.detectForVideo(img, performance.now());
|
|
2939
|
+
if (prediction.detections.length > 0) {
|
|
2940
|
+
debug('document detection test result', prediction.detections);
|
|
2941
|
+
resolve(void 0);
|
|
2942
|
+
} else {
|
|
2943
|
+
warn('document detection test failed');
|
|
2944
|
+
reject(new Error('testDocumentDetectionAgainstKnownImage failed to predict'));
|
|
2945
2945
|
}
|
|
2946
|
-
}
|
|
2946
|
+
};
|
|
2947
|
+
img.onerror = function () {
|
|
2948
|
+
return reject(new Error('testDocumentDetectionAgainstKnownImage failed to load image'));
|
|
2949
|
+
};
|
|
2950
|
+
img.src = "".concat(DEFAULT_CDN_URL, "/id-card-test.jpg");
|
|
2947
2951
|
});
|
|
2948
|
-
}
|
|
2949
|
-
|
|
2950
|
-
|
|
2951
|
-
|
|
2952
|
-
|
|
2953
|
-
|
|
2954
|
-
|
|
2955
|
-
|
|
2956
|
-
loaded: 0,
|
|
2957
|
-
total: 0
|
|
2958
|
-
},
|
|
2959
|
-
focus: {
|
|
2960
|
-
loaded: 0,
|
|
2961
|
-
total: 0
|
|
2962
|
-
},
|
|
2963
|
-
faceDetection: {
|
|
2964
|
-
loaded: 0,
|
|
2965
|
-
total: 0
|
|
2952
|
+
}
|
|
2953
|
+
|
|
2954
|
+
function getFrameDimensions(frame) {
|
|
2955
|
+
var frameWidth = frame.width,
|
|
2956
|
+
frameHeight = frame.height;
|
|
2957
|
+
if (frame instanceof HTMLImageElement) {
|
|
2958
|
+
frameWidth = frame.naturalWidth;
|
|
2959
|
+
frameHeight = frame.naturalHeight;
|
|
2966
2960
|
}
|
|
2967
|
-
|
|
2968
|
-
|
|
2969
|
-
|
|
2970
|
-
|
|
2971
|
-
|
|
2972
|
-
|
|
2973
|
-
|
|
2974
|
-
|
|
2975
|
-
|
|
2976
|
-
|
|
2977
|
-
|
|
2978
|
-
|
|
2979
|
-
|
|
2980
|
-
|
|
2981
|
-
|
|
2982
|
-
|
|
2983
|
-
|
|
2984
|
-
|
|
2985
|
-
|
|
2961
|
+
if (frame instanceof HTMLVideoElement) {
|
|
2962
|
+
frameWidth = frame.videoWidth;
|
|
2963
|
+
frameHeight = frame.videoHeight;
|
|
2964
|
+
}
|
|
2965
|
+
return [frameWidth, frameHeight];
|
|
2966
|
+
}
|
|
2967
|
+
|
|
2968
|
+
var InvisibleCanvasContainer = styled.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])));
|
|
2969
|
+
var InvisibleCanvas = styled.canvas(templateObject_2$G || (templateObject_2$G = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
|
|
2970
|
+
function drawToCanvas(canvas, frame, width, height) {
|
|
2971
|
+
if (!canvas) return;
|
|
2972
|
+
var ctx = canvas.getContext('2d');
|
|
2973
|
+
if (!ctx) return;
|
|
2974
|
+
if (!width || !height) {
|
|
2975
|
+
var _a = getFrameDimensions(frame),
|
|
2976
|
+
frameWidth = _a[0],
|
|
2977
|
+
frameHeight = _a[1];
|
|
2978
|
+
width || (width = frameWidth);
|
|
2979
|
+
height || (height = frameHeight);
|
|
2980
|
+
}
|
|
2981
|
+
canvas.width = width;
|
|
2982
|
+
canvas.height = height;
|
|
2983
|
+
ctx.drawImage(frame, 0, 0, width, height);
|
|
2984
|
+
}
|
|
2985
|
+
function clearCanvas(canvas) {
|
|
2986
|
+
var _a;
|
|
2987
|
+
(_a = canvas === null || canvas === void 0 ? void 0 : canvas.getContext('2d')) === null || _a === void 0 ? void 0 : _a.clearRect(0, 0, canvas === null || canvas === void 0 ? void 0 : canvas.width, canvas === null || canvas === void 0 ? void 0 : canvas.height);
|
|
2988
|
+
}
|
|
2989
|
+
var templateObject_1$N, templateObject_2$G;
|
|
2990
|
+
|
|
2991
|
+
function useFrameLoop(fn, options) {
|
|
2992
|
+
if (options === void 0) {
|
|
2993
|
+
options = {};
|
|
2994
|
+
}
|
|
2995
|
+
var _a = useState(false),
|
|
2996
|
+
running = _a[0],
|
|
2997
|
+
setRunning = _a[1];
|
|
2998
|
+
var startedAtRef = useRef(null);
|
|
2999
|
+
var loopId = useRef(0);
|
|
3000
|
+
var frameId = useRef(0);
|
|
3001
|
+
useEffect(function runFrameLoop() {
|
|
3002
|
+
if (!running) return;
|
|
3003
|
+
var timer;
|
|
3004
|
+
var currentLoopId = loopId.current;
|
|
3005
|
+
function hotLoop() {
|
|
3006
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
3007
|
+
var start, timeRunning, took, amountToThrottle;
|
|
3008
|
+
var _a, _b, _c;
|
|
3009
|
+
return __generator(this, function (_d) {
|
|
3010
|
+
switch (_d.label) {
|
|
3011
|
+
case 0:
|
|
3012
|
+
if (currentLoopId !== loopId.current) return [2 /*return*/];
|
|
3013
|
+
start = new Date().getTime();
|
|
3014
|
+
timeRunning = start - ((_b = (_a = startedAtRef.current) === null || _a === void 0 ? void 0 : _a.getTime()) !== null && _b !== void 0 ? _b : 0);
|
|
3015
|
+
return [4 /*yield*/, fn(frameId.current, timeRunning)];
|
|
3016
|
+
case 1:
|
|
3017
|
+
_d.sent();
|
|
3018
|
+
took = new Date().getTime() - start;
|
|
3019
|
+
amountToThrottle = Math.max(((_c = options.throttleMs) !== null && _c !== void 0 ? _c : 0) - took, 0);
|
|
3020
|
+
timer = setTimeout(function () {
|
|
3021
|
+
frameId.current = requestAnimationFrame(hotLoop);
|
|
3022
|
+
}, amountToThrottle);
|
|
3023
|
+
return [2 /*return*/];
|
|
3024
|
+
}
|
|
2986
3025
|
});
|
|
2987
|
-
|
|
2988
|
-
|
|
2989
|
-
|
|
2990
|
-
|
|
2991
|
-
|
|
2992
|
-
|
|
3026
|
+
});
|
|
3027
|
+
}
|
|
3028
|
+
void hotLoop();
|
|
3029
|
+
return function () {
|
|
3030
|
+
loopId.current += 1;
|
|
3031
|
+
if (frameId.current) cancelAnimationFrame(frameId.current);
|
|
3032
|
+
if (timer) clearTimeout(timer);
|
|
3033
|
+
};
|
|
3034
|
+
}, [fn, running, options.throttleMs]);
|
|
3035
|
+
var start = useCallback(function () {
|
|
3036
|
+
startedAtRef.current = new Date();
|
|
3037
|
+
setRunning(true);
|
|
3038
|
+
}, []);
|
|
3039
|
+
var stop = useCallback(function () {
|
|
3040
|
+
loopId.current += 1; // force the loop to stop immediately.
|
|
3041
|
+
setRunning(false);
|
|
3042
|
+
startedAtRef.current = null;
|
|
3043
|
+
}, []);
|
|
3044
|
+
useEffect(function startAutomatically() {
|
|
3045
|
+
if (options.autoStart) start();
|
|
3046
|
+
return stop;
|
|
3047
|
+
}, [options.autoStart, start, stop]);
|
|
3048
|
+
return {
|
|
3049
|
+
start: start,
|
|
3050
|
+
stop: stop
|
|
3051
|
+
};
|
|
2993
3052
|
}
|
|
2994
|
-
|
|
2995
|
-
|
|
2996
|
-
|
|
2997
|
-
|
|
2998
|
-
|
|
2999
|
-
|
|
3000
|
-
var detail = event.detail;
|
|
3001
|
-
if (!dependencies.includes(detail.url)) return;
|
|
3002
|
-
progressByUseCase.documentDetection = sumUpProgressForDependencies(dependencies);
|
|
3003
|
-
document.dispatchEvent(new CustomEvent('idmission.preloadProgress.documentDetection', {
|
|
3004
|
-
detail: progressByUseCase.documentDetection
|
|
3005
|
-
}));
|
|
3053
|
+
|
|
3054
|
+
function listAvailableCameras(facingMode_1) {
|
|
3055
|
+
return __awaiter(this, arguments, void 0, function (facingMode, requestMicAccess) {
|
|
3056
|
+
var cameraEnumerationStream, allDevices, allowedVideoDevices;
|
|
3057
|
+
if (requestMicAccess === void 0) {
|
|
3058
|
+
requestMicAccess = false;
|
|
3006
3059
|
}
|
|
3007
|
-
var dependencies;
|
|
3008
3060
|
return __generator(this, function (_a) {
|
|
3009
3061
|
switch (_a.label) {
|
|
3010
3062
|
case 0:
|
|
3011
|
-
|
|
3012
|
-
|
|
3013
|
-
|
|
3014
|
-
|
|
3015
|
-
resolve();
|
|
3063
|
+
return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
|
|
3064
|
+
video: {
|
|
3065
|
+
facingMode: {
|
|
3066
|
+
exact: facingMode
|
|
3016
3067
|
}
|
|
3017
|
-
},
|
|
3018
|
-
|
|
3019
|
-
|
|
3020
|
-
|
|
3068
|
+
},
|
|
3069
|
+
audio: requestMicAccess
|
|
3070
|
+
})
|
|
3071
|
+
// This lists all available cameras attached to the user's device.
|
|
3072
|
+
];
|
|
3021
3073
|
case 1:
|
|
3022
|
-
_a.sent();
|
|
3023
|
-
|
|
3024
|
-
throw new Error('No available delegate for document detector.');
|
|
3025
|
-
}
|
|
3026
|
-
dependencies = [defaultDocumentDetectorModelPath];
|
|
3027
|
-
document.addEventListener('idmission.preloadProgress', handleDownloadProgress);
|
|
3028
|
-
_a.label = 2;
|
|
3074
|
+
cameraEnumerationStream = _a.sent();
|
|
3075
|
+
return [4 /*yield*/, navigator.mediaDevices.enumerateDevices()];
|
|
3029
3076
|
case 2:
|
|
3030
|
-
_a.
|
|
3031
|
-
|
|
3032
|
-
|
|
3033
|
-
|
|
3034
|
-
|
|
3035
|
-
|
|
3036
|
-
|
|
3037
|
-
|
|
3038
|
-
|
|
3039
|
-
|
|
3040
|
-
|
|
3041
|
-
|
|
3042
|
-
|
|
3043
|
-
});
|
|
3044
|
-
}
|
|
3045
|
-
function preloadFocusModelDependencies() {
|
|
3046
|
-
return __awaiter(this, void 0, void 0, function () {
|
|
3047
|
-
function handleModelDownloadProgress(event) {
|
|
3048
|
-
var detail = event.detail;
|
|
3049
|
-
if (!dependencies.includes(detail.url)) return;
|
|
3050
|
-
progressByUseCase.focus = sumUpProgressForDependencies(dependencies);
|
|
3051
|
-
document.dispatchEvent(new CustomEvent('idmission.preloadProgress.focus', {
|
|
3052
|
-
detail: progressByUseCase.focus
|
|
3053
|
-
}));
|
|
3054
|
-
}
|
|
3055
|
-
var dependencies;
|
|
3056
|
-
return __generator(this, function (_a) {
|
|
3057
|
-
switch (_a.label) {
|
|
3058
|
-
case 0:
|
|
3059
|
-
if (focusModelPreloading) return [2 /*return*/, new Promise(function (resolve) {
|
|
3060
|
-
var i = setInterval(function () {
|
|
3061
|
-
if (!focusModelPreloading) {
|
|
3062
|
-
clearInterval(i);
|
|
3063
|
-
resolve();
|
|
3064
|
-
}
|
|
3065
|
-
}, 100);
|
|
3066
|
-
})];
|
|
3067
|
-
focusModelPreloading = true;
|
|
3068
|
-
return [4 /*yield*/, probeModelCapabilities()];
|
|
3069
|
-
case 1:
|
|
3070
|
-
_a.sent();
|
|
3071
|
-
if (modelCapabilities.delegate === 'NONE') {
|
|
3072
|
-
throw new Error('No available delegate for document detector.');
|
|
3073
|
-
}
|
|
3074
|
-
dependencies = [defaultFocusModelPath];
|
|
3075
|
-
document.addEventListener('idmission.preloadProgress', handleModelDownloadProgress);
|
|
3076
|
-
_a.label = 2;
|
|
3077
|
-
case 2:
|
|
3078
|
-
_a.trys.push([2,, 4, 5]);
|
|
3079
|
-
return [4 /*yield*/, Promise.all(dependencies.map(preloadDependency))];
|
|
3080
|
-
case 3:
|
|
3081
|
-
_a.sent();
|
|
3082
|
-
return [3 /*break*/, 5];
|
|
3083
|
-
case 4:
|
|
3084
|
-
document.removeEventListener('idmission.preloadProgress', handleModelDownloadProgress);
|
|
3085
|
-
focusModelPreloading = false;
|
|
3086
|
-
return [7 /*endfinally*/];
|
|
3087
|
-
case 5:
|
|
3088
|
-
return [2 /*return*/];
|
|
3089
|
-
}
|
|
3090
|
-
});
|
|
3091
|
-
});
|
|
3092
|
-
}
|
|
3093
|
-
function preloadFaceDetectorDependencies() {
|
|
3094
|
-
return __awaiter(this, void 0, void 0, function () {
|
|
3095
|
-
function handleModelDownloadProgress(event) {
|
|
3096
|
-
var detail = event.detail;
|
|
3097
|
-
if (!dependencies.includes(detail.url)) return;
|
|
3098
|
-
progressByUseCase.faceDetection = sumUpProgressForDependencies(dependencies);
|
|
3099
|
-
document.dispatchEvent(new CustomEvent('idmission.preloadProgress.faceDetection', {
|
|
3100
|
-
detail: progressByUseCase.faceDetection
|
|
3101
|
-
}));
|
|
3102
|
-
}
|
|
3103
|
-
var dependencies;
|
|
3104
|
-
return __generator(this, function (_a) {
|
|
3105
|
-
switch (_a.label) {
|
|
3106
|
-
case 0:
|
|
3107
|
-
if (faceDetectorPreloading) return [2 /*return*/, new Promise(function (resolve) {
|
|
3108
|
-
var i = setInterval(function () {
|
|
3109
|
-
if (!faceDetectorPreloading) {
|
|
3110
|
-
clearInterval(i);
|
|
3111
|
-
resolve();
|
|
3112
|
-
}
|
|
3113
|
-
}, 100);
|
|
3114
|
-
})];
|
|
3115
|
-
faceDetectorPreloading = true;
|
|
3116
|
-
return [4 /*yield*/, probeModelCapabilities()];
|
|
3117
|
-
case 1:
|
|
3118
|
-
_a.sent();
|
|
3119
|
-
if (modelCapabilities.delegate === 'NONE') {
|
|
3120
|
-
throw new Error('No available delegate for document detector.');
|
|
3121
|
-
}
|
|
3122
|
-
dependencies = [defaultFaceDetectorModelPath];
|
|
3123
|
-
document.addEventListener('idmission.preloadProgress', handleModelDownloadProgress);
|
|
3124
|
-
_a.label = 2;
|
|
3125
|
-
case 2:
|
|
3126
|
-
_a.trys.push([2,, 4, 5]);
|
|
3127
|
-
return [4 /*yield*/, Promise.all(dependencies.map(preloadDependency))];
|
|
3128
|
-
case 3:
|
|
3129
|
-
_a.sent();
|
|
3130
|
-
return [3 /*break*/, 5];
|
|
3131
|
-
case 4:
|
|
3132
|
-
document.removeEventListener('idmission.preloadProgress', handleModelDownloadProgress);
|
|
3133
|
-
faceDetectorPreloading = false;
|
|
3134
|
-
return [7 /*endfinally*/];
|
|
3135
|
-
case 5:
|
|
3136
|
-
return [2 /*return*/];
|
|
3077
|
+
allDevices = _a.sent();
|
|
3078
|
+
allowedVideoDevices = allDevices.filter(function (_a) {
|
|
3079
|
+
var kind = _a.kind,
|
|
3080
|
+
label = _a.label;
|
|
3081
|
+
return kind === 'videoinput' && !label.toLowerCase().includes('virtual');
|
|
3082
|
+
});
|
|
3083
|
+
// Release the access to the user's camera that we obtained for enumeration purposes.
|
|
3084
|
+
cameraEnumerationStream.getVideoTracks().forEach(function (track) {
|
|
3085
|
+
track.enabled = false;
|
|
3086
|
+
track.stop();
|
|
3087
|
+
});
|
|
3088
|
+
cameraEnumerationStream = null;
|
|
3089
|
+
return [2 /*return*/, allowedVideoDevices];
|
|
3137
3090
|
}
|
|
3138
3091
|
});
|
|
3139
3092
|
});
|
|
3140
3093
|
}
|
|
3141
|
-
function
|
|
3142
|
-
return
|
|
3143
|
-
}
|
|
3144
|
-
function
|
|
3145
|
-
return
|
|
3146
|
-
|
|
3147
|
-
|
|
3148
|
-
|
|
3149
|
-
|
|
3150
|
-
|
|
3151
|
-
|
|
3152
|
-
|
|
3153
|
-
|
|
3094
|
+
var frontCameraLabels = ['front', 'avant', 'anteriore', 'cameraaanvoorzijde', 'kamerapåframsidan', 'forsidekamera', 'kamerapåforsiden', 'aparatprzedni', 'etukamera', 'kameradepan', 'ÖnKamera', 'cameramặttrước', 'camerăfață', 'prednákamera', 'prednjakamera', 'előlapikamera', 'přednífotoaparát', 'μπροστινήκάμερα', 'переднякамера', 'передняякамера', 'преднакамера', 'алдыңғыкамера', 'מצלמה קדמית', 'الكاميرا الأمامية', 'फ़्रंटकैमरा', '前置相机', '前置鏡頭', '前面カメラ', '전면카메라', 'กล้องด้านหน้า'].map(function (s) {
|
|
3095
|
+
return s.toLocaleLowerCase().split(' ').join('');
|
|
3096
|
+
});
|
|
3097
|
+
var rearCameraLabels = ['back', 'rear', 'posterior', 'trasera', 'traseira', 'arrière', 'rückkamera', 'fotocamera(posteriore)', 'cameraaanachterzijde', 'kamerapåbaksidan', 'kamerapåbaksiden', 'bagsidekamera', 'aparattylny', 'takakamera', 'arkakamera', 'kamerabelakang', 'cameramặtsau', 'camerăspate', 'stražnjakamera', 'zadnákamera', 'hátoldalikamera', 'zadnífotoaparát', 'πίσωκάμερα', 'заднякамера', 'Задняякамера', 'заднакамера', 'артқыкамера', 'מצלמה אחורית', 'الكاميرا الخلفية', 'बैककैमरा', '后置相机', '後置鏡頭', '背面カメラ', '후면카메라', 'กล้องด้านหลัง'].map(function (s) {
|
|
3098
|
+
return s.toLocaleLowerCase().split(' ').join('');
|
|
3099
|
+
});
|
|
3100
|
+
var backUltraWideCameraLabels = ['backdualwidecamera', 'backultrawidecamera', 'ultraampliaposterior', 'ultra-angulartraseira', 'ultragrandeangulartraseira', 'ultragrandangle', 'ultragranangular', 'ultra-weitwinkelkamera', 'ultra-grandangolo', 'ultrabredecameraaanachterzijde', 'ultravidvinkelkamerapåbaksidan', 'ultravidvinkelkameraetpåbagsiden', 'ultravidvinkelkamerabak', 'ultragenişkameraarkayüzü', 'ultralaajakulmainentakakamera', 'tylnyaparatultraszerokokątny', 'cameracựcrộngmặtsau', 'camerăcuobiectivultra‑superangularspate', 'ultraszéleslátószögűkamera', 'kameraultralebarbelakang', 'stražnjaultraširokakamera', 'zadníultraširokoúhlýfotoaparát', 'ultraširokouhlá', 'πίσωυπερευρείακάμερα', 'заднянадширококутнакамера', 'Задняясверхширокоугольнаякамера', 'Задна свръх широкоъгълна камера', 'артқыультракеңбұрыштыкамера', 'מצלמה אולטרה רחבה אחורית', 'كاميرا خلفية عريضة جدًا', 'बैकअल्ट्रावाइडकैमरा', '后置超广角相机', '後置超廣角鏡頭相機', '背面超広角カメラ', '후면울트라와이드카메라', 'กล้องด้านหลังอัลตร้าไวด์'].map(function (s) {
|
|
3101
|
+
return s.toLocaleLowerCase().split(' ').join('');
|
|
3102
|
+
});
|
|
3103
|
+
var cameraLabelMatches = function cameraLabelMatches(labelOrDevice, labelSetOrLabel) {
|
|
3104
|
+
var label = labelOrDevice instanceof MediaDeviceInfo ? getDeviceLabel(labelOrDevice) : labelOrDevice;
|
|
3105
|
+
var labelSet = typeof labelSetOrLabel === 'string' ? [labelSetOrLabel] : labelSetOrLabel;
|
|
3106
|
+
return labelSet.some(function (l) {
|
|
3107
|
+
return label.includes(l);
|
|
3154
3108
|
});
|
|
3155
|
-
}
|
|
3156
|
-
|
|
3157
|
-
var defaultDocumentDetectionScoreThreshold = 0.1;
|
|
3158
|
-
var defaultDocumentDetectionModelLoadTimeoutMs = 45000;
|
|
3159
|
-
var defaultDocumentDetectionThresholds = {
|
|
3160
|
-
idCardFront: 0.6,
|
|
3161
|
-
idCardBack: 0.6,
|
|
3162
|
-
passport: 0.4,
|
|
3163
|
-
singlePage: 0.4,
|
|
3164
|
-
stability: {
|
|
3165
|
-
idCardFront: 0.85,
|
|
3166
|
-
idCardBack: 0.85,
|
|
3167
|
-
passport: 0.5,
|
|
3168
|
-
singlePage: 0.5
|
|
3169
|
-
}
|
|
3170
3109
|
};
|
|
3171
|
-
var
|
|
3172
|
-
|
|
3173
|
-
idCardBack: 'ID card back',
|
|
3174
|
-
passport: 'Passport',
|
|
3175
|
-
singlePage: 'Single page',
|
|
3176
|
-
none: 'None'
|
|
3110
|
+
var getDeviceLabel = function getDeviceLabel(deviceInfo) {
|
|
3111
|
+
return deviceInfo.label.toLocaleLowerCase().split(' ').join('');
|
|
3177
3112
|
};
|
|
3178
|
-
var
|
|
3179
|
-
|
|
3180
|
-
|
|
3181
|
-
|
|
3182
|
-
|
|
3183
|
-
|
|
3184
|
-
|
|
3185
|
-
|
|
3186
|
-
|
|
3187
|
-
|
|
3188
|
-
|
|
3189
|
-
|
|
3190
|
-
|
|
3191
|
-
|
|
3192
|
-
|
|
3193
|
-
|
|
3194
|
-
return [4 /*yield*/, preloadDocumentDetectorDependencies()];
|
|
3195
|
-
case 1:
|
|
3196
|
-
_c.sent();
|
|
3197
|
-
if (modelCapabilities.delegate === 'NONE') {
|
|
3198
|
-
throw new Error('No available delegate for document detector.');
|
|
3199
|
-
}
|
|
3200
|
-
_b = (_a = ObjectDetector).createFromOptions;
|
|
3201
|
-
return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
|
|
3202
|
-
case 2:
|
|
3203
|
-
return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
|
|
3204
|
-
baseOptions: {
|
|
3205
|
-
modelAssetPath: modelAssetPath,
|
|
3206
|
-
delegate: modelCapabilities.delegate
|
|
3207
|
-
},
|
|
3208
|
-
// canvas: document.createElement('canvas'),
|
|
3209
|
-
scoreThreshold: scoreThreshold,
|
|
3210
|
-
runningMode: 'VIDEO'
|
|
3211
|
-
}])];
|
|
3212
|
-
case 3:
|
|
3213
|
-
detector = _c.sent();
|
|
3214
|
-
detectorSettings = {
|
|
3215
|
-
modelAssetPath: modelAssetPath,
|
|
3216
|
-
scoreThreshold: scoreThreshold
|
|
3217
|
-
};
|
|
3218
|
-
return [2 /*return*/, detector];
|
|
3219
|
-
}
|
|
3113
|
+
var currentCamera;
|
|
3114
|
+
function obtainCameraAccess(stream, deviceLabel, video) {
|
|
3115
|
+
releaseCameraAccess();
|
|
3116
|
+
log('obtaining camera access...');
|
|
3117
|
+
var _a = stream.getVideoTracks()[0].getSettings(),
|
|
3118
|
+
width = _a.width,
|
|
3119
|
+
height = _a.height;
|
|
3120
|
+
log('camera dimensions', width, height);
|
|
3121
|
+
var label = deviceLabel.toLocaleLowerCase().split(' ').join('');
|
|
3122
|
+
log('camera label', label);
|
|
3123
|
+
var isRearFacing = cameraLabelMatches(label, __spreadArray(__spreadArray(__spreadArray([], rearCameraLabels, true), backUltraWideCameraLabels, true), ['iphone'], false));
|
|
3124
|
+
log('is rear facing?', isRearFacing);
|
|
3125
|
+
var release = function release() {
|
|
3126
|
+
stream.getTracks().forEach(function (track) {
|
|
3127
|
+
track.enabled = false;
|
|
3128
|
+
track.stop();
|
|
3220
3129
|
});
|
|
3221
|
-
|
|
3130
|
+
if (video) {
|
|
3131
|
+
video.pause();
|
|
3132
|
+
video.srcObject = null;
|
|
3133
|
+
video.src = '';
|
|
3134
|
+
}
|
|
3135
|
+
};
|
|
3136
|
+
width || (width = 0);
|
|
3137
|
+
height || (height = 0);
|
|
3138
|
+
currentCamera = {
|
|
3139
|
+
label: deviceLabel,
|
|
3140
|
+
stream: stream,
|
|
3141
|
+
width: width,
|
|
3142
|
+
height: height,
|
|
3143
|
+
isRearFacing: isRearFacing,
|
|
3144
|
+
release: release
|
|
3145
|
+
};
|
|
3146
|
+
log('camera access granted');
|
|
3147
|
+
// if (video) video.srcObject = stream
|
|
3148
|
+
// log('video source initialized')
|
|
3149
|
+
return currentCamera;
|
|
3222
3150
|
}
|
|
3223
|
-
function
|
|
3224
|
-
|
|
3225
|
-
|
|
3226
|
-
|
|
3227
|
-
|
|
3228
|
-
function useLoadDocumentDetector(_a) {
|
|
3229
|
-
var _b = _a.shouldLoadModels,
|
|
3230
|
-
shouldLoadModels = _b === void 0 ? true : _b,
|
|
3231
|
-
_c = _a.modelPath,
|
|
3232
|
-
modelPath = _c === void 0 ? defaultDocumentDetectorModelPath : _c,
|
|
3233
|
-
_d = _a.modelLoadTimeoutMs,
|
|
3234
|
-
modelLoadTimeoutMs = _d === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _d,
|
|
3235
|
-
_e = _a.scoreThreshold,
|
|
3236
|
-
scoreThreshold = _e === void 0 ? defaultDocumentDetectionScoreThreshold : _e,
|
|
3237
|
-
onModelError = _a.onModelError,
|
|
3238
|
-
videoRef = _a.videoRef;
|
|
3239
|
-
var _f = useState('not-started'),
|
|
3240
|
-
modelLoadState = _f[0],
|
|
3241
|
-
setModelLoadState = _f[1];
|
|
3242
|
-
var _g = useState(null),
|
|
3243
|
-
modelWarmingStartedAt = _g[0],
|
|
3244
|
-
setModelWarmingStartedAt = _g[1];
|
|
3245
|
-
var _h = useState(0),
|
|
3246
|
-
modelDownloadProgress = _h[0],
|
|
3247
|
-
setModelDownloadProgress = _h[1];
|
|
3248
|
-
var _j = useState(null),
|
|
3249
|
-
modelError = _j[0],
|
|
3250
|
-
setModelError = _j[1];
|
|
3251
|
-
useEffect(function loadModel() {
|
|
3252
|
-
var _this = this;
|
|
3253
|
-
if (!shouldLoadModels) return;
|
|
3254
|
-
setModelLoadState('downloading');
|
|
3255
|
-
setModelWarmingStartedAt(null);
|
|
3256
|
-
function handleDownloadProgress(event) {
|
|
3257
|
-
setModelDownloadProgress(progressToPercentage(event.detail));
|
|
3258
|
-
}
|
|
3259
|
-
document.addEventListener('idmission.preloadProgress.documentDetection', handleDownloadProgress);
|
|
3260
|
-
var modelLoadTimeout = setTimeout(function () {
|
|
3261
|
-
setModelError(new Error('Model loading time limit exceeded.'));
|
|
3262
|
-
}, modelLoadTimeoutMs);
|
|
3263
|
-
var cancelVideoReady = function cancelVideoReady() {};
|
|
3264
|
-
loadDocumentDetector(modelPath, scoreThreshold).then(function (model) {
|
|
3265
|
-
return __awaiter(_this, void 0, void 0, function () {
|
|
3266
|
-
var _a, videoReady, cancel, cancelled;
|
|
3267
|
-
return __generator(this, function (_b) {
|
|
3268
|
-
switch (_b.label) {
|
|
3269
|
-
case 0:
|
|
3270
|
-
setModelDownloadProgress(100);
|
|
3271
|
-
setModelLoadState('warming');
|
|
3272
|
-
setModelWarmingStartedAt(new Date().getTime());
|
|
3273
|
-
clearTimeout(modelLoadTimeout);
|
|
3274
|
-
return [4 /*yield*/, testDocumentDetectionAgainstKnownImage(model)];
|
|
3275
|
-
case 1:
|
|
3276
|
-
_b.sent();
|
|
3277
|
-
_a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
|
|
3278
|
-
cancelled = false;
|
|
3279
|
-
cancelVideoReady = function cancelVideoReady() {
|
|
3280
|
-
cancelled = true;
|
|
3281
|
-
cancel();
|
|
3282
|
-
};
|
|
3283
|
-
return [4 /*yield*/, videoReady];
|
|
3284
|
-
case 2:
|
|
3285
|
-
_b.sent();
|
|
3286
|
-
setTimeout(function () {
|
|
3287
|
-
if (cancelled) return;
|
|
3288
|
-
model.detectForVideo(videoRef.current, performance.now());
|
|
3289
|
-
setModelLoadState('ready');
|
|
3290
|
-
}, 500);
|
|
3291
|
-
return [2 /*return*/];
|
|
3292
|
-
}
|
|
3293
|
-
});
|
|
3294
|
-
});
|
|
3295
|
-
})["catch"](function (e) {
|
|
3296
|
-
setModelError(e);
|
|
3297
|
-
setModelLoadState('error');
|
|
3298
|
-
})["finally"](function () {
|
|
3299
|
-
clearTimeout(modelLoadTimeout);
|
|
3300
|
-
});
|
|
3301
|
-
return function () {
|
|
3302
|
-
log('unloading document detection model');
|
|
3303
|
-
cancelVideoReady();
|
|
3304
|
-
closeDocumentDetector();
|
|
3305
|
-
clearTimeout(modelLoadTimeout);
|
|
3306
|
-
document.removeEventListener('idmission.preloadProgress.documentDetection', handleDownloadProgress);
|
|
3307
|
-
};
|
|
3308
|
-
}, [shouldLoadModels, modelLoadTimeoutMs, modelPath, scoreThreshold, videoRef]);
|
|
3309
|
-
useEffect(function handleModelError() {
|
|
3310
|
-
if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
|
|
3311
|
-
}, [modelError, onModelError]);
|
|
3312
|
-
return useMemo(function () {
|
|
3313
|
-
return {
|
|
3314
|
-
ready: modelLoadState === 'ready',
|
|
3315
|
-
modelLoadState: modelLoadState,
|
|
3316
|
-
modelDownloadProgress: modelDownloadProgress,
|
|
3317
|
-
modelWarmingStartedAt: modelWarmingStartedAt,
|
|
3318
|
-
modelError: modelError,
|
|
3319
|
-
setModelError: setModelError
|
|
3320
|
-
};
|
|
3321
|
-
}, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
|
|
3322
|
-
}
|
|
3323
|
-
function makeDocumentDetectorPrediction(frame) {
|
|
3324
|
-
return __awaiter(this, void 0, void 0, function () {
|
|
3325
|
-
var startedAt, prediction, time, frameWidth, frameHeight;
|
|
3326
|
-
return __generator(this, function (_a) {
|
|
3327
|
-
if (!detector) return [2 /*return*/, null];
|
|
3328
|
-
startedAt = new Date();
|
|
3329
|
-
// Detectors can throw errors, for example when using custom URLs that
|
|
3330
|
-
// contain a model that doesn't provide the expected output.
|
|
3331
|
-
try {
|
|
3332
|
-
prediction = detector.detectForVideo(frame, performance.now());
|
|
3333
|
-
time = new Date().getTime() - startedAt.getTime();
|
|
3334
|
-
frameWidth = frame.width;
|
|
3335
|
-
frameHeight = frame.height;
|
|
3336
|
-
return [2 /*return*/, _assign(_assign({}, prediction), {
|
|
3337
|
-
time: time,
|
|
3338
|
-
frameWidth: frameWidth,
|
|
3339
|
-
frameHeight: frameHeight
|
|
3340
|
-
})];
|
|
3341
|
-
} catch (e) {
|
|
3342
|
-
error('caught object detection error', e);
|
|
3343
|
-
}
|
|
3344
|
-
return [2 /*return*/, null];
|
|
3345
|
-
});
|
|
3346
|
-
});
|
|
3347
|
-
}
|
|
3348
|
-
var lastDetectionAt = 0;
|
|
3349
|
-
var lastDetectionTime = 0;
|
|
3350
|
-
function setLastDetectionAt(time) {
|
|
3351
|
-
lastDetectionTime = time - lastDetectionAt;
|
|
3352
|
-
lastDetectionAt = time;
|
|
3353
|
-
}
|
|
3354
|
-
var framesNeededSamples = [];
|
|
3355
|
-
function trackFramesNeeded(value, bufferLength) {
|
|
3356
|
-
if (bufferLength === void 0) {
|
|
3357
|
-
bufferLength = 25;
|
|
3358
|
-
}
|
|
3359
|
-
framesNeededSamples.unshift(value);
|
|
3360
|
-
if (framesNeededSamples.length > bufferLength) framesNeededSamples.length = bufferLength;
|
|
3361
|
-
}
|
|
3362
|
-
var lastNBoxes = [];
|
|
3363
|
-
var lastNPairs = [];
|
|
3364
|
-
function trackBox(box, framesNeeded) {
|
|
3365
|
-
if (framesNeeded === void 0) {
|
|
3366
|
-
framesNeeded = 12;
|
|
3367
|
-
}
|
|
3368
|
-
lastNBoxes.unshift(box);
|
|
3369
|
-
if (lastNBoxes.length > framesNeeded) lastNBoxes.length = framesNeeded;
|
|
3370
|
-
if (lastNBoxes.length > 1) {
|
|
3371
|
-
var lastBox = lastNBoxes[1];
|
|
3372
|
-
var iou = calculateIoU(box, lastBox);
|
|
3373
|
-
lastNPairs.unshift({
|
|
3374
|
-
a: box,
|
|
3375
|
-
b: lastBox,
|
|
3376
|
-
iou: iou
|
|
3377
|
-
});
|
|
3378
|
-
if (lastNPairs.length > framesNeeded - 1) lastNPairs.length = framesNeeded - 1;
|
|
3379
|
-
}
|
|
3380
|
-
}
|
|
3381
|
-
var defaultDocumentDetectionBoundaries = {
|
|
3382
|
-
top: 20,
|
|
3383
|
-
bottom: 20,
|
|
3384
|
-
left: 20,
|
|
3385
|
-
right: 20
|
|
3386
|
-
};
|
|
3387
|
-
function processDocumentDetectorPrediction(prediction, thresholds, boundaries) {
|
|
3388
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
3389
|
-
if (boundaries === void 0) {
|
|
3390
|
-
boundaries = defaultDocumentDetectionBoundaries;
|
|
3391
|
-
}
|
|
3392
|
-
var detections = prediction.detections,
|
|
3393
|
-
frameWidth = prediction.frameWidth,
|
|
3394
|
-
frameHeight = prediction.frameHeight,
|
|
3395
|
-
time = prediction.time;
|
|
3396
|
-
var boundaryTop = (_a = boundaries.top) !== null && _a !== void 0 ? _a : 20;
|
|
3397
|
-
var boundaryLeft = (_b = boundaries.left) !== null && _b !== void 0 ? _b : 20;
|
|
3398
|
-
var boundaryRight = (_c = boundaries.right) !== null && _c !== void 0 ? _c : 20;
|
|
3399
|
-
var boundaryBottom = (_d = boundaries.bottom) !== null && _d !== void 0 ? _d : 20;
|
|
3400
|
-
var frameWidth80Pct = frameWidth * 0.8;
|
|
3401
|
-
var detectedObjects = applyNonMaxSuppression(detections.flatMap(function (d) {
|
|
3402
|
-
return d.categories.map(function (category) {
|
|
3403
|
-
return {
|
|
3404
|
-
label: category === null || category === void 0 ? void 0 : category.categoryName,
|
|
3405
|
-
score: category === null || category === void 0 ? void 0 : category.score,
|
|
3406
|
-
box: convertBoundingBox(d.boundingBox)
|
|
3407
|
-
};
|
|
3408
|
-
});
|
|
3409
|
-
}), function (obj) {
|
|
3410
|
-
var _a = obj.box,
|
|
3411
|
-
xMin = _a.xMin,
|
|
3412
|
-
yMin = _a.yMin,
|
|
3413
|
-
width = _a.width,
|
|
3414
|
-
height = _a.height;
|
|
3415
|
-
return yMin > boundaryTop &&
|
|
3416
|
-
// Is it valid top edge of ID detected?
|
|
3417
|
-
yMin + height + boundaryBottom < frameHeight && (
|
|
3418
|
-
// Is it valid bottom edge less than max video height
|
|
3419
|
-
xMin > boundaryLeft || xMin + width > frameWidth80Pct) &&
|
|
3420
|
-
// If either the left side visible or if not, right edge of ID should be more than 80% of width.
|
|
3421
|
-
xMin + width + boundaryRight < frameWidth // Valid right edge if it's less than video width.
|
|
3422
|
-
;
|
|
3423
|
-
});
|
|
3424
|
-
var allZero = detections.length > 0 && !detections.some(function (_a) {
|
|
3425
|
-
var boundingBox = _a.boundingBox;
|
|
3426
|
-
return Object.values(boundingBox !== null && boundingBox !== void 0 ? boundingBox : {}).some(function (n) {
|
|
3427
|
-
return n > 0;
|
|
3428
|
-
});
|
|
3429
|
-
});
|
|
3430
|
-
var bestIdCardFront = detectedObjects.find(function (obj) {
|
|
3431
|
-
return obj.label === 'Document';
|
|
3432
|
-
});
|
|
3433
|
-
var bestIdCardBack = detectedObjects.find(function (obj) {
|
|
3434
|
-
return obj.label === 'Document back';
|
|
3435
|
-
});
|
|
3436
|
-
var bestPassportPage = detectedObjects.find(function (obj) {
|
|
3437
|
-
return obj.label === 'Passport page';
|
|
3438
|
-
});
|
|
3439
|
-
var bestSinglePage = detectedObjects.find(function (obj) {
|
|
3440
|
-
return obj.label === 'Single page';
|
|
3441
|
-
});
|
|
3442
|
-
var idCardFrontDetectionScore = (_e = bestIdCardFront === null || bestIdCardFront === void 0 ? void 0 : bestIdCardFront.score) !== null && _e !== void 0 ? _e : 0;
|
|
3443
|
-
var idCardBackDetectionScore = (_f = bestIdCardBack === null || bestIdCardBack === void 0 ? void 0 : bestIdCardBack.score) !== null && _f !== void 0 ? _f : 0;
|
|
3444
|
-
var passportDetectionScore = (_g = bestPassportPage === null || bestPassportPage === void 0 ? void 0 : bestPassportPage.score) !== null && _g !== void 0 ? _g : 0;
|
|
3445
|
-
var singlePageDetectionScore = (_h = bestSinglePage === null || bestSinglePage === void 0 ? void 0 : bestSinglePage.score) !== null && _h !== void 0 ? _h : 0;
|
|
3446
|
-
var idCardFrontDetectionThresholdMet = idCardFrontDetectionScore >= ((_j = thresholds.idCardFront) !== null && _j !== void 0 ? _j : 0);
|
|
3447
|
-
var idCardBackDetectionThresholdMet = idCardBackDetectionScore >= ((_k = thresholds.idCardBack) !== null && _k !== void 0 ? _k : 0);
|
|
3448
|
-
var passportDetectionThresholdMet = passportDetectionScore >= ((_l = thresholds.passport) !== null && _l !== void 0 ? _l : 0);
|
|
3449
|
-
var singlePageDetectionThresholdMet = singlePageDetectionScore >= ((_m = thresholds.singlePage) !== null && _m !== void 0 ? _m : 0);
|
|
3450
|
-
var bestDocument = singlePageDetectionThresholdMet ? bestSinglePage : passportDetectionThresholdMet ? bestPassportPage : idCardBackDetectionThresholdMet ? bestIdCardBack : bestIdCardFront;
|
|
3451
|
-
var detectionThreshold = singlePageDetectionThresholdMet ? thresholds.singlePage : passportDetectionThresholdMet ? thresholds.passport : idCardBackDetectionThresholdMet ? thresholds.idCardBack : thresholds.idCardFront;
|
|
3452
|
-
var detectionScore = (_o = bestDocument === null || bestDocument === void 0 ? void 0 : bestDocument.score) !== null && _o !== void 0 ? _o : 0;
|
|
3453
|
-
var detectionThresholdMet = detectionScore >= (detectionThreshold !== null && detectionThreshold !== void 0 ? detectionThreshold : 0);
|
|
3454
|
-
var detectedDocumentType = 'none';
|
|
3455
|
-
if (singlePageDetectionThresholdMet) {
|
|
3456
|
-
detectedDocumentType = 'singlePage';
|
|
3457
|
-
} else if (passportDetectionThresholdMet) {
|
|
3458
|
-
detectedDocumentType = 'passport';
|
|
3459
|
-
} else if (idCardBackDetectionThresholdMet) {
|
|
3460
|
-
detectedDocumentType = 'idCardBack';
|
|
3461
|
-
} else if (detectionThresholdMet) {
|
|
3462
|
-
detectedDocumentType = 'idCardFront';
|
|
3463
|
-
}
|
|
3464
|
-
var documentInBounds = !!bestDocument;
|
|
3465
|
-
if (lastDetectionTime > 0) {
|
|
3466
|
-
trackFramesNeeded(1000 / lastDetectionTime);
|
|
3467
|
-
}
|
|
3468
|
-
var documentIsStable = false;
|
|
3469
|
-
var documentTooClose = false;
|
|
3470
|
-
if (bestDocument) {
|
|
3471
|
-
var _q = [bestDocument.box.width / frameWidth, bestDocument.box.height / frameHeight],
|
|
3472
|
-
docWidth = _q[0],
|
|
3473
|
-
docHeight = _q[1];
|
|
3474
|
-
documentTooClose = docWidth > 0.85 || docHeight > 0.85;
|
|
3475
|
-
if (detectionThresholdMet && documentInBounds && !documentTooClose) {
|
|
3476
|
-
var thresholdSet = (_p = thresholds.stability) !== null && _p !== void 0 ? _p : defaultDocumentDetectionThresholds.stability;
|
|
3477
|
-
var threshold_1 = thresholdSet[detectedDocumentType];
|
|
3478
|
-
var framesNeeded = Math.ceil(average(framesNeededSamples));
|
|
3479
|
-
trackBox(bestDocument.box, framesNeeded);
|
|
3480
|
-
documentIsStable = lastNBoxes.length >= framesNeeded && !lastNPairs.some(function (pair) {
|
|
3481
|
-
return pair.iou < threshold_1;
|
|
3482
|
-
});
|
|
3483
|
-
}
|
|
3484
|
-
}
|
|
3485
|
-
return {
|
|
3486
|
-
prediction: prediction,
|
|
3487
|
-
detectedObjects: detectedObjects,
|
|
3488
|
-
detectionScore: detectionScore,
|
|
3489
|
-
detectionTime: time,
|
|
3490
|
-
detectionThresholdMet: detectionThresholdMet,
|
|
3491
|
-
detectedDocumentType: detectedDocumentType,
|
|
3492
|
-
idCardFrontDetectionScore: idCardFrontDetectionScore,
|
|
3493
|
-
idCardFrontDetectionThresholdMet: idCardFrontDetectionThresholdMet,
|
|
3494
|
-
idCardBackDetectionScore: idCardBackDetectionScore,
|
|
3495
|
-
idCardBackDetectionThresholdMet: idCardBackDetectionThresholdMet,
|
|
3496
|
-
passportDetectionScore: passportDetectionScore,
|
|
3497
|
-
passportDetectionThresholdMet: passportDetectionThresholdMet,
|
|
3498
|
-
singlePageDetectionScore: singlePageDetectionScore,
|
|
3499
|
-
singlePageDetectionThresholdMet: singlePageDetectionThresholdMet,
|
|
3500
|
-
bestDocument: bestDocument,
|
|
3501
|
-
documentInBounds: documentInBounds,
|
|
3502
|
-
documentTooClose: documentTooClose,
|
|
3503
|
-
documentIsStable: documentIsStable,
|
|
3504
|
-
frameWidth: frameWidth,
|
|
3505
|
-
frameHeight: frameHeight,
|
|
3506
|
-
allZero: allZero
|
|
3507
|
-
};
|
|
3508
|
-
}
|
|
3509
|
-
function applyNonMaxSuppression(detectedObjects, isGoodBox) {
|
|
3510
|
-
var maxes = {};
|
|
3511
|
-
detectedObjects.forEach(function (obj, i) {
|
|
3512
|
-
if (obj) {
|
|
3513
|
-
if (!maxes[obj.label]) maxes[obj.label] = [0, -1];
|
|
3514
|
-
if (obj.score > maxes[obj.label][0] && (isGoodBox === null || isGoodBox === void 0 ? void 0 : isGoodBox(obj))) maxes[obj.label] = [obj.score, i];
|
|
3515
|
-
}
|
|
3516
|
-
});
|
|
3517
|
-
return Object.keys(maxes).map(function (label) {
|
|
3518
|
-
return detectedObjects[maxes[label][1]];
|
|
3519
|
-
}).filter(function (obj) {
|
|
3520
|
-
return !!obj;
|
|
3521
|
-
});
|
|
3522
|
-
}
|
|
3523
|
-
function testDocumentDetectionAgainstKnownImage(detector) {
|
|
3524
|
-
return new Promise(function (resolve, reject) {
|
|
3525
|
-
var img = new Image();
|
|
3526
|
-
img.crossOrigin = 'anonymous';
|
|
3527
|
-
img.onload = function () {
|
|
3528
|
-
var prediction = detector.detectForVideo(img, performance.now());
|
|
3529
|
-
if (prediction.detections.length > 0) {
|
|
3530
|
-
debug('document detection test result', prediction.detections);
|
|
3531
|
-
resolve(void 0);
|
|
3532
|
-
} else {
|
|
3533
|
-
warn('document detection test failed');
|
|
3534
|
-
reject(new Error('testDocumentDetectionAgainstKnownImage failed to predict'));
|
|
3535
|
-
}
|
|
3536
|
-
};
|
|
3537
|
-
img.onerror = function () {
|
|
3538
|
-
return reject(new Error('testDocumentDetectionAgainstKnownImage failed to load image'));
|
|
3539
|
-
};
|
|
3540
|
-
img.src = "".concat(DEFAULT_CDN_URL, "/id-card-test.jpg");
|
|
3541
|
-
});
|
|
3542
|
-
}
|
|
3543
|
-
|
|
3544
|
-
function useFrameLoop(fn, options) {
|
|
3545
|
-
if (options === void 0) {
|
|
3546
|
-
options = {};
|
|
3547
|
-
}
|
|
3548
|
-
var _a = useState(false),
|
|
3549
|
-
running = _a[0],
|
|
3550
|
-
setRunning = _a[1];
|
|
3551
|
-
var startedAtRef = useRef(null);
|
|
3552
|
-
var loopId = useRef(0);
|
|
3553
|
-
var frameId = useRef(0);
|
|
3554
|
-
useEffect(function runFrameLoop() {
|
|
3555
|
-
if (!running) return;
|
|
3556
|
-
var timer;
|
|
3557
|
-
var currentLoopId = loopId.current;
|
|
3558
|
-
function hotLoop() {
|
|
3559
|
-
return __awaiter(this, void 0, void 0, function () {
|
|
3560
|
-
var start, timeRunning, took, amountToThrottle;
|
|
3561
|
-
var _a, _b, _c;
|
|
3562
|
-
return __generator(this, function (_d) {
|
|
3563
|
-
switch (_d.label) {
|
|
3564
|
-
case 0:
|
|
3565
|
-
if (currentLoopId !== loopId.current) return [2 /*return*/];
|
|
3566
|
-
start = new Date().getTime();
|
|
3567
|
-
timeRunning = start - ((_b = (_a = startedAtRef.current) === null || _a === void 0 ? void 0 : _a.getTime()) !== null && _b !== void 0 ? _b : 0);
|
|
3568
|
-
return [4 /*yield*/, fn(frameId.current, timeRunning)];
|
|
3569
|
-
case 1:
|
|
3570
|
-
_d.sent();
|
|
3571
|
-
took = new Date().getTime() - start;
|
|
3572
|
-
amountToThrottle = Math.max(((_c = options.throttleMs) !== null && _c !== void 0 ? _c : 0) - took, 0);
|
|
3573
|
-
timer = setTimeout(function () {
|
|
3574
|
-
frameId.current = requestAnimationFrame(hotLoop);
|
|
3575
|
-
}, amountToThrottle);
|
|
3576
|
-
return [2 /*return*/];
|
|
3577
|
-
}
|
|
3578
|
-
});
|
|
3579
|
-
});
|
|
3580
|
-
}
|
|
3581
|
-
void hotLoop();
|
|
3582
|
-
return function () {
|
|
3583
|
-
loopId.current += 1;
|
|
3584
|
-
if (frameId.current) cancelAnimationFrame(frameId.current);
|
|
3585
|
-
if (timer) clearTimeout(timer);
|
|
3586
|
-
};
|
|
3587
|
-
}, [fn, running, options.throttleMs]);
|
|
3588
|
-
var start = useCallback(function () {
|
|
3589
|
-
startedAtRef.current = new Date();
|
|
3590
|
-
setRunning(true);
|
|
3591
|
-
}, []);
|
|
3592
|
-
var stop = useCallback(function () {
|
|
3593
|
-
loopId.current += 1; // force the loop to stop immediately.
|
|
3594
|
-
setRunning(false);
|
|
3595
|
-
startedAtRef.current = null;
|
|
3596
|
-
}, []);
|
|
3597
|
-
useEffect(function startAutomatically() {
|
|
3598
|
-
if (options.autoStart) start();
|
|
3599
|
-
return stop;
|
|
3600
|
-
}, [options.autoStart, start, stop]);
|
|
3601
|
-
return {
|
|
3602
|
-
start: start,
|
|
3603
|
-
stop: stop
|
|
3604
|
-
};
|
|
3605
|
-
}
|
|
3606
|
-
|
|
3607
|
-
function listAvailableCameras(facingMode_1) {
|
|
3608
|
-
return __awaiter(this, arguments, void 0, function (facingMode, requestMicAccess) {
|
|
3609
|
-
var cameraEnumerationStream, allDevices, allowedVideoDevices;
|
|
3610
|
-
if (requestMicAccess === void 0) {
|
|
3611
|
-
requestMicAccess = false;
|
|
3612
|
-
}
|
|
3613
|
-
return __generator(this, function (_a) {
|
|
3614
|
-
switch (_a.label) {
|
|
3615
|
-
case 0:
|
|
3616
|
-
return [4 /*yield*/, navigator.mediaDevices.getUserMedia({
|
|
3617
|
-
video: {
|
|
3618
|
-
facingMode: {
|
|
3619
|
-
exact: facingMode
|
|
3620
|
-
}
|
|
3621
|
-
},
|
|
3622
|
-
audio: requestMicAccess
|
|
3623
|
-
})
|
|
3624
|
-
// This lists all available cameras attached to the user's device.
|
|
3625
|
-
];
|
|
3626
|
-
case 1:
|
|
3627
|
-
cameraEnumerationStream = _a.sent();
|
|
3628
|
-
return [4 /*yield*/, navigator.mediaDevices.enumerateDevices()];
|
|
3629
|
-
case 2:
|
|
3630
|
-
allDevices = _a.sent();
|
|
3631
|
-
allowedVideoDevices = allDevices.filter(function (_a) {
|
|
3632
|
-
var kind = _a.kind,
|
|
3633
|
-
label = _a.label;
|
|
3634
|
-
return kind === 'videoinput' && !label.toLowerCase().includes('virtual');
|
|
3635
|
-
});
|
|
3636
|
-
// Release the access to the user's camera that we obtained for enumeration purposes.
|
|
3637
|
-
cameraEnumerationStream.getVideoTracks().forEach(function (track) {
|
|
3638
|
-
track.enabled = false;
|
|
3639
|
-
track.stop();
|
|
3640
|
-
});
|
|
3641
|
-
cameraEnumerationStream = null;
|
|
3642
|
-
return [2 /*return*/, allowedVideoDevices];
|
|
3643
|
-
}
|
|
3644
|
-
});
|
|
3645
|
-
});
|
|
3646
|
-
}
|
|
3647
|
-
var frontCameraLabels = ['front', 'avant', 'anteriore', 'cameraaanvoorzijde', 'kamerapåframsidan', 'forsidekamera', 'kamerapåforsiden', 'aparatprzedni', 'etukamera', 'kameradepan', 'ÖnKamera', 'cameramặttrước', 'camerăfață', 'prednákamera', 'prednjakamera', 'előlapikamera', 'přednífotoaparát', 'μπροστινήκάμερα', 'переднякамера', 'передняякамера', 'преднакамера', 'алдыңғыкамера', 'מצלמה קדמית', 'الكاميرا الأمامية', 'फ़्रंटकैमरा', '前置相机', '前置鏡頭', '前面カメラ', '전면카메라', 'กล้องด้านหน้า'].map(function (s) {
|
|
3648
|
-
return s.toLocaleLowerCase().split(' ').join('');
|
|
3649
|
-
});
|
|
3650
|
-
var rearCameraLabels = ['back', 'rear', 'posterior', 'trasera', 'traseira', 'arrière', 'rückkamera', 'fotocamera(posteriore)', 'cameraaanachterzijde', 'kamerapåbaksidan', 'kamerapåbaksiden', 'bagsidekamera', 'aparattylny', 'takakamera', 'arkakamera', 'kamerabelakang', 'cameramặtsau', 'camerăspate', 'stražnjakamera', 'zadnákamera', 'hátoldalikamera', 'zadnífotoaparát', 'πίσωκάμερα', 'заднякамера', 'Задняякамера', 'заднакамера', 'артқыкамера', 'מצלמה אחורית', 'الكاميرا الخلفية', 'बैककैमरा', '后置相机', '後置鏡頭', '背面カメラ', '후면카메라', 'กล้องด้านหลัง'].map(function (s) {
|
|
3651
|
-
return s.toLocaleLowerCase().split(' ').join('');
|
|
3652
|
-
});
|
|
3653
|
-
var backUltraWideCameraLabels = ['backdualwidecamera', 'backultrawidecamera', 'ultraampliaposterior', 'ultra-angulartraseira', 'ultragrandeangulartraseira', 'ultragrandangle', 'ultragranangular', 'ultra-weitwinkelkamera', 'ultra-grandangolo', 'ultrabredecameraaanachterzijde', 'ultravidvinkelkamerapåbaksidan', 'ultravidvinkelkameraetpåbagsiden', 'ultravidvinkelkamerabak', 'ultragenişkameraarkayüzü', 'ultralaajakulmainentakakamera', 'tylnyaparatultraszerokokątny', 'cameracựcrộngmặtsau', 'camerăcuobiectivultra‑superangularspate', 'ultraszéleslátószögűkamera', 'kameraultralebarbelakang', 'stražnjaultraširokakamera', 'zadníultraširokoúhlýfotoaparát', 'ultraširokouhlá', 'πίσωυπερευρείακάμερα', 'заднянадширококутнакамера', 'Задняясверхширокоугольнаякамера', 'Задна свръх широкоъгълна камера', 'артқыультракеңбұрыштыкамера', 'מצלמה אולטרה רחבה אחורית', 'كاميرا خلفية عريضة جدًا', 'बैकअल्ट्रावाइडकैमरा', '后置超广角相机', '後置超廣角鏡頭相機', '背面超広角カメラ', '후면울트라와이드카메라', 'กล้องด้านหลังอัลตร้าไวด์'].map(function (s) {
|
|
3654
|
-
return s.toLocaleLowerCase().split(' ').join('');
|
|
3655
|
-
});
|
|
3656
|
-
var cameraLabelMatches = function cameraLabelMatches(labelOrDevice, labelSetOrLabel) {
|
|
3657
|
-
var label = labelOrDevice instanceof MediaDeviceInfo ? getDeviceLabel(labelOrDevice) : labelOrDevice;
|
|
3658
|
-
var labelSet = typeof labelSetOrLabel === 'string' ? [labelSetOrLabel] : labelSetOrLabel;
|
|
3659
|
-
return labelSet.some(function (l) {
|
|
3660
|
-
return label.includes(l);
|
|
3661
|
-
});
|
|
3662
|
-
};
|
|
3663
|
-
var getDeviceLabel = function getDeviceLabel(deviceInfo) {
|
|
3664
|
-
return deviceInfo.label.toLocaleLowerCase().split(' ').join('');
|
|
3665
|
-
};
|
|
3666
|
-
var currentCamera;
|
|
3667
|
-
function obtainCameraAccess(stream, deviceLabel, video) {
|
|
3668
|
-
releaseCameraAccess();
|
|
3669
|
-
log('obtaining camera access...');
|
|
3670
|
-
var _a = stream.getVideoTracks()[0].getSettings(),
|
|
3671
|
-
width = _a.width,
|
|
3672
|
-
height = _a.height;
|
|
3673
|
-
log('camera dimensions', width, height);
|
|
3674
|
-
var label = deviceLabel.toLocaleLowerCase().split(' ').join('');
|
|
3675
|
-
log('camera label', label);
|
|
3676
|
-
var isRearFacing = cameraLabelMatches(label, __spreadArray(__spreadArray(__spreadArray([], rearCameraLabels, true), backUltraWideCameraLabels, true), ['iphone'], false));
|
|
3677
|
-
log('is rear facing?', isRearFacing);
|
|
3678
|
-
var release = function release() {
|
|
3679
|
-
stream.getTracks().forEach(function (track) {
|
|
3680
|
-
track.enabled = false;
|
|
3681
|
-
track.stop();
|
|
3682
|
-
});
|
|
3683
|
-
if (video) {
|
|
3684
|
-
video.pause();
|
|
3685
|
-
video.srcObject = null;
|
|
3686
|
-
video.src = '';
|
|
3687
|
-
}
|
|
3688
|
-
};
|
|
3689
|
-
width || (width = 0);
|
|
3690
|
-
height || (height = 0);
|
|
3691
|
-
currentCamera = {
|
|
3692
|
-
label: deviceLabel,
|
|
3693
|
-
stream: stream,
|
|
3694
|
-
width: width,
|
|
3695
|
-
height: height,
|
|
3696
|
-
isRearFacing: isRearFacing,
|
|
3697
|
-
release: release
|
|
3698
|
-
};
|
|
3699
|
-
log('camera access granted');
|
|
3700
|
-
// if (video) video.srcObject = stream
|
|
3701
|
-
// log('video source initialized')
|
|
3702
|
-
return currentCamera;
|
|
3703
|
-
}
|
|
3704
|
-
function releaseCameraAccess() {
|
|
3705
|
-
if (!currentCamera) return;
|
|
3706
|
-
log('releasing camera access...');
|
|
3707
|
-
currentCamera.release();
|
|
3708
|
-
currentCamera = undefined;
|
|
3151
|
+
function releaseCameraAccess() {
|
|
3152
|
+
if (!currentCamera) return;
|
|
3153
|
+
log('releasing camera access...');
|
|
3154
|
+
currentCamera.release();
|
|
3155
|
+
currentCamera = undefined;
|
|
3709
3156
|
}
|
|
3710
3157
|
|
|
3711
3158
|
var en = {};
|
|
@@ -5312,224 +4759,768 @@ function CameraTamperSeal(_a) {
|
|
|
5312
4759
|
className: classNames.message
|
|
5313
4760
|
}, messageText)));
|
|
5314
4761
|
}
|
|
5315
|
-
var StyledOverlayInner$4 = styled(OverlayInner$2)(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
5316
|
-
var StyledOverlayHeading = styled.h3(templateObject_2$F || (templateObject_2$F = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
5317
|
-
function useCameraStore(selector) {
|
|
5318
|
-
var store = useContext(CameraStoreContext);
|
|
5319
|
-
if (!store) throw new Error('useCameraStore cannot be used without Provider');
|
|
5320
|
-
return useStore(store, selector);
|
|
4762
|
+
var StyledOverlayInner$4 = styled(OverlayInner$2)(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n justify-content: center;\n"], ["\n justify-content: center;\n"])));
|
|
4763
|
+
var StyledOverlayHeading = styled.h3(templateObject_2$F || (templateObject_2$F = __makeTemplateObject(["\n margin-bottom: 8px;\n"], ["\n margin-bottom: 8px;\n"])));
|
|
4764
|
+
function useCameraStore(selector) {
|
|
4765
|
+
var store = useContext(CameraStoreContext);
|
|
4766
|
+
if (!store) throw new Error('useCameraStore cannot be used without Provider');
|
|
4767
|
+
return useStore(store, selector);
|
|
4768
|
+
}
|
|
4769
|
+
var templateObject_1$M, templateObject_2$F;
|
|
4770
|
+
|
|
4771
|
+
var DocumentDetectionModelContext = /*#__PURE__*/createContext({
|
|
4772
|
+
startDocumentDetection: function startDocumentDetection() {
|
|
4773
|
+
return null;
|
|
4774
|
+
},
|
|
4775
|
+
stopDocumentDetection: function stopDocumentDetection() {
|
|
4776
|
+
return null;
|
|
4777
|
+
},
|
|
4778
|
+
loadDocumentDetectionModel: function loadDocumentDetectionModel() {
|
|
4779
|
+
return null;
|
|
4780
|
+
},
|
|
4781
|
+
documentDetectionModelState: 'not-started',
|
|
4782
|
+
documentDetectionModelDownloadProgress: 0,
|
|
4783
|
+
documentDetectionModelWarmingStartedAt: null,
|
|
4784
|
+
documentDetectionModelError: null,
|
|
4785
|
+
onDocumentDetected: function onDocumentDetected() {
|
|
4786
|
+
return null;
|
|
4787
|
+
},
|
|
4788
|
+
detectionTime: 0,
|
|
4789
|
+
documentDetectionThresholds: {},
|
|
4790
|
+
setDocumentDetectionThresholds: function setDocumentDetectionThresholds() {
|
|
4791
|
+
return null;
|
|
4792
|
+
},
|
|
4793
|
+
documentDetectionBoundaries: defaultDocumentDetectionBoundaries,
|
|
4794
|
+
setDocumentDetectionBoundaries: function setDocumentDetectionBoundaries() {
|
|
4795
|
+
return null;
|
|
4796
|
+
},
|
|
4797
|
+
documentDetectionLastPredictionCanvas: {
|
|
4798
|
+
current: null
|
|
4799
|
+
},
|
|
4800
|
+
clearDocumentDetectionLastPredictionCanvas: function clearDocumentDetectionLastPredictionCanvas() {
|
|
4801
|
+
return null;
|
|
4802
|
+
}
|
|
4803
|
+
});
|
|
4804
|
+
function DocumentDetectionModelProvider(_a) {
|
|
4805
|
+
var _this = this;
|
|
4806
|
+
var _b = _a.autoStart,
|
|
4807
|
+
autoStart = _b === void 0 ? true : _b,
|
|
4808
|
+
children = _a.children,
|
|
4809
|
+
_c = _a.throttleMs,
|
|
4810
|
+
throttleMs = _c === void 0 ? 16 : _c,
|
|
4811
|
+
_d = _a.delayAfterStartMs,
|
|
4812
|
+
delayAfterStartMs = _d === void 0 ? 0 : _d,
|
|
4813
|
+
_e = _a.documentDetectionModelPath,
|
|
4814
|
+
documentDetectionModelPath = _e === void 0 ? defaultDocumentDetectorModelPath : _e,
|
|
4815
|
+
_f = _a.documentDetectionModelScoreThreshold,
|
|
4816
|
+
documentDetectionModelScoreThreshold = _f === void 0 ? defaultDocumentDetectionScoreThreshold : _f,
|
|
4817
|
+
_g = _a.modelLoadTimeoutMs,
|
|
4818
|
+
modelLoadTimeoutMs = _g === void 0 ? defaultDocumentDetectionModelLoadTimeoutMs : _g,
|
|
4819
|
+
onDocumentDetectionModelError = _a.onDocumentDetectionModelError,
|
|
4820
|
+
_h = _a.shouldLoadModels,
|
|
4821
|
+
shouldLoadModelsProp = _h === void 0 ? true : _h;
|
|
4822
|
+
var _j = useCameraStore(),
|
|
4823
|
+
videoRef = _j.videoRef,
|
|
4824
|
+
videoLoaded = _j.videoLoaded,
|
|
4825
|
+
cameraReady = _j.cameraReady;
|
|
4826
|
+
var lastPredictionCanvas = useRef(null);
|
|
4827
|
+
var onPredictionHandler = useRef();
|
|
4828
|
+
var _k = useState({}),
|
|
4829
|
+
documentDetectionThresholds = _k[0],
|
|
4830
|
+
setDocumentDetectionThresholds = _k[1];
|
|
4831
|
+
var _l = useState(defaultDocumentDetectionBoundaries),
|
|
4832
|
+
documentDetectionBoundaries = _l[0],
|
|
4833
|
+
setDocumentDetectionBoundaries = _l[1];
|
|
4834
|
+
var _m = useState(0),
|
|
4835
|
+
timesAllZero = _m[0],
|
|
4836
|
+
setTimesAllZero = _m[1];
|
|
4837
|
+
var _o = useState(0),
|
|
4838
|
+
canvasKey = _o[0],
|
|
4839
|
+
setCanvasKey = _o[1];
|
|
4840
|
+
var stopDetection = useRef(0);
|
|
4841
|
+
var _p = useState(shouldLoadModelsProp),
|
|
4842
|
+
shouldLoadModels = _p[0],
|
|
4843
|
+
setShouldLoadModels = _p[1];
|
|
4844
|
+
var load = useCallback(function () {
|
|
4845
|
+
return setShouldLoadModels(true);
|
|
4846
|
+
}, []);
|
|
4847
|
+
var _q = useLoadDocumentDetector({
|
|
4848
|
+
modelPath: documentDetectionModelPath,
|
|
4849
|
+
modelLoadTimeoutMs: modelLoadTimeoutMs,
|
|
4850
|
+
scoreThreshold: documentDetectionModelScoreThreshold,
|
|
4851
|
+
onModelError: onDocumentDetectionModelError,
|
|
4852
|
+
videoRef: videoRef,
|
|
4853
|
+
shouldLoadModels: shouldLoadModels
|
|
4854
|
+
}),
|
|
4855
|
+
ready = _q.ready,
|
|
4856
|
+
modelLoadState = _q.modelLoadState,
|
|
4857
|
+
modelDownloadProgress = _q.modelDownloadProgress,
|
|
4858
|
+
modelWarmingStartedAt = _q.modelWarmingStartedAt,
|
|
4859
|
+
modelError = _q.modelError,
|
|
4860
|
+
setModelError = _q.setModelError;
|
|
4861
|
+
var _r = useFrameLoop(useCallback(function (frameId, timeRunning) {
|
|
4862
|
+
return __awaiter(_this, void 0, void 0, function () {
|
|
4863
|
+
var stopDetectionAtStart, vw, vh, ctx, prediction, processedPrediction;
|
|
4864
|
+
var _a;
|
|
4865
|
+
return __generator(this, function (_b) {
|
|
4866
|
+
switch (_b.label) {
|
|
4867
|
+
case 0:
|
|
4868
|
+
if (!videoLoaded || !cameraReady || !ready || !videoRef.current || !lastPredictionCanvas.current) return [2 /*return*/];
|
|
4869
|
+
stopDetectionAtStart = stopDetection.current;
|
|
4870
|
+
vw = videoRef.current.videoWidth;
|
|
4871
|
+
vh = videoRef.current.videoHeight;
|
|
4872
|
+
lastPredictionCanvas.current.width = vw;
|
|
4873
|
+
lastPredictionCanvas.current.height = vh;
|
|
4874
|
+
ctx = lastPredictionCanvas.current.getContext('2d');
|
|
4875
|
+
if (!(ctx && videoRef.current.readyState === 4)) return [3 /*break*/, 3];
|
|
4876
|
+
if (stopDetectionAtStart !== stopDetection.current) return [2 /*return*/];
|
|
4877
|
+
ctx.drawImage(videoRef.current, 0, 0, vw, vh);
|
|
4878
|
+
return [4 /*yield*/, makeDocumentDetectorPrediction(lastPredictionCanvas.current)];
|
|
4879
|
+
case 1:
|
|
4880
|
+
prediction = _b.sent();
|
|
4881
|
+
if (!prediction) return [3 /*break*/, 3];
|
|
4882
|
+
processedPrediction = processDocumentDetectorPrediction(prediction, documentDetectionThresholds, documentDetectionBoundaries);
|
|
4883
|
+
processedPrediction.frameId = frameId;
|
|
4884
|
+
setLastDetectionAt(new Date().getTime());
|
|
4885
|
+
debug(processedPrediction);
|
|
4886
|
+
if (processedPrediction.allZero) setTimesAllZero(function (n) {
|
|
4887
|
+
return n + 1;
|
|
4888
|
+
});
|
|
4889
|
+
if (stopDetectionAtStart !== stopDetection.current) return [2 /*return*/];
|
|
4890
|
+
if (timeRunning < delayAfterStartMs) return [2 /*return*/];
|
|
4891
|
+
return [4 /*yield*/, (_a = onPredictionHandler.current) === null || _a === void 0 ? void 0 : _a.call(onPredictionHandler, processedPrediction)];
|
|
4892
|
+
case 2:
|
|
4893
|
+
_b.sent();
|
|
4894
|
+
_b.label = 3;
|
|
4895
|
+
case 3:
|
|
4896
|
+
return [2 /*return*/];
|
|
4897
|
+
}
|
|
4898
|
+
});
|
|
4899
|
+
});
|
|
4900
|
+
}, [cameraReady, delayAfterStartMs, documentDetectionBoundaries, documentDetectionThresholds, ready, videoLoaded, videoRef]), {
|
|
4901
|
+
throttleMs: throttleMs,
|
|
4902
|
+
autoStart: autoStart
|
|
4903
|
+
}),
|
|
4904
|
+
start = _r.start,
|
|
4905
|
+
stop = _r.stop;
|
|
4906
|
+
useEffect(function setErrorIfAllZero() {
|
|
4907
|
+
if (timesAllZero >= 2) {
|
|
4908
|
+
setModelError(new Error('model is returning all zeroes'));
|
|
4909
|
+
}
|
|
4910
|
+
}, [setModelError, timesAllZero]);
|
|
4911
|
+
var onDocumentDetected = useCallback(function (handler) {
|
|
4912
|
+
onPredictionHandler.current = handler;
|
|
4913
|
+
}, []);
|
|
4914
|
+
var clearDocumentDetectionLastPredictionCanvas = useCallback(function () {
|
|
4915
|
+
stopDetection.current += 1;
|
|
4916
|
+
setCanvasKey(function (n) {
|
|
4917
|
+
return n + 1;
|
|
4918
|
+
});
|
|
4919
|
+
}, []);
|
|
4920
|
+
var value = useMemo(function () {
|
|
4921
|
+
return {
|
|
4922
|
+
startDocumentDetection: start,
|
|
4923
|
+
stopDocumentDetection: stop,
|
|
4924
|
+
loadDocumentDetectionModel: load,
|
|
4925
|
+
documentDetectionModelState: modelLoadState,
|
|
4926
|
+
documentDetectionModelWarmingStartedAt: modelWarmingStartedAt,
|
|
4927
|
+
documentDetectionModelError: modelError,
|
|
4928
|
+
documentDetectionModelDownloadProgress: modelDownloadProgress,
|
|
4929
|
+
onDocumentDetected: onDocumentDetected,
|
|
4930
|
+
detectionTime: lastDetectionTime,
|
|
4931
|
+
documentDetectionThresholds: documentDetectionThresholds,
|
|
4932
|
+
setDocumentDetectionThresholds: setDocumentDetectionThresholds,
|
|
4933
|
+
documentDetectionBoundaries: documentDetectionBoundaries,
|
|
4934
|
+
setDocumentDetectionBoundaries: setDocumentDetectionBoundaries,
|
|
4935
|
+
documentDetectionLastPredictionCanvas: lastPredictionCanvas,
|
|
4936
|
+
clearDocumentDetectionLastPredictionCanvas: clearDocumentDetectionLastPredictionCanvas
|
|
4937
|
+
};
|
|
4938
|
+
}, [start, stop, load, modelLoadState, modelWarmingStartedAt, modelError, modelDownloadProgress, onDocumentDetected, documentDetectionThresholds, documentDetectionBoundaries, clearDocumentDetectionLastPredictionCanvas]);
|
|
4939
|
+
return /*#__PURE__*/React.createElement(DocumentDetectionModelContext.Provider, {
|
|
4940
|
+
value: value
|
|
4941
|
+
}, /*#__PURE__*/React.createElement(InvisibleCanvas, {
|
|
4942
|
+
key: canvasKey,
|
|
4943
|
+
ref: lastPredictionCanvas
|
|
4944
|
+
}), children);
|
|
4945
|
+
}
|
|
4946
|
+
|
|
4947
|
+
function cropToShoulders(rawCanvas, cropCanvas, resizeCanvas, frame, face, quality, maxHeight) {
|
|
4948
|
+
var _a;
|
|
4949
|
+
if (quality === void 0) {
|
|
4950
|
+
quality = 0.92;
|
|
4951
|
+
}
|
|
4952
|
+
if (!rawCanvas || !cropCanvas || !resizeCanvas) return '';
|
|
4953
|
+
var rawCtx = rawCanvas.getContext('2d');
|
|
4954
|
+
var cropCtx = cropCanvas.getContext('2d');
|
|
4955
|
+
var resizeCtx = resizeCanvas.getContext('2d');
|
|
4956
|
+
if (!rawCtx || !cropCtx || !resizeCtx) throw new Error('could not get 2d context');
|
|
4957
|
+
rawCanvas.width = frame.width;
|
|
4958
|
+
rawCanvas.height = frame.height;
|
|
4959
|
+
rawCtx.putImageData(frame, 0, 0);
|
|
4960
|
+
if (frame.height > frame.width) {
|
|
4961
|
+
cropCanvas.width = frame.width;
|
|
4962
|
+
cropCanvas.height = frame.height;
|
|
4963
|
+
cropCtx.drawImage(rawCanvas, 0, 0, cropCanvas.width, cropCanvas.height);
|
|
4964
|
+
} else {
|
|
4965
|
+
var _b = (_a = face === null || face === void 0 ? void 0 : face.box) !== null && _a !== void 0 ? _a : {
|
|
4966
|
+
xMin: 0,
|
|
4967
|
+
width: frame.width
|
|
4968
|
+
},
|
|
4969
|
+
xMin = _b.xMin,
|
|
4970
|
+
width = _b.width;
|
|
4971
|
+
var desiredWidth = frame.height * 0.6;
|
|
4972
|
+
var faceCenterX = xMin + width / 2;
|
|
4973
|
+
var xPos = Math.max(0, faceCenterX - desiredWidth / 2);
|
|
4974
|
+
cropCanvas.width = desiredWidth;
|
|
4975
|
+
cropCanvas.height = frame.height;
|
|
4976
|
+
cropCtx.drawImage(rawCanvas, xPos, 0, cropCanvas.width, cropCanvas.height, 0, 0, cropCanvas.width, cropCanvas.height);
|
|
4977
|
+
}
|
|
4978
|
+
resizeCanvas.height = maxHeight !== null && maxHeight !== void 0 ? maxHeight : cropCanvas.height;
|
|
4979
|
+
resizeCanvas.width = cropCanvas.width * (resizeCanvas.height / cropCanvas.height);
|
|
4980
|
+
resizeCtx === null || resizeCtx === void 0 ? void 0 : resizeCtx.drawImage(cropCanvas, 0, 0, resizeCanvas.width, resizeCanvas.height);
|
|
4981
|
+
var dataURL = resizeCanvas.toDataURL('image/jpeg', quality);
|
|
4982
|
+
log('cropToShoulders size', new TextEncoder().encode(dataURL).length);
|
|
4983
|
+
clearCanvas(rawCanvas);
|
|
4984
|
+
clearCanvas(cropCanvas);
|
|
4985
|
+
clearCanvas(resizeCanvas);
|
|
4986
|
+
return dataURL;
|
|
4987
|
+
}
|
|
4988
|
+
function cropToDetectedObjectBox(frame, box, canvas, padding) {
|
|
4989
|
+
if (padding === void 0) {
|
|
4990
|
+
padding = 0;
|
|
4991
|
+
}
|
|
4992
|
+
canvas || (canvas = document.createElement('canvas'));
|
|
4993
|
+
var ctx = canvas.getContext('2d');
|
|
4994
|
+
if (!ctx) throw new Error('could not get 2d context');
|
|
4995
|
+
var xMin = box.xMin,
|
|
4996
|
+
yMin = box.yMin,
|
|
4997
|
+
width = box.width,
|
|
4998
|
+
height = box.height;
|
|
4999
|
+
canvas.width = width + padding * 2;
|
|
5000
|
+
canvas.height = height + padding * 2;
|
|
5001
|
+
ctx.drawImage(frame, xMin - padding, yMin - padding, width + padding * 2, height + padding * 2, 0, 0, canvas.width, canvas.height);
|
|
5002
|
+
return canvas;
|
|
5003
|
+
}
|
|
5004
|
+
function cropAndRotateIfNecessary(imageData, cropCanvas, rotateCanvas, box, padding) {
|
|
5005
|
+
if (padding === void 0) {
|
|
5006
|
+
padding = 0;
|
|
5007
|
+
}
|
|
5008
|
+
if (!box) return imageData;
|
|
5009
|
+
var cropped = cropToDetectedObjectBox(imageData, box, cropCanvas, padding);
|
|
5010
|
+
var _a = [box.width, box.height],
|
|
5011
|
+
bw = _a[0],
|
|
5012
|
+
bh = _a[1];
|
|
5013
|
+
if (bh <= bw) return cropped;
|
|
5014
|
+
var ctx = rotateCanvas.getContext('2d');
|
|
5015
|
+
if (!ctx) return cropped;
|
|
5016
|
+
rotateCanvas.width = bh;
|
|
5017
|
+
rotateCanvas.height = bw;
|
|
5018
|
+
ctx.clearRect(0, 0, rotateCanvas.width, rotateCanvas.height);
|
|
5019
|
+
ctx.translate(rotateCanvas.width / 2, rotateCanvas.height / 2);
|
|
5020
|
+
ctx.rotate(1.5708); // 90 deg in radians
|
|
5021
|
+
ctx.drawImage(cropped, -bw / 2, -bh / 2);
|
|
5022
|
+
return rotateCanvas;
|
|
5023
|
+
}
|
|
5024
|
+
function resizeIfNecessary(imageData, resizeCanvas, maxWidth) {
|
|
5025
|
+
var width = imageData.width,
|
|
5026
|
+
height = imageData.height;
|
|
5027
|
+
if (width <= maxWidth) return imageData;
|
|
5028
|
+
var resizeCtx = resizeCanvas.getContext('2d');
|
|
5029
|
+
if (!resizeCtx) return imageData;
|
|
5030
|
+
var scale = maxWidth / width;
|
|
5031
|
+
resizeCanvas.width = maxWidth;
|
|
5032
|
+
resizeCanvas.height = height * scale;
|
|
5033
|
+
resizeCtx.drawImage(imageData, 0, 0, resizeCanvas.width, resizeCanvas.height);
|
|
5034
|
+
return resizeCanvas;
|
|
5321
5035
|
}
|
|
5322
|
-
var templateObject_1$M, templateObject_2$F;
|
|
5323
5036
|
|
|
5324
|
-
var
|
|
5325
|
-
|
|
5326
|
-
|
|
5327
|
-
|
|
5328
|
-
|
|
5329
|
-
return null;
|
|
5330
|
-
},
|
|
5331
|
-
loadDocumentDetectionModel: function loadDocumentDetectionModel() {
|
|
5332
|
-
return null;
|
|
5333
|
-
},
|
|
5334
|
-
documentDetectionModelState: 'not-started',
|
|
5335
|
-
documentDetectionModelDownloadProgress: 0,
|
|
5336
|
-
documentDetectionModelWarmingStartedAt: null,
|
|
5337
|
-
documentDetectionModelError: null,
|
|
5338
|
-
onDocumentDetected: function onDocumentDetected() {
|
|
5339
|
-
return null;
|
|
5340
|
-
},
|
|
5341
|
-
detectionTime: 0,
|
|
5342
|
-
documentDetectionThresholds: {},
|
|
5343
|
-
setDocumentDetectionThresholds: function setDocumentDetectionThresholds() {
|
|
5344
|
-
return null;
|
|
5037
|
+
var defaultFocusModelLoadTimeoutMs = 45000;
|
|
5038
|
+
var defaultFocusThresholds = {
|
|
5039
|
+
idCardFront: {
|
|
5040
|
+
desktop: 0,
|
|
5041
|
+
mobile: 0.3
|
|
5345
5042
|
},
|
|
5346
|
-
|
|
5347
|
-
|
|
5348
|
-
|
|
5043
|
+
idCardBack: {
|
|
5044
|
+
desktop: 0,
|
|
5045
|
+
mobile: 0.3
|
|
5349
5046
|
},
|
|
5350
|
-
|
|
5351
|
-
|
|
5047
|
+
passport: {
|
|
5048
|
+
desktop: 0,
|
|
5049
|
+
mobile: 0.3
|
|
5352
5050
|
},
|
|
5353
|
-
|
|
5354
|
-
|
|
5051
|
+
singlePage: {
|
|
5052
|
+
desktop: 0,
|
|
5053
|
+
mobile: 0.3
|
|
5355
5054
|
}
|
|
5356
|
-
}
|
|
5357
|
-
|
|
5358
|
-
|
|
5359
|
-
|
|
5360
|
-
|
|
5361
|
-
|
|
5362
|
-
|
|
5363
|
-
|
|
5364
|
-
|
|
5365
|
-
|
|
5366
|
-
|
|
5367
|
-
|
|
5368
|
-
|
|
5369
|
-
|
|
5370
|
-
|
|
5371
|
-
|
|
5372
|
-
|
|
5373
|
-
|
|
5374
|
-
|
|
5375
|
-
|
|
5376
|
-
|
|
5377
|
-
|
|
5378
|
-
|
|
5379
|
-
|
|
5380
|
-
|
|
5381
|
-
|
|
5382
|
-
|
|
5383
|
-
|
|
5384
|
-
|
|
5385
|
-
|
|
5386
|
-
|
|
5387
|
-
|
|
5388
|
-
|
|
5389
|
-
|
|
5390
|
-
|
|
5391
|
-
|
|
5392
|
-
|
|
5393
|
-
|
|
5394
|
-
|
|
5395
|
-
|
|
5396
|
-
|
|
5055
|
+
};
|
|
5056
|
+
var classifier$1 = null;
|
|
5057
|
+
var classifierSettings$1 = null;
|
|
5058
|
+
function loadFocusModel() {
|
|
5059
|
+
return __awaiter(this, arguments, void 0, function (modelAssetPath) {
|
|
5060
|
+
var _a, _b;
|
|
5061
|
+
if (modelAssetPath === void 0) {
|
|
5062
|
+
modelAssetPath = defaultFocusModelPath;
|
|
5063
|
+
}
|
|
5064
|
+
return __generator(this, function (_c) {
|
|
5065
|
+
switch (_c.label) {
|
|
5066
|
+
case 0:
|
|
5067
|
+
if (classifier$1 && (classifierSettings$1 === null || classifierSettings$1 === void 0 ? void 0 : classifierSettings$1.modelAssetPath) === modelAssetPath) return [2 /*return*/, classifier$1];
|
|
5068
|
+
closeFocusModel();
|
|
5069
|
+
return [4 /*yield*/, preloadFocusModelDependencies()];
|
|
5070
|
+
case 1:
|
|
5071
|
+
_c.sent();
|
|
5072
|
+
if (modelCapabilities.delegate === 'NONE') {
|
|
5073
|
+
throw new Error('No available delegate for focus detector.');
|
|
5074
|
+
}
|
|
5075
|
+
_b = (_a = ImageClassifier).createFromOptions;
|
|
5076
|
+
return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
|
|
5077
|
+
case 2:
|
|
5078
|
+
return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
|
|
5079
|
+
baseOptions: {
|
|
5080
|
+
modelAssetPath: modelAssetPath,
|
|
5081
|
+
delegate: modelCapabilities.delegate
|
|
5082
|
+
},
|
|
5083
|
+
// canvas: document.createElement('canvas'),
|
|
5084
|
+
runningMode: 'VIDEO'
|
|
5085
|
+
}])];
|
|
5086
|
+
case 3:
|
|
5087
|
+
classifier$1 = _c.sent();
|
|
5088
|
+
classifierSettings$1 = {
|
|
5089
|
+
modelAssetPath: modelAssetPath
|
|
5090
|
+
};
|
|
5091
|
+
return [2 /*return*/, classifier$1];
|
|
5092
|
+
}
|
|
5093
|
+
});
|
|
5094
|
+
});
|
|
5095
|
+
}
|
|
5096
|
+
function closeFocusModel() {
|
|
5097
|
+
classifier$1 === null || classifier$1 === void 0 ? void 0 : classifier$1.close();
|
|
5098
|
+
classifier$1 = null;
|
|
5099
|
+
classifierSettings$1 = null;
|
|
5100
|
+
}
|
|
5101
|
+
function useLoadFocusModel(_a) {
|
|
5102
|
+
var _b = _a.modelPath,
|
|
5103
|
+
modelPath = _b === void 0 ? defaultFocusModelPath : _b,
|
|
5104
|
+
_c = _a.modelLoadTimeoutMs,
|
|
5105
|
+
modelLoadTimeoutMs = _c === void 0 ? defaultFocusModelLoadTimeoutMs : _c,
|
|
5106
|
+
onModelError = _a.onModelError,
|
|
5107
|
+
videoRef = _a.videoRef,
|
|
5108
|
+
_d = _a.shouldLoadModels,
|
|
5109
|
+
shouldLoadModels = _d === void 0 ? true : _d;
|
|
5110
|
+
var _e = useState('not-started'),
|
|
5111
|
+
modelLoadState = _e[0],
|
|
5112
|
+
setModelLoadState = _e[1];
|
|
5113
|
+
var _f = useState(0),
|
|
5114
|
+
modelDownloadProgress = _f[0],
|
|
5115
|
+
setModelDownloadProgress = _f[1];
|
|
5116
|
+
var _g = useState(null),
|
|
5117
|
+
modelWarmingStartedAt = _g[0],
|
|
5118
|
+
setModelWarmingStartedAt = _g[1];
|
|
5119
|
+
var _h = useState(null),
|
|
5120
|
+
modelError = _h[0],
|
|
5121
|
+
setModelError = _h[1];
|
|
5122
|
+
useEffect(function loadModel() {
|
|
5123
|
+
var _this = this;
|
|
5124
|
+
if (!shouldLoadModels) return;
|
|
5125
|
+
setModelLoadState('downloading');
|
|
5126
|
+
setModelWarmingStartedAt(null);
|
|
5127
|
+
function handleDownloadProgress(event) {
|
|
5128
|
+
setModelDownloadProgress(progressToPercentage(event.detail));
|
|
5129
|
+
}
|
|
5130
|
+
document.addEventListener('idmission.preloadProgress.focus', handleDownloadProgress);
|
|
5131
|
+
var modelLoadTimeout = setTimeout(function () {
|
|
5132
|
+
setModelError(new Error('Model loading time limit exceeded.'));
|
|
5133
|
+
}, modelLoadTimeoutMs);
|
|
5134
|
+
var cancelVideoReady = function cancelVideoReady() {};
|
|
5135
|
+
loadFocusModel(modelPath).then(function (loadedModel) {
|
|
5136
|
+
return __awaiter(_this, void 0, void 0, function () {
|
|
5137
|
+
var _a, videoReady, cancel, cancelled;
|
|
5138
|
+
return __generator(this, function (_b) {
|
|
5139
|
+
switch (_b.label) {
|
|
5140
|
+
case 0:
|
|
5141
|
+
setModelDownloadProgress(100);
|
|
5142
|
+
clearTimeout(modelLoadTimeout);
|
|
5143
|
+
setModelLoadState('warming');
|
|
5144
|
+
setModelWarmingStartedAt(performance.now());
|
|
5145
|
+
_a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
|
|
5146
|
+
cancelled = false;
|
|
5147
|
+
cancelVideoReady = function cancelVideoReady() {
|
|
5148
|
+
cancelled = true;
|
|
5149
|
+
cancel();
|
|
5150
|
+
};
|
|
5151
|
+
return [4 /*yield*/, videoReady];
|
|
5152
|
+
case 1:
|
|
5153
|
+
_b.sent();
|
|
5154
|
+
setTimeout(function () {
|
|
5155
|
+
if (cancelled) return;
|
|
5156
|
+
loadedModel.classifyForVideo(videoRef.current, performance.now());
|
|
5157
|
+
setModelLoadState('ready');
|
|
5158
|
+
}, 500);
|
|
5159
|
+
return [2 /*return*/];
|
|
5160
|
+
}
|
|
5161
|
+
});
|
|
5162
|
+
});
|
|
5163
|
+
})["catch"](function (e) {
|
|
5164
|
+
setModelError(e);
|
|
5165
|
+
setModelLoadState('error');
|
|
5166
|
+
})["finally"](function () {
|
|
5167
|
+
clearTimeout(modelLoadTimeout);
|
|
5168
|
+
});
|
|
5169
|
+
return function () {
|
|
5170
|
+
log('unloading focus model');
|
|
5171
|
+
cancelVideoReady();
|
|
5172
|
+
closeFocusModel();
|
|
5173
|
+
clearTimeout(modelLoadTimeout);
|
|
5174
|
+
document.removeEventListener('idmission.preloadProgress.focus', handleDownloadProgress);
|
|
5175
|
+
};
|
|
5176
|
+
}, [modelPath, modelLoadTimeoutMs, videoRef, shouldLoadModels]);
|
|
5177
|
+
useEffect(function handleModelError() {
|
|
5178
|
+
if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
|
|
5179
|
+
}, [modelError, onModelError]);
|
|
5180
|
+
return useMemo(function () {
|
|
5181
|
+
return {
|
|
5182
|
+
ready: modelLoadState === 'ready',
|
|
5183
|
+
modelLoadState: modelLoadState,
|
|
5184
|
+
modelDownloadProgress: modelDownloadProgress,
|
|
5185
|
+
modelWarmingStartedAt: modelWarmingStartedAt,
|
|
5186
|
+
modelError: modelError
|
|
5187
|
+
};
|
|
5188
|
+
}, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
|
|
5189
|
+
}
|
|
5190
|
+
var lastFocusPredictionAt = 0;
|
|
5191
|
+
var lastFocusPredictionTime = 0;
|
|
5192
|
+
function setLastFocusPredictionAt(time) {
|
|
5193
|
+
lastFocusPredictionTime = time - lastFocusPredictionAt;
|
|
5194
|
+
lastFocusPredictionAt = time;
|
|
5195
|
+
}
|
|
5196
|
+
function makeFocusModelPrediction(imageData, cropCanvas, rotateCanvas, box) {
|
|
5197
|
+
var _a, _b, _c, _d, _e;
|
|
5198
|
+
if (!classifier$1) return null;
|
|
5199
|
+
var startedAt = performance.now();
|
|
5200
|
+
var image = cropAndRotateIfNecessary(imageData, cropCanvas, rotateCanvas, box);
|
|
5201
|
+
var result = classifier$1.classifyForVideo(image, performance.now());
|
|
5202
|
+
var score = (_e = (_d = (_c = (_b = (_a = result === null || result === void 0 ? void 0 : result.classifications) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.categories) === null || _c === void 0 ? void 0 : _c.find(function (c) {
|
|
5203
|
+
return c.categoryName === 'focused';
|
|
5204
|
+
})) === null || _d === void 0 ? void 0 : _d.score) !== null && _e !== void 0 ? _e : 0;
|
|
5205
|
+
var predictionTime = performance.now() - startedAt;
|
|
5206
|
+
return {
|
|
5207
|
+
score: score,
|
|
5208
|
+
predictionTime: predictionTime
|
|
5209
|
+
};
|
|
5210
|
+
}
|
|
5211
|
+
|
|
5212
|
+
var FocusModelContext = /*#__PURE__*/createContext({
|
|
5213
|
+
loadFocusModel: function loadFocusModel() {
|
|
5214
|
+
return null;
|
|
5215
|
+
},
|
|
5216
|
+
focusModelState: 'not-started',
|
|
5217
|
+
focusModelDownloadProgress: 0,
|
|
5218
|
+
focusModelWarmingStartedAt: null,
|
|
5219
|
+
focusModelError: null,
|
|
5220
|
+
focusThresholds: {},
|
|
5221
|
+
setFocusThresholds: function setFocusThresholds() {
|
|
5222
|
+
return null;
|
|
5223
|
+
},
|
|
5224
|
+
makeFocusPrediction: function makeFocusPrediction() {
|
|
5225
|
+
return null;
|
|
5226
|
+
},
|
|
5227
|
+
focusPredictionTime: 0
|
|
5228
|
+
});
|
|
5229
|
+
function FocusModelProvider(_a) {
|
|
5230
|
+
var children = _a.children,
|
|
5231
|
+
_b = _a.focusModelPath,
|
|
5232
|
+
focusModelPath = _b === void 0 ? defaultFocusModelPath : _b,
|
|
5233
|
+
_c = _a.focusModelLoadTimeoutMs,
|
|
5234
|
+
focusModelLoadTimeoutMs = _c === void 0 ? defaultFocusModelLoadTimeoutMs : _c,
|
|
5235
|
+
onFocusModelError = _a.onFocusModelError,
|
|
5236
|
+
_d = _a.showCanvases,
|
|
5237
|
+
showCanvases = _d === void 0 ? false : _d,
|
|
5238
|
+
_e = _a.shouldLoadModels,
|
|
5239
|
+
shouldLoadModelsProp = _e === void 0 ? true : _e;
|
|
5240
|
+
var cropCanvas = useRef(null);
|
|
5241
|
+
var rotateCanvas = useRef(null);
|
|
5242
|
+
var _f = useState({}),
|
|
5243
|
+
focusThresholds = _f[0],
|
|
5244
|
+
setFocusThresholds = _f[1];
|
|
5245
|
+
var videoRef = useCameraStore().videoRef;
|
|
5246
|
+
var _g = useState(shouldLoadModelsProp),
|
|
5247
|
+
shouldLoadModels = _g[0],
|
|
5248
|
+
setShouldLoadModels = _g[1];
|
|
5397
5249
|
var load = useCallback(function () {
|
|
5398
5250
|
return setShouldLoadModels(true);
|
|
5399
5251
|
}, []);
|
|
5400
|
-
var
|
|
5401
|
-
modelPath:
|
|
5402
|
-
modelLoadTimeoutMs:
|
|
5403
|
-
|
|
5404
|
-
onModelError: onDocumentDetectionModelError,
|
|
5252
|
+
var _h = useLoadFocusModel({
|
|
5253
|
+
modelPath: focusModelPath,
|
|
5254
|
+
modelLoadTimeoutMs: focusModelLoadTimeoutMs,
|
|
5255
|
+
onModelError: onFocusModelError,
|
|
5405
5256
|
videoRef: videoRef,
|
|
5406
5257
|
shouldLoadModels: shouldLoadModels
|
|
5407
5258
|
}),
|
|
5408
|
-
ready =
|
|
5409
|
-
modelLoadState =
|
|
5410
|
-
modelDownloadProgress =
|
|
5411
|
-
modelWarmingStartedAt =
|
|
5412
|
-
modelError =
|
|
5413
|
-
|
|
5414
|
-
|
|
5259
|
+
ready = _h.ready,
|
|
5260
|
+
modelLoadState = _h.modelLoadState,
|
|
5261
|
+
modelDownloadProgress = _h.modelDownloadProgress,
|
|
5262
|
+
modelWarmingStartedAt = _h.modelWarmingStartedAt,
|
|
5263
|
+
modelError = _h.modelError;
|
|
5264
|
+
var makeFocusPrediction = useCallback(function (imageData, box) {
|
|
5265
|
+
if (!ready) return null;
|
|
5266
|
+
var prediction = makeFocusModelPrediction(imageData, cropCanvas.current, rotateCanvas.current, box);
|
|
5267
|
+
if (!prediction) return null;
|
|
5268
|
+
setLastFocusPredictionAt(prediction.predictionTime);
|
|
5269
|
+
return prediction;
|
|
5270
|
+
}, [ready]);
|
|
5271
|
+
var value = useMemo(function () {
|
|
5272
|
+
return {
|
|
5273
|
+
loadFocusModel: load,
|
|
5274
|
+
focusModelState: modelLoadState,
|
|
5275
|
+
focusModelDownloadProgress: modelDownloadProgress,
|
|
5276
|
+
focusModelWarmingStartedAt: modelWarmingStartedAt,
|
|
5277
|
+
focusModelError: modelError,
|
|
5278
|
+
makeFocusPrediction: makeFocusPrediction,
|
|
5279
|
+
focusPredictionTime: lastFocusPredictionTime,
|
|
5280
|
+
focusThresholds: focusThresholds,
|
|
5281
|
+
setFocusThresholds: setFocusThresholds
|
|
5282
|
+
};
|
|
5283
|
+
}, [focusThresholds, load, makeFocusPrediction, modelDownloadProgress, modelError, modelLoadState, modelWarmingStartedAt]);
|
|
5284
|
+
return /*#__PURE__*/React__default.createElement(FocusModelContext.Provider, {
|
|
5285
|
+
value: value
|
|
5286
|
+
}, /*#__PURE__*/React__default.createElement(InvisibleCanvasContainer, null, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
5287
|
+
ref: rotateCanvas,
|
|
5288
|
+
style: showCanvases ? {
|
|
5289
|
+
display: 'block'
|
|
5290
|
+
} : undefined
|
|
5291
|
+
}), /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
5292
|
+
ref: cropCanvas,
|
|
5293
|
+
style: showCanvases ? {
|
|
5294
|
+
display: 'block'
|
|
5295
|
+
} : undefined
|
|
5296
|
+
})), children);
|
|
5297
|
+
}
|
|
5298
|
+
|
|
5299
|
+
function _isNavigatorDefined() {
|
|
5300
|
+
return typeof navigator !== 'undefined' && navigator != null;
|
|
5301
|
+
}
|
|
5302
|
+
var isMobileCache;
|
|
5303
|
+
function isMobile() {
|
|
5304
|
+
if (isMobileCache !== undefined) return isMobileCache;
|
|
5305
|
+
isMobileCache = evaluateIsMobile();
|
|
5306
|
+
return isMobileCache;
|
|
5307
|
+
}
|
|
5308
|
+
function evaluateIsMobile(nav) {
|
|
5309
|
+
if (nav || _isNavigatorDefined()) {
|
|
5310
|
+
if (!nav) {
|
|
5311
|
+
nav = navigator;
|
|
5312
|
+
}
|
|
5313
|
+
if (nav.product === 'ReactNative') {
|
|
5314
|
+
return true;
|
|
5315
|
+
}
|
|
5316
|
+
var a = nav.userAgent || nav.vendor || (
|
|
5317
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
5318
|
+
// @ts-ignore
|
|
5319
|
+
typeof window !== 'undefined' ? window.opera : '');
|
|
5320
|
+
if (!a) {
|
|
5321
|
+
var navAny = nav;
|
|
5322
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
5323
|
+
// @ts-ignore
|
|
5324
|
+
return navAny.userAgentData && navAny.userAgentData.mobile;
|
|
5325
|
+
}
|
|
5326
|
+
return /(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a) || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0, 4));
|
|
5327
|
+
}
|
|
5328
|
+
return false;
|
|
5329
|
+
}
|
|
5330
|
+
|
|
5331
|
+
var defaultBarcodeReadabilityModelLoadTimeoutMs = 45000;
|
|
5332
|
+
var classifier = null;
|
|
5333
|
+
var classifierSettings = null;
|
|
5334
|
+
function loadBarcodeReadabilityModel() {
|
|
5335
|
+
return __awaiter(this, arguments, void 0, function (modelAssetPath) {
|
|
5336
|
+
var _a, _b;
|
|
5337
|
+
if (modelAssetPath === void 0) {
|
|
5338
|
+
modelAssetPath = defaultBarcodeReadabilityModelPath;
|
|
5339
|
+
}
|
|
5340
|
+
return __generator(this, function (_c) {
|
|
5341
|
+
switch (_c.label) {
|
|
5342
|
+
case 0:
|
|
5343
|
+
if (classifier && (classifierSettings === null || classifierSettings === void 0 ? void 0 : classifierSettings.modelAssetPath) === modelAssetPath) return [2 /*return*/, classifier];
|
|
5344
|
+
closeBarcodeReadabilityModel();
|
|
5345
|
+
return [4 /*yield*/, preloadBarcodeReadabilityModelDependencies()];
|
|
5346
|
+
case 1:
|
|
5347
|
+
_c.sent();
|
|
5348
|
+
if (modelCapabilities.delegate === 'NONE') {
|
|
5349
|
+
throw new Error('No available delegate for barcode readability model.');
|
|
5350
|
+
}
|
|
5351
|
+
_b = (_a = ImageClassifier).createFromOptions;
|
|
5352
|
+
return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
|
|
5353
|
+
case 2:
|
|
5354
|
+
return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
|
|
5355
|
+
baseOptions: {
|
|
5356
|
+
modelAssetPath: modelAssetPath,
|
|
5357
|
+
delegate: 'CPU'
|
|
5358
|
+
},
|
|
5359
|
+
runningMode: 'VIDEO',
|
|
5360
|
+
maxResults: 1
|
|
5361
|
+
}])];
|
|
5362
|
+
case 3:
|
|
5363
|
+
classifier = _c.sent();
|
|
5364
|
+
classifierSettings = {
|
|
5365
|
+
modelAssetPath: modelAssetPath
|
|
5366
|
+
};
|
|
5367
|
+
return [2 /*return*/, classifier];
|
|
5368
|
+
}
|
|
5369
|
+
});
|
|
5370
|
+
});
|
|
5371
|
+
}
|
|
5372
|
+
function closeBarcodeReadabilityModel() {
|
|
5373
|
+
classifier === null || classifier === void 0 ? void 0 : classifier.close();
|
|
5374
|
+
classifier = null;
|
|
5375
|
+
classifierSettings = null;
|
|
5376
|
+
}
|
|
5377
|
+
function useLoadBarcodeReadabilityModel(_a) {
|
|
5378
|
+
var _b = _a.modelPath,
|
|
5379
|
+
modelPath = _b === void 0 ? defaultBarcodeReadabilityModelPath : _b,
|
|
5380
|
+
_c = _a.modelLoadTimeoutMs,
|
|
5381
|
+
modelLoadTimeoutMs = _c === void 0 ? defaultBarcodeReadabilityModelLoadTimeoutMs : _c,
|
|
5382
|
+
onModelError = _a.onModelError,
|
|
5383
|
+
videoRef = _a.videoRef,
|
|
5384
|
+
_d = _a.shouldLoadModels,
|
|
5385
|
+
shouldLoadModels = _d === void 0 ? true : _d;
|
|
5386
|
+
var _e = useState('not-started'),
|
|
5387
|
+
modelLoadState = _e[0],
|
|
5388
|
+
setModelLoadState = _e[1];
|
|
5389
|
+
var _f = useState(0),
|
|
5390
|
+
modelDownloadProgress = _f[0],
|
|
5391
|
+
setModelDownloadProgress = _f[1];
|
|
5392
|
+
var _g = useState(null),
|
|
5393
|
+
modelWarmingStartedAt = _g[0],
|
|
5394
|
+
setModelWarmingStartedAt = _g[1];
|
|
5395
|
+
var _h = useState(null),
|
|
5396
|
+
modelError = _h[0],
|
|
5397
|
+
setModelError = _h[1];
|
|
5398
|
+
useEffect(function loadModel() {
|
|
5399
|
+
var _this = this;
|
|
5400
|
+
if (!shouldLoadModels) return;
|
|
5401
|
+
setModelLoadState('downloading');
|
|
5402
|
+
setModelWarmingStartedAt(null);
|
|
5403
|
+
function handleDownloadProgress(event) {
|
|
5404
|
+
setModelDownloadProgress(progressToPercentage(event.detail));
|
|
5405
|
+
}
|
|
5406
|
+
document.addEventListener('idmission.preloadProgress.barcodeReadability', handleDownloadProgress);
|
|
5407
|
+
var modelLoadTimeout = setTimeout(function () {
|
|
5408
|
+
setModelError(new Error('Model loading time limit exceeded.'));
|
|
5409
|
+
}, modelLoadTimeoutMs);
|
|
5410
|
+
var cancelVideoReady = function cancelVideoReady() {};
|
|
5411
|
+
loadBarcodeReadabilityModel(modelPath).then(function (loadedModel) {
|
|
5415
5412
|
return __awaiter(_this, void 0, void 0, function () {
|
|
5416
|
-
var
|
|
5417
|
-
var _a;
|
|
5413
|
+
var _a, videoReady, cancel, cancelled;
|
|
5418
5414
|
return __generator(this, function (_b) {
|
|
5419
5415
|
switch (_b.label) {
|
|
5420
5416
|
case 0:
|
|
5421
|
-
|
|
5422
|
-
|
|
5423
|
-
|
|
5424
|
-
|
|
5425
|
-
|
|
5426
|
-
|
|
5427
|
-
|
|
5428
|
-
|
|
5429
|
-
|
|
5430
|
-
|
|
5431
|
-
return [4 /*yield*/,
|
|
5417
|
+
setModelDownloadProgress(100);
|
|
5418
|
+
clearTimeout(modelLoadTimeout);
|
|
5419
|
+
setModelLoadState('warming');
|
|
5420
|
+
setModelWarmingStartedAt(new Date().getTime());
|
|
5421
|
+
_a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
|
|
5422
|
+
cancelled = false;
|
|
5423
|
+
cancelVideoReady = function cancelVideoReady() {
|
|
5424
|
+
cancelled = true;
|
|
5425
|
+
cancel();
|
|
5426
|
+
};
|
|
5427
|
+
return [4 /*yield*/, videoReady];
|
|
5432
5428
|
case 1:
|
|
5433
|
-
prediction = _b.sent();
|
|
5434
|
-
if (!prediction) return [3 /*break*/, 3];
|
|
5435
|
-
processedPrediction = processDocumentDetectorPrediction(prediction, documentDetectionThresholds, documentDetectionBoundaries);
|
|
5436
|
-
processedPrediction.frameId = frameId;
|
|
5437
|
-
setLastDetectionAt(new Date().getTime());
|
|
5438
|
-
debug(processedPrediction);
|
|
5439
|
-
if (processedPrediction.allZero) setTimesAllZero(function (n) {
|
|
5440
|
-
return n + 1;
|
|
5441
|
-
});
|
|
5442
|
-
if (stopDetectionAtStart !== stopDetection.current) return [2 /*return*/];
|
|
5443
|
-
if (timeRunning < delayAfterStartMs) return [2 /*return*/];
|
|
5444
|
-
return [4 /*yield*/, (_a = onPredictionHandler.current) === null || _a === void 0 ? void 0 : _a.call(onPredictionHandler, processedPrediction)];
|
|
5445
|
-
case 2:
|
|
5446
5429
|
_b.sent();
|
|
5447
|
-
|
|
5448
|
-
|
|
5449
|
-
|
|
5450
|
-
|
|
5451
|
-
|
|
5452
|
-
|
|
5453
|
-
|
|
5454
|
-
|
|
5455
|
-
|
|
5456
|
-
})
|
|
5457
|
-
|
|
5458
|
-
|
|
5459
|
-
|
|
5460
|
-
|
|
5461
|
-
setModelError(new Error('model is returning all zeroes'));
|
|
5462
|
-
}
|
|
5463
|
-
}, [setModelError, timesAllZero]);
|
|
5464
|
-
var onDocumentDetected = useCallback(function (handler) {
|
|
5465
|
-
onPredictionHandler.current = handler;
|
|
5466
|
-
}, []);
|
|
5467
|
-
var clearDocumentDetectionLastPredictionCanvas = useCallback(function () {
|
|
5468
|
-
stopDetection.current += 1;
|
|
5469
|
-
setCanvasKey(function (n) {
|
|
5470
|
-
return n + 1;
|
|
5430
|
+
setTimeout(function () {
|
|
5431
|
+
if (cancelled) return;
|
|
5432
|
+
loadedModel.classifyForVideo(videoRef.current, performance.now());
|
|
5433
|
+
setModelLoadState('ready');
|
|
5434
|
+
}, 500);
|
|
5435
|
+
return [2 /*return*/];
|
|
5436
|
+
}
|
|
5437
|
+
});
|
|
5438
|
+
});
|
|
5439
|
+
})["catch"](function (e) {
|
|
5440
|
+
setModelError(e);
|
|
5441
|
+
setModelLoadState('error');
|
|
5442
|
+
})["finally"](function () {
|
|
5443
|
+
clearTimeout(modelLoadTimeout);
|
|
5471
5444
|
});
|
|
5472
|
-
|
|
5473
|
-
|
|
5445
|
+
return function () {
|
|
5446
|
+
log('unloading barcode readability model');
|
|
5447
|
+
cancelVideoReady();
|
|
5448
|
+
closeBarcodeReadabilityModel();
|
|
5449
|
+
clearTimeout(modelLoadTimeout);
|
|
5450
|
+
document.removeEventListener('idmission.preloadProgress.barcodeReadability', handleDownloadProgress);
|
|
5451
|
+
};
|
|
5452
|
+
}, [modelPath, modelLoadTimeoutMs, videoRef, shouldLoadModels]);
|
|
5453
|
+
useEffect(function handleModelError() {
|
|
5454
|
+
if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
|
|
5455
|
+
}, [modelError, onModelError]);
|
|
5456
|
+
return useMemo(function () {
|
|
5474
5457
|
return {
|
|
5475
|
-
|
|
5476
|
-
|
|
5477
|
-
|
|
5478
|
-
|
|
5479
|
-
|
|
5480
|
-
documentDetectionModelError: modelError,
|
|
5481
|
-
documentDetectionModelDownloadProgress: modelDownloadProgress,
|
|
5482
|
-
onDocumentDetected: onDocumentDetected,
|
|
5483
|
-
detectionTime: lastDetectionTime,
|
|
5484
|
-
documentDetectionThresholds: documentDetectionThresholds,
|
|
5485
|
-
setDocumentDetectionThresholds: setDocumentDetectionThresholds,
|
|
5486
|
-
documentDetectionBoundaries: documentDetectionBoundaries,
|
|
5487
|
-
setDocumentDetectionBoundaries: setDocumentDetectionBoundaries,
|
|
5488
|
-
documentDetectionLastPredictionCanvas: lastPredictionCanvas,
|
|
5489
|
-
clearDocumentDetectionLastPredictionCanvas: clearDocumentDetectionLastPredictionCanvas
|
|
5458
|
+
ready: modelLoadState === 'ready',
|
|
5459
|
+
modelLoadState: modelLoadState,
|
|
5460
|
+
modelDownloadProgress: modelDownloadProgress,
|
|
5461
|
+
modelWarmingStartedAt: modelWarmingStartedAt,
|
|
5462
|
+
modelError: modelError
|
|
5490
5463
|
};
|
|
5491
|
-
}, [
|
|
5492
|
-
|
|
5493
|
-
|
|
5494
|
-
|
|
5495
|
-
|
|
5496
|
-
|
|
5497
|
-
|
|
5464
|
+
}, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
|
|
5465
|
+
}
|
|
5466
|
+
var lastBarcodeReadabilityPredictionAt = 0;
|
|
5467
|
+
var lastBarcodeReadabilityPredictionTime = 0;
|
|
5468
|
+
function setLastBarcodeReadabilityPredictionAt(time) {
|
|
5469
|
+
lastBarcodeReadabilityPredictionTime = time - lastBarcodeReadabilityPredictionAt;
|
|
5470
|
+
lastBarcodeReadabilityPredictionAt = time;
|
|
5471
|
+
}
|
|
5472
|
+
function makeBarcodeReadabilityModelPrediction(imageData, cropCanvas, rotateCanvas, resizeCanvas, box) {
|
|
5473
|
+
var _a, _b, _c, _d, _e;
|
|
5474
|
+
if (!classifier) return null;
|
|
5475
|
+
var startedAt = performance.now();
|
|
5476
|
+
var image = cropAndRotateIfNecessary(imageData, cropCanvas, rotateCanvas, box);
|
|
5477
|
+
var resized = resizeIfNecessary(image, resizeCanvas, 500);
|
|
5478
|
+
var result = classifier.classifyForVideo(resized, performance.now());
|
|
5479
|
+
var score = (_e = (_d = (_c = (_b = (_a = result === null || result === void 0 ? void 0 : result.classifications) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.categories) === null || _c === void 0 ? void 0 : _c.find(function (c) {
|
|
5480
|
+
return c.categoryName === 'blurry';
|
|
5481
|
+
})) === null || _d === void 0 ? void 0 : _d.score) !== null && _e !== void 0 ? _e : 0;
|
|
5482
|
+
debug('barcode prediction', "".concat(performance.now() - startedAt, "ms"), score);
|
|
5483
|
+
var predictionTime = performance.now() - startedAt;
|
|
5484
|
+
return {
|
|
5485
|
+
score: score,
|
|
5486
|
+
predictionTime: predictionTime
|
|
5487
|
+
};
|
|
5498
5488
|
}
|
|
5499
5489
|
|
|
5500
|
-
var
|
|
5501
|
-
|
|
5490
|
+
var BarcodeReadabilityModelContext = /*#__PURE__*/createContext({
|
|
5491
|
+
loadBarcodeReadabilityModel: function loadBarcodeReadabilityModel() {
|
|
5502
5492
|
return null;
|
|
5503
5493
|
},
|
|
5504
|
-
|
|
5505
|
-
|
|
5506
|
-
|
|
5507
|
-
|
|
5508
|
-
|
|
5509
|
-
|
|
5494
|
+
barcodeReadabilityModelState: 'not-started',
|
|
5495
|
+
barcodeReadabilityModelDownloadProgress: 0,
|
|
5496
|
+
barcodeReadabilityModelWarmingStartedAt: null,
|
|
5497
|
+
barcodeReadabilityModelError: null,
|
|
5498
|
+
barcodeReadabilityThresholds: {},
|
|
5499
|
+
setBarcodeReadabilityThresholds: function setBarcodeReadabilityThresholds() {
|
|
5510
5500
|
return null;
|
|
5511
5501
|
},
|
|
5512
|
-
|
|
5502
|
+
makeBarcodeReadabilityPrediction: function makeBarcodeReadabilityPrediction() {
|
|
5513
5503
|
return null;
|
|
5514
5504
|
},
|
|
5515
|
-
|
|
5505
|
+
barcodeReadabilityPredictionTime: 0
|
|
5516
5506
|
});
|
|
5517
|
-
function
|
|
5507
|
+
function BarcodeReadabilityModelProvider(_a) {
|
|
5518
5508
|
var children = _a.children,
|
|
5519
|
-
_b = _a.
|
|
5520
|
-
|
|
5521
|
-
_c = _a.
|
|
5522
|
-
|
|
5523
|
-
|
|
5509
|
+
_b = _a.barcodeReadabilityModelPath,
|
|
5510
|
+
barcodeReadabilityModelPath = _b === void 0 ? defaultBarcodeReadabilityModelPath : _b,
|
|
5511
|
+
_c = _a.barcodeReadabilityModelLoadTimeoutMs,
|
|
5512
|
+
barcodeReadabilityModelLoadTimeoutMs = _c === void 0 ? defaultBarcodeReadabilityModelLoadTimeoutMs : _c,
|
|
5513
|
+
onBarcodeReadabilityModelError = _a.onBarcodeReadabilityModelError,
|
|
5524
5514
|
_d = _a.showCanvases,
|
|
5525
5515
|
showCanvases = _d === void 0 ? false : _d,
|
|
5526
5516
|
_e = _a.shouldLoadModels,
|
|
5527
5517
|
shouldLoadModelsProp = _e === void 0 ? true : _e;
|
|
5528
5518
|
var cropCanvas = useRef(null);
|
|
5529
5519
|
var rotateCanvas = useRef(null);
|
|
5520
|
+
var resizeCanvas = useRef(null);
|
|
5530
5521
|
var _f = useState({}),
|
|
5531
|
-
|
|
5532
|
-
|
|
5522
|
+
barcodeReadabilityThresholds = _f[0],
|
|
5523
|
+
setBarcodeReadabilityThresholds = _f[1];
|
|
5533
5524
|
var videoRef = useCameraStore().videoRef;
|
|
5534
5525
|
var _g = useState(shouldLoadModelsProp),
|
|
5535
5526
|
shouldLoadModels = _g[0],
|
|
@@ -5537,10 +5528,10 @@ function FocusModelProvider(_a) {
|
|
|
5537
5528
|
var load = useCallback(function () {
|
|
5538
5529
|
return setShouldLoadModels(true);
|
|
5539
5530
|
}, []);
|
|
5540
|
-
var _h =
|
|
5541
|
-
modelPath:
|
|
5542
|
-
modelLoadTimeoutMs:
|
|
5543
|
-
onModelError:
|
|
5531
|
+
var _h = useLoadBarcodeReadabilityModel({
|
|
5532
|
+
modelPath: barcodeReadabilityModelPath,
|
|
5533
|
+
modelLoadTimeoutMs: barcodeReadabilityModelLoadTimeoutMs,
|
|
5534
|
+
onModelError: onBarcodeReadabilityModelError,
|
|
5544
5535
|
videoRef: videoRef,
|
|
5545
5536
|
shouldLoadModels: shouldLoadModels
|
|
5546
5537
|
}),
|
|
@@ -5549,71 +5540,45 @@ function FocusModelProvider(_a) {
|
|
|
5549
5540
|
modelDownloadProgress = _h.modelDownloadProgress,
|
|
5550
5541
|
modelWarmingStartedAt = _h.modelWarmingStartedAt,
|
|
5551
5542
|
modelError = _h.modelError;
|
|
5552
|
-
var
|
|
5543
|
+
var makeBarcodeReadabilityPrediction = useCallback(function (imageData, box) {
|
|
5553
5544
|
if (!ready) return null;
|
|
5554
|
-
var prediction =
|
|
5545
|
+
var prediction = makeBarcodeReadabilityModelPrediction(imageData, cropCanvas.current, rotateCanvas.current, resizeCanvas.current, box);
|
|
5555
5546
|
if (!prediction) return null;
|
|
5556
|
-
|
|
5547
|
+
setLastBarcodeReadabilityPredictionAt(prediction.predictionTime);
|
|
5557
5548
|
return prediction;
|
|
5558
5549
|
}, [ready]);
|
|
5559
5550
|
var value = useMemo(function () {
|
|
5560
5551
|
return {
|
|
5561
|
-
|
|
5562
|
-
|
|
5563
|
-
|
|
5564
|
-
|
|
5565
|
-
|
|
5566
|
-
|
|
5567
|
-
|
|
5568
|
-
|
|
5569
|
-
|
|
5552
|
+
loadBarcodeReadabilityModel: load,
|
|
5553
|
+
barcodeReadabilityModelState: modelLoadState,
|
|
5554
|
+
barcodeReadabilityModelDownloadProgress: modelDownloadProgress,
|
|
5555
|
+
barcodeReadabilityModelWarmingStartedAt: modelWarmingStartedAt,
|
|
5556
|
+
barcodeReadabilityModelError: modelError,
|
|
5557
|
+
makeBarcodeReadabilityPrediction: makeBarcodeReadabilityPrediction,
|
|
5558
|
+
barcodeReadabilityPredictionTime: lastBarcodeReadabilityPredictionTime,
|
|
5559
|
+
barcodeReadabilityThresholds: barcodeReadabilityThresholds,
|
|
5560
|
+
setBarcodeReadabilityThresholds: setBarcodeReadabilityThresholds
|
|
5570
5561
|
};
|
|
5571
|
-
}, [
|
|
5572
|
-
return /*#__PURE__*/React__default.createElement(
|
|
5562
|
+
}, [barcodeReadabilityThresholds, load, makeBarcodeReadabilityPrediction, modelDownloadProgress, modelError, modelLoadState, modelWarmingStartedAt]);
|
|
5563
|
+
return /*#__PURE__*/React__default.createElement(BarcodeReadabilityModelContext.Provider, {
|
|
5573
5564
|
value: value
|
|
5574
|
-
}, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
5575
|
-
ref: rotateCanvas
|
|
5576
|
-
style: showCanvases ? {
|
|
5577
|
-
display: 'block'
|
|
5578
|
-
} : undefined
|
|
5565
|
+
}, /*#__PURE__*/React__default.createElement(InvisibleCanvasContainer, null, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
5566
|
+
ref: rotateCanvas
|
|
5579
5567
|
}), /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
5580
|
-
ref: cropCanvas
|
|
5568
|
+
ref: cropCanvas
|
|
5569
|
+
}), /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
5570
|
+
ref: resizeCanvas,
|
|
5581
5571
|
style: showCanvases ? {
|
|
5582
5572
|
display: 'block'
|
|
5583
5573
|
} : undefined
|
|
5584
|
-
}), children);
|
|
5585
|
-
}
|
|
5586
|
-
|
|
5587
|
-
function _isNavigatorDefined() {
|
|
5588
|
-
return typeof navigator !== 'undefined' && navigator != null;
|
|
5574
|
+
})), children);
|
|
5589
5575
|
}
|
|
5590
|
-
|
|
5591
|
-
|
|
5592
|
-
if (
|
|
5593
|
-
|
|
5594
|
-
return isMobileCache;
|
|
5595
|
-
}
|
|
5596
|
-
function evaluateIsMobile(nav) {
|
|
5597
|
-
if (nav || _isNavigatorDefined()) {
|
|
5598
|
-
if (!nav) {
|
|
5599
|
-
nav = navigator;
|
|
5600
|
-
}
|
|
5601
|
-
if (nav.product === 'ReactNative') {
|
|
5602
|
-
return true;
|
|
5603
|
-
}
|
|
5604
|
-
var a = nav.userAgent || nav.vendor || (
|
|
5605
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
5606
|
-
// @ts-ignore
|
|
5607
|
-
typeof window !== 'undefined' ? window.opera : '');
|
|
5608
|
-
if (!a) {
|
|
5609
|
-
var navAny = nav;
|
|
5610
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
5611
|
-
// @ts-ignore
|
|
5612
|
-
return navAny.userAgentData && navAny.userAgentData.mobile;
|
|
5613
|
-
}
|
|
5614
|
-
return /(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a) || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0, 4));
|
|
5576
|
+
function useBarcodeReadabilityModelContext() {
|
|
5577
|
+
var context = useContext(BarcodeReadabilityModelContext);
|
|
5578
|
+
if (!context) {
|
|
5579
|
+
throw new Error('useBarcodeReadabilityModelContext must be used within an BarcodeReadabilityModelProvider');
|
|
5615
5580
|
}
|
|
5616
|
-
return
|
|
5581
|
+
return context;
|
|
5617
5582
|
}
|
|
5618
5583
|
|
|
5619
5584
|
var onMobile = isMobile();
|
|
@@ -5649,6 +5614,7 @@ var IdCaptureModelsContext = /*#__PURE__*/createContext({
|
|
|
5649
5614
|
},
|
|
5650
5615
|
detectionTime: 0,
|
|
5651
5616
|
focusPredictionTime: 0,
|
|
5617
|
+
barcodeReadabilityPredictionTime: 0,
|
|
5652
5618
|
bestFrameDetails: {
|
|
5653
5619
|
current: null
|
|
5654
5620
|
},
|
|
@@ -5658,55 +5624,78 @@ var IdCaptureModelsContext = /*#__PURE__*/createContext({
|
|
|
5658
5624
|
resetBestFrame: function resetBestFrame() {
|
|
5659
5625
|
return null;
|
|
5660
5626
|
},
|
|
5627
|
+
bestBarcodeDetails: {
|
|
5628
|
+
current: null
|
|
5629
|
+
},
|
|
5630
|
+
getBestBarcode: function getBestBarcode() {
|
|
5631
|
+
return null;
|
|
5632
|
+
},
|
|
5661
5633
|
requiredDocumentType: 'none',
|
|
5662
5634
|
setRequiredDocumentType: function setRequiredDocumentType() {
|
|
5663
5635
|
return null;
|
|
5664
5636
|
}
|
|
5665
5637
|
});
|
|
5666
5638
|
function IdCaptureModelsProviderInner(_a) {
|
|
5639
|
+
var _b;
|
|
5667
5640
|
var children = _a.children,
|
|
5668
5641
|
onModelError = _a.onModelError,
|
|
5669
|
-
|
|
5670
|
-
allowSinglePageIdCapture =
|
|
5671
|
-
|
|
5672
|
-
|
|
5673
|
-
|
|
5674
|
-
|
|
5675
|
-
|
|
5676
|
-
|
|
5677
|
-
|
|
5678
|
-
|
|
5679
|
-
|
|
5680
|
-
|
|
5681
|
-
|
|
5682
|
-
|
|
5683
|
-
|
|
5684
|
-
|
|
5685
|
-
|
|
5686
|
-
|
|
5687
|
-
|
|
5688
|
-
|
|
5689
|
-
|
|
5690
|
-
|
|
5691
|
-
|
|
5692
|
-
|
|
5693
|
-
|
|
5694
|
-
|
|
5695
|
-
|
|
5696
|
-
|
|
5642
|
+
_c = _a.allowSinglePageIdCapture,
|
|
5643
|
+
allowSinglePageIdCapture = _c === void 0 ? false : _c,
|
|
5644
|
+
_d = _a.enableBarcodeReadabilityModel,
|
|
5645
|
+
enableBarcodeReadabilityModel = _d === void 0 ? true : _d;
|
|
5646
|
+
var _e = useContext(DocumentDetectionModelContext),
|
|
5647
|
+
documentDetectionModelState = _e.documentDetectionModelState,
|
|
5648
|
+
documentDetectionModelDownloadProgress = _e.documentDetectionModelDownloadProgress,
|
|
5649
|
+
documentDetectionModelWarmingStartedAt = _e.documentDetectionModelWarmingStartedAt,
|
|
5650
|
+
startDocumentDetection = _e.startDocumentDetection,
|
|
5651
|
+
stopDocumentDetection = _e.stopDocumentDetection,
|
|
5652
|
+
loadDocumentDetectionModel = _e.loadDocumentDetectionModel,
|
|
5653
|
+
lastPredictionCanvas = _e.documentDetectionLastPredictionCanvas,
|
|
5654
|
+
clearDocumentDetectionLastPredictionCanvas = _e.clearDocumentDetectionLastPredictionCanvas,
|
|
5655
|
+
onDocumentDetected = _e.onDocumentDetected,
|
|
5656
|
+
detectionTime = _e.detectionTime,
|
|
5657
|
+
documentDetectionThresholds = _e.documentDetectionThresholds,
|
|
5658
|
+
setDocumentDetectionThresholds = _e.setDocumentDetectionThresholds,
|
|
5659
|
+
documentDetectionBoundaries = _e.documentDetectionBoundaries,
|
|
5660
|
+
setDocumentDetectionBoundaries = _e.setDocumentDetectionBoundaries,
|
|
5661
|
+
documentDetectionModelError = _e.documentDetectionModelError;
|
|
5662
|
+
var _f = useContext(FocusModelContext),
|
|
5663
|
+
loadFocusModel = _f.loadFocusModel,
|
|
5664
|
+
focusModelState = _f.focusModelState,
|
|
5665
|
+
focusModelDownloadProgress = _f.focusModelDownloadProgress,
|
|
5666
|
+
focusModelWarmingStartedAt = _f.focusModelWarmingStartedAt,
|
|
5667
|
+
makeFocusPrediction = _f.makeFocusPrediction,
|
|
5668
|
+
focusThresholds = _f.focusThresholds,
|
|
5669
|
+
setFocusThresholds = _f.setFocusThresholds,
|
|
5670
|
+
focusPredictionTime = _f.focusPredictionTime,
|
|
5671
|
+
focusModelError = _f.focusModelError;
|
|
5672
|
+
var _g = useBarcodeReadabilityModelContext(),
|
|
5673
|
+
loadBarcodeReadabilityModel = _g.loadBarcodeReadabilityModel,
|
|
5674
|
+
barcodeReadabilityModelState = _g.barcodeReadabilityModelState,
|
|
5675
|
+
barcodeReadabilityModelDownloadProgress = _g.barcodeReadabilityModelDownloadProgress,
|
|
5676
|
+
barcodeReadabilityModelWarmingStartedAt = _g.barcodeReadabilityModelWarmingStartedAt,
|
|
5677
|
+
makeBarcodeReadabilityPrediction = _g.makeBarcodeReadabilityPrediction,
|
|
5678
|
+
barcodeReadabilityThresholds = _g.barcodeReadabilityThresholds,
|
|
5679
|
+
setBarcodeReadabilityThresholds = _g.setBarcodeReadabilityThresholds,
|
|
5680
|
+
barcodeReadabilityPredictionTime = _g.barcodeReadabilityPredictionTime,
|
|
5681
|
+
barcodeReadabilityModelError = _g.barcodeReadabilityModelError;
|
|
5697
5682
|
var onPredictionHandler = useRef();
|
|
5698
5683
|
var bestFrameDetails = useRef(null);
|
|
5684
|
+
var bestBarcodeDetails = useRef(null);
|
|
5699
5685
|
var bestPredictionCanvas = useRef(null);
|
|
5686
|
+
var bestBarcodeCanvas = useRef(null);
|
|
5700
5687
|
var bestFocusScore = useRef(0);
|
|
5688
|
+
var bestBarcodeScore = useRef(0);
|
|
5701
5689
|
var stopDetection = useRef(0);
|
|
5702
|
-
var
|
|
5703
|
-
requiredDocumentType =
|
|
5704
|
-
setRequiredDocumentType =
|
|
5690
|
+
var _h = useState('none'),
|
|
5691
|
+
requiredDocumentType = _h[0],
|
|
5692
|
+
setRequiredDocumentType = _h[1];
|
|
5705
5693
|
var thresholds = useMemo(function () {
|
|
5706
5694
|
return _assign(_assign({}, documentDetectionThresholds), {
|
|
5707
|
-
focus: focusThresholds
|
|
5695
|
+
focus: focusThresholds,
|
|
5696
|
+
barcodeReadability: barcodeReadabilityThresholds
|
|
5708
5697
|
});
|
|
5709
|
-
}, [documentDetectionThresholds, focusThresholds]);
|
|
5698
|
+
}, [documentDetectionThresholds, focusThresholds, barcodeReadabilityThresholds]);
|
|
5710
5699
|
var setThresholds = useCallback(function (thresholds) {
|
|
5711
5700
|
if (thresholds.detection) {
|
|
5712
5701
|
setDocumentDetectionThresholds(thresholds.detection);
|
|
@@ -5714,17 +5703,20 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
5714
5703
|
if (thresholds.focus) {
|
|
5715
5704
|
setFocusThresholds(thresholds.focus);
|
|
5716
5705
|
}
|
|
5717
|
-
|
|
5706
|
+
if (thresholds.barcodeReadability) {
|
|
5707
|
+
setBarcodeReadabilityThresholds(thresholds.barcodeReadability);
|
|
5708
|
+
}
|
|
5709
|
+
}, [setBarcodeReadabilityThresholds, setDocumentDetectionThresholds, setFocusThresholds]);
|
|
5718
5710
|
useEffect(function handleDetections() {
|
|
5719
5711
|
var _this = this;
|
|
5720
5712
|
onDocumentDetected(function (prediction) {
|
|
5721
5713
|
return __awaiter(_this, void 0, void 0, function () {
|
|
5722
|
-
var stopDetectionAtStart, focusPredictionTime, focusScore, focusThresholdMet, isSinglePage, isRequiredDocumentType, focusPrediction, focusThresholdSet, focusThreshold;
|
|
5723
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
5724
|
-
return __generator(this, function (
|
|
5714
|
+
var stopDetectionAtStart, focusPredictionTime, focusScore, focusThresholdMet, pdf417PredictionTime, pdf417PredictionScore, pdf417PredictionThresholdMet, isSinglePage, isRequiredDocumentType, focusPrediction, focusThresholdSet, focusThreshold, pdf417Prediction, barcodeReadabilityThresholdSet, barcodeReadabilityThreshold;
|
|
5715
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
5716
|
+
return __generator(this, function (_j) {
|
|
5725
5717
|
if (!lastPredictionCanvas.current) return [2 /*return*/];
|
|
5726
5718
|
stopDetectionAtStart = stopDetection.current;
|
|
5727
|
-
focusPredictionTime = 0, focusScore = 0, focusThresholdMet = false;
|
|
5719
|
+
focusPredictionTime = 0, focusScore = 0, focusThresholdMet = false, pdf417PredictionTime = 0, pdf417PredictionScore = 0, pdf417PredictionThresholdMet = false;
|
|
5728
5720
|
isSinglePage = prediction.detectedDocumentType === 'singlePage';
|
|
5729
5721
|
if (!allowSinglePageIdCapture && isSinglePage) {
|
|
5730
5722
|
prediction.detectedDocumentType = 'passport';
|
|
@@ -5743,28 +5735,51 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
5743
5735
|
focusThresholdSet = (_d = thresholds.focus) === null || _d === void 0 ? void 0 : _d[prediction.detectedDocumentType];
|
|
5744
5736
|
focusThreshold = (_e = onMobile ? focusThresholdSet === null || focusThresholdSet === void 0 ? void 0 : focusThresholdSet.mobile : focusThresholdSet === null || focusThresholdSet === void 0 ? void 0 : focusThresholdSet.desktop) !== null && _e !== void 0 ? _e : 0;
|
|
5745
5737
|
focusThresholdMet = focusScore >= focusThreshold;
|
|
5746
|
-
if (
|
|
5747
|
-
bestFocusScore.current
|
|
5748
|
-
|
|
5749
|
-
|
|
5750
|
-
|
|
5751
|
-
|
|
5752
|
-
|
|
5753
|
-
|
|
5754
|
-
|
|
5738
|
+
if (stopDetectionAtStart === stopDetection.current) {
|
|
5739
|
+
if (bestFocusScore.current <= focusScore) {
|
|
5740
|
+
bestFocusScore.current = focusScore;
|
|
5741
|
+
drawToCanvas(bestPredictionCanvas.current, lastPredictionCanvas.current);
|
|
5742
|
+
bestFrameDetails.current = {
|
|
5743
|
+
boundingBox: (_f = prediction.bestDocument) === null || _f === void 0 ? void 0 : _f.box,
|
|
5744
|
+
documentType: prediction.detectedDocumentType,
|
|
5745
|
+
detectionScore: prediction.detectionScore,
|
|
5746
|
+
focusScore: focusScore
|
|
5747
|
+
};
|
|
5748
|
+
}
|
|
5749
|
+
if (enableBarcodeReadabilityModel && prediction.bestPDF417) {
|
|
5750
|
+
pdf417Prediction = makeBarcodeReadabilityPrediction(lastPredictionCanvas.current, prediction.bestPDF417.box);
|
|
5751
|
+
if (pdf417Prediction) {
|
|
5752
|
+
pdf417PredictionTime = pdf417Prediction.predictionTime;
|
|
5753
|
+
pdf417PredictionScore = pdf417Prediction.score;
|
|
5754
|
+
if (bestBarcodeScore.current <= pdf417Prediction.score) {
|
|
5755
|
+
bestBarcodeScore.current = pdf417Prediction.score;
|
|
5756
|
+
bestBarcodeDetails.current = {
|
|
5757
|
+
boundingBox: prediction.bestPDF417.box,
|
|
5758
|
+
score: pdf417Prediction.score
|
|
5759
|
+
};
|
|
5760
|
+
drawToCanvas(bestBarcodeCanvas.current, cropToDetectedObjectBox(lastPredictionCanvas.current, prediction.bestPDF417.box, undefined, 16));
|
|
5761
|
+
barcodeReadabilityThresholdSet = barcodeReadabilityThresholds[prediction.detectedDocumentType];
|
|
5762
|
+
barcodeReadabilityThreshold = (_g = onMobile ? barcodeReadabilityThresholdSet === null || barcodeReadabilityThresholdSet === void 0 ? void 0 : barcodeReadabilityThresholdSet.mobile : barcodeReadabilityThresholdSet === null || barcodeReadabilityThresholdSet === void 0 ? void 0 : barcodeReadabilityThresholdSet.desktop) !== null && _g !== void 0 ? _g : 0;
|
|
5763
|
+
pdf417PredictionThresholdMet = pdf417PredictionScore >= barcodeReadabilityThreshold;
|
|
5764
|
+
}
|
|
5765
|
+
}
|
|
5766
|
+
}
|
|
5755
5767
|
}
|
|
5756
5768
|
}
|
|
5757
|
-
(
|
|
5769
|
+
(_h = onPredictionHandler.current) === null || _h === void 0 ? void 0 : _h.call(onPredictionHandler, _assign(_assign({}, prediction), {
|
|
5758
5770
|
focusScore: focusScore,
|
|
5759
5771
|
focusPredictionTime: focusPredictionTime,
|
|
5760
|
-
focusThresholdMet: focusThresholdMet
|
|
5772
|
+
focusThresholdMet: focusThresholdMet,
|
|
5773
|
+
pdf417PredictionTime: pdf417PredictionTime,
|
|
5774
|
+
pdf417PredictionScore: pdf417PredictionScore,
|
|
5775
|
+
pdf417PredictionThresholdMet: pdf417PredictionThresholdMet
|
|
5761
5776
|
}));
|
|
5762
5777
|
return [2 /*return*/];
|
|
5763
5778
|
});
|
|
5764
5779
|
});
|
|
5765
5780
|
});
|
|
5766
|
-
}, [allowSinglePageIdCapture, lastPredictionCanvas, makeFocusPrediction, onDocumentDetected, requiredDocumentType, thresholds.focus]);
|
|
5767
|
-
var modelError = documentDetectionModelError !== null && documentDetectionModelError !== void 0 ? documentDetectionModelError : focusModelError;
|
|
5781
|
+
}, [allowSinglePageIdCapture, barcodeReadabilityThresholds, enableBarcodeReadabilityModel, lastPredictionCanvas, makeBarcodeReadabilityPrediction, makeFocusPrediction, onDocumentDetected, requiredDocumentType, thresholds.focus]);
|
|
5782
|
+
var modelError = (_b = documentDetectionModelError !== null && documentDetectionModelError !== void 0 ? documentDetectionModelError : focusModelError) !== null && _b !== void 0 ? _b : barcodeReadabilityModelError;
|
|
5768
5783
|
useEffect(function handleModelErrors() {
|
|
5769
5784
|
if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
|
|
5770
5785
|
}, [modelError, onModelError]);
|
|
@@ -5777,9 +5792,15 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
5777
5792
|
canvas: bestPredictionCanvas.current
|
|
5778
5793
|
});
|
|
5779
5794
|
}, []);
|
|
5780
|
-
var
|
|
5781
|
-
|
|
5782
|
-
|
|
5795
|
+
var getBestBarcode = useCallback(function () {
|
|
5796
|
+
if (!bestBarcodeDetails.current || !bestBarcodeCanvas.current) return null;
|
|
5797
|
+
return _assign(_assign({}, bestBarcodeDetails.current), {
|
|
5798
|
+
canvas: bestBarcodeCanvas.current
|
|
5799
|
+
});
|
|
5800
|
+
}, []);
|
|
5801
|
+
var _j = useState(0),
|
|
5802
|
+
canvasKey = _j[0],
|
|
5803
|
+
setCanvasKey = _j[1];
|
|
5783
5804
|
var resetBestFrame = useCallback(function () {
|
|
5784
5805
|
stopDetection.current += 1;
|
|
5785
5806
|
setCanvasKey(function (n) {
|
|
@@ -5795,16 +5816,45 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
5795
5816
|
var load = useCallback(function () {
|
|
5796
5817
|
loadDocumentDetectionModel();
|
|
5797
5818
|
loadFocusModel();
|
|
5798
|
-
|
|
5799
|
-
|
|
5800
|
-
var
|
|
5801
|
-
|
|
5802
|
-
|
|
5803
|
-
|
|
5819
|
+
if (enableBarcodeReadabilityModel) loadBarcodeReadabilityModel();
|
|
5820
|
+
}, [enableBarcodeReadabilityModel, loadBarcodeReadabilityModel, loadDocumentDetectionModel, loadFocusModel]);
|
|
5821
|
+
var _k = useMemo(function () {
|
|
5822
|
+
var modelStates = [documentDetectionModelState, focusModelState];
|
|
5823
|
+
var modelWarmingStartedAts = [documentDetectionModelWarmingStartedAt, focusModelWarmingStartedAt];
|
|
5824
|
+
var modelDownloadProgresses = [documentDetectionModelDownloadProgress, focusModelDownloadProgress];
|
|
5825
|
+
if (enableBarcodeReadabilityModel) {
|
|
5826
|
+
modelStates.push(barcodeReadabilityModelState);
|
|
5827
|
+
modelWarmingStartedAts.push(barcodeReadabilityModelWarmingStartedAt);
|
|
5828
|
+
modelDownloadProgresses.push(barcodeReadabilityModelDownloadProgress);
|
|
5829
|
+
}
|
|
5830
|
+
var ready = modelStates.every(function (state) {
|
|
5831
|
+
return state === 'ready';
|
|
5832
|
+
});
|
|
5833
|
+
return {
|
|
5834
|
+
ready: ready,
|
|
5835
|
+
modelLoadState: ready ? 'ready' : modelStates.some(function (state) {
|
|
5836
|
+
return state === 'warming';
|
|
5837
|
+
}) ? 'warming' : modelStates.some(function (state) {
|
|
5838
|
+
return state === 'downloading';
|
|
5839
|
+
}) ? 'downloading' : 'not-started',
|
|
5840
|
+
modelWarmingStartedAt: modelWarmingStartedAts.every(function (v) {
|
|
5841
|
+
return v === null;
|
|
5842
|
+
}) ? null : Math.min.apply(Math, modelWarmingStartedAts.filter(function (v) {
|
|
5843
|
+
return v !== null;
|
|
5844
|
+
})),
|
|
5845
|
+
modelDownloadProgress: modelDownloadProgresses.reduce(function (a, b) {
|
|
5846
|
+
return a + b;
|
|
5847
|
+
}, 0) / modelDownloadProgresses.length
|
|
5848
|
+
};
|
|
5849
|
+
}, [barcodeReadabilityModelDownloadProgress, barcodeReadabilityModelState, barcodeReadabilityModelWarmingStartedAt, documentDetectionModelDownloadProgress, documentDetectionModelState, documentDetectionModelWarmingStartedAt, enableBarcodeReadabilityModel, focusModelDownloadProgress, focusModelState, focusModelWarmingStartedAt]),
|
|
5850
|
+
ready = _k.ready,
|
|
5851
|
+
modelLoadState = _k.modelLoadState,
|
|
5852
|
+
modelWarmingStartedAt = _k.modelWarmingStartedAt,
|
|
5853
|
+
modelDownloadProgress = _k.modelDownloadProgress;
|
|
5804
5854
|
var value = useMemo(function () {
|
|
5805
5855
|
return {
|
|
5806
5856
|
ready: ready,
|
|
5807
|
-
modelDownloadProgress:
|
|
5857
|
+
modelDownloadProgress: modelDownloadProgress,
|
|
5808
5858
|
modelLoadState: modelLoadState,
|
|
5809
5859
|
modelWarmingStartedAt: modelWarmingStartedAt,
|
|
5810
5860
|
modelError: modelError,
|
|
@@ -5818,24 +5868,32 @@ function IdCaptureModelsProviderInner(_a) {
|
|
|
5818
5868
|
onPredictionMade: onPredictionMade,
|
|
5819
5869
|
detectionTime: detectionTime,
|
|
5820
5870
|
focusPredictionTime: focusPredictionTime,
|
|
5871
|
+
barcodeReadabilityPredictionTime: barcodeReadabilityPredictionTime,
|
|
5821
5872
|
getBestFrame: getBestFrame,
|
|
5822
5873
|
resetBestFrame: resetBestFrame,
|
|
5823
5874
|
bestFrameDetails: bestFrameDetails,
|
|
5875
|
+
bestBarcodeDetails: bestBarcodeDetails,
|
|
5876
|
+
getBestBarcode: getBestBarcode,
|
|
5824
5877
|
requiredDocumentType: requiredDocumentType,
|
|
5825
5878
|
setRequiredDocumentType: setRequiredDocumentType
|
|
5826
5879
|
};
|
|
5827
|
-
}, [
|
|
5880
|
+
}, [ready, modelDownloadProgress, modelLoadState, modelWarmingStartedAt, modelError, startDocumentDetection, stopDocumentDetection, load, thresholds, setThresholds, documentDetectionBoundaries, setDocumentDetectionBoundaries, onPredictionMade, detectionTime, focusPredictionTime, barcodeReadabilityPredictionTime, getBestFrame, resetBestFrame, getBestBarcode, requiredDocumentType]);
|
|
5828
5881
|
return /*#__PURE__*/React__default.createElement(IdCaptureModelsContext.Provider, {
|
|
5829
5882
|
value: value
|
|
5830
5883
|
}, /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
5831
|
-
key: canvasKey,
|
|
5884
|
+
key: "bf-".concat(canvasKey),
|
|
5832
5885
|
ref: bestPredictionCanvas
|
|
5886
|
+
}), /*#__PURE__*/React__default.createElement(InvisibleCanvas, {
|
|
5887
|
+
key: "bb-".concat(canvasKey),
|
|
5888
|
+
ref: bestBarcodeCanvas
|
|
5833
5889
|
}), children);
|
|
5834
5890
|
}
|
|
5835
5891
|
function IdCaptureModelsProvider(_a) {
|
|
5836
5892
|
var children = _a.children,
|
|
5837
5893
|
props = __rest(_a, ["children"]);
|
|
5838
|
-
return /*#__PURE__*/React__default.createElement(DocumentDetectionModelProvider, _assign({}, props), /*#__PURE__*/React__default.createElement(FocusModelProvider, _assign({}, props), /*#__PURE__*/React__default.createElement(
|
|
5894
|
+
return /*#__PURE__*/React__default.createElement(DocumentDetectionModelProvider, _assign({}, props), /*#__PURE__*/React__default.createElement(FocusModelProvider, _assign({}, props), /*#__PURE__*/React__default.createElement(BarcodeReadabilityModelProvider, _assign({}, props, {
|
|
5895
|
+
shouldLoadModels: props.enableBarcodeReadabilityModel
|
|
5896
|
+
}), /*#__PURE__*/React__default.createElement(IdCaptureModelsProviderInner, _assign({}, props), children))));
|
|
5839
5897
|
}
|
|
5840
5898
|
function useIdCaptureModelsContext() {
|
|
5841
5899
|
var context = useContext(IdCaptureModelsContext);
|
|
@@ -5845,7 +5903,7 @@ function useIdCaptureModelsContext() {
|
|
|
5845
5903
|
return context;
|
|
5846
5904
|
}
|
|
5847
5905
|
|
|
5848
|
-
var CapturedDocumentTypeValues = ['idCardFront', 'idCardBack', 'passport', 'singlePage', 'selfie', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
|
|
5906
|
+
var CapturedDocumentTypeValues = ['idCardFront', 'idCardBack', 'passport', 'singlePage', 'selfie', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage', 'idBarcodeImage'];
|
|
5849
5907
|
|
|
5850
5908
|
var acceptedDocumentTypesForIdCaptureRequirementOption = {
|
|
5851
5909
|
idCardFront: ['idCardFront'],
|
|
@@ -5931,6 +5989,7 @@ var initialState$5 = {
|
|
|
5931
5989
|
capturing: false,
|
|
5932
5990
|
captureFailed: false,
|
|
5933
5991
|
imageUrl: null,
|
|
5992
|
+
idBarcodeImage: null,
|
|
5934
5993
|
captureState: 'initializing',
|
|
5935
5994
|
capturedDocuments: {},
|
|
5936
5995
|
captureRequirement: 'idCardOrPassport',
|
|
@@ -6210,6 +6269,17 @@ var _reducer = function reducer(state, action) {
|
|
|
6210
6269
|
}
|
|
6211
6270
|
return newState;
|
|
6212
6271
|
}
|
|
6272
|
+
case 'barcodeCaptured':
|
|
6273
|
+
return _reducer(state, {
|
|
6274
|
+
type: 'documentCaptured',
|
|
6275
|
+
payload: {
|
|
6276
|
+
imageData: action.payload.imageUrl,
|
|
6277
|
+
documentType: 'idBarcodeImage',
|
|
6278
|
+
width: 0,
|
|
6279
|
+
height: 0,
|
|
6280
|
+
barcodeReadabilityScore: action.payload.barcodeReadabilityScore
|
|
6281
|
+
}
|
|
6282
|
+
});
|
|
6213
6283
|
case 'flipRequestCompleted':
|
|
6214
6284
|
return _assign(_assign({}, state), {
|
|
6215
6285
|
captureState: 'capturing',
|
|
@@ -6701,12 +6771,13 @@ var IdCapture = function IdCapture(_a) {
|
|
|
6701
6771
|
height = _q === void 0 ? 1 : _q;
|
|
6702
6772
|
var state = useIdCaptureStore();
|
|
6703
6773
|
var isRearFacing = useCameraStore().isRearFacing;
|
|
6704
|
-
var _r =
|
|
6774
|
+
var _r = useIdCaptureModelsContext(),
|
|
6705
6775
|
modelsReady = _r.ready,
|
|
6706
6776
|
setThresholds = _r.setThresholds,
|
|
6707
6777
|
detectionTime = _r.detectionTime,
|
|
6708
6778
|
focusPredictionTime = _r.focusPredictionTime,
|
|
6709
|
-
getBestFrame = _r.getBestFrame
|
|
6779
|
+
getBestFrame = _r.getBestFrame,
|
|
6780
|
+
getBestBarcode = _r.getBestBarcode;
|
|
6710
6781
|
useEffect(function () {
|
|
6711
6782
|
return dispatchIdCaptureAction({
|
|
6712
6783
|
type: 'captureInitialized'
|
|
@@ -6745,6 +6816,16 @@ var IdCapture = function IdCapture(_a) {
|
|
|
6745
6816
|
});
|
|
6746
6817
|
return;
|
|
6747
6818
|
}
|
|
6819
|
+
var bestBarcode = getBestBarcode();
|
|
6820
|
+
if (bestBarcode) {
|
|
6821
|
+
dispatchIdCaptureAction({
|
|
6822
|
+
type: 'barcodeCaptured',
|
|
6823
|
+
payload: {
|
|
6824
|
+
imageUrl: bestBarcode.canvas.toDataURL('image/jpeg', 0.95),
|
|
6825
|
+
barcodeReadabilityScore: bestBarcode.score
|
|
6826
|
+
}
|
|
6827
|
+
});
|
|
6828
|
+
}
|
|
6748
6829
|
var canvas = bestFrame.canvas,
|
|
6749
6830
|
documentType = bestFrame.documentType,
|
|
6750
6831
|
boundingBox = bestFrame.boundingBox,
|
|
@@ -6761,21 +6842,22 @@ var IdCapture = function IdCapture(_a) {
|
|
|
6761
6842
|
});
|
|
6762
6843
|
var capturedDocumentType = documentType;
|
|
6763
6844
|
setTimeout(function () {
|
|
6764
|
-
var _a;
|
|
6765
|
-
var captureTime =
|
|
6845
|
+
var _a, _b;
|
|
6846
|
+
var captureTime = performance.now() - ((_a = state.captureStartedAt) !== null && _a !== void 0 ? _a : new Date()).getTime();
|
|
6766
6847
|
var metadata = {
|
|
6767
6848
|
autoCapture: 'Y',
|
|
6768
6849
|
captureTime: captureTime,
|
|
6769
6850
|
boundingBox: boundingBox,
|
|
6770
6851
|
bestDetectionScore: detectionScore,
|
|
6771
|
-
bestFocusScore: focusScore
|
|
6852
|
+
bestFocusScore: focusScore,
|
|
6853
|
+
bestBarcodeScore: (_b = bestBarcode === null || bestBarcode === void 0 ? void 0 : bestBarcode.score) !== null && _b !== void 0 ? _b : 0
|
|
6772
6854
|
};
|
|
6773
6855
|
onCapture === null || onCapture === void 0 ? void 0 : onCapture(imageUrl, width, height, capturedDocumentType, metadata);
|
|
6774
6856
|
dispatchIdCaptureAction({
|
|
6775
6857
|
type: 'captured'
|
|
6776
6858
|
});
|
|
6777
6859
|
}, 0);
|
|
6778
|
-
}, [getBestFrame, onCapture, shouldCapture, state.captureStartedAt, state.requestedDocumentType]);
|
|
6860
|
+
}, [getBestBarcode, getBestFrame, onCapture, shouldCapture, state.captureStartedAt, state.requestedDocumentType]);
|
|
6779
6861
|
var theme = useTheme();
|
|
6780
6862
|
colors.guideBoxUnsatisfiedColor || (colors.guideBoxUnsatisfiedColor = (_d = (_c = (_b = theme.idCapture) === null || _b === void 0 ? void 0 : _b.guideBox) === null || _c === void 0 ? void 0 : _c.unsatisfiedColor) !== null && _d !== void 0 ? _d : 'white');
|
|
6781
6863
|
colors.guideBoxSatisfiedColor || (colors.guideBoxSatisfiedColor = (_g = (_f = (_e = theme.idCapture) === null || _e === void 0 ? void 0 : _e.guideBox) === null || _f === void 0 ? void 0 : _f.satisfiedColor) !== null && _g !== void 0 ? _g : 'green');
|
|
@@ -7913,7 +7995,7 @@ var Card = styled.div(templateObject_1$E || (templateObject_1$E = __makeTemplate
|
|
|
7913
7995
|
var FlexCard = styled(Card)(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
7914
7996
|
var templateObject_1$E, templateObject_2$y;
|
|
7915
7997
|
|
|
7916
|
-
var imageDisplayOrder = ['idCardFront', 'idCardBack', 'passport', 'singlePage', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
|
|
7998
|
+
var imageDisplayOrder = ['idCardFront', 'idCardBack', 'idBarcodeImage', 'passport', 'singlePage', 'idFrontIrImage', 'idBackIrImage', 'idFrontUvImage', 'idBackUvImage'];
|
|
7917
7999
|
var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
7918
8000
|
var capturedDocuments = _a.capturedDocuments,
|
|
7919
8001
|
onSubmitClick = _a.onSubmitClick,
|
|
@@ -7955,7 +8037,7 @@ var IdCaptureSuccess = function IdCaptureSuccess(_a) {
|
|
|
7955
8037
|
image: doc,
|
|
7956
8038
|
className: classNames.image,
|
|
7957
8039
|
alt: doc.documentType
|
|
7958
|
-
}), debugMode && ( /*#__PURE__*/React__default.createElement(DebugPre, null, "Document Type: ".concat(doc.documentType, "\nDetection Score: ").concat(doc.detectionScore, "\nFocus Score: ").concat(doc.focusScore, "\nBounding Box: ").concat(JSON.stringify(doc.boundingBox)))));
|
|
8040
|
+
}), debugMode && ( /*#__PURE__*/React__default.createElement(DebugPre, null, name === 'idBarcodeImage' ? "Document Type: ".concat(doc.documentType, "\nReadability Score: ").concat(doc.barcodeReadabilityScore) : "Document Type: ".concat(doc.documentType, "\nDetection Score: ").concat(doc.detectionScore, "\nFocus Score: ").concat(doc.focusScore, "\nBounding Box: ").concat(JSON.stringify(doc.boundingBox)))));
|
|
7959
8041
|
}))), /*#__PURE__*/React__default.createElement(ButtonsColumn, {
|
|
7960
8042
|
className: classNames.buttonsRow
|
|
7961
8043
|
}, /*#__PURE__*/React__default.createElement(WideButton, {
|
|
@@ -10567,7 +10649,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
10567
10649
|
var _5 = useState(false),
|
|
10568
10650
|
overlayDismissed = _5[0],
|
|
10569
10651
|
setOverlayDismissed = _5[1];
|
|
10570
|
-
var _6 =
|
|
10652
|
+
var _6 = useSubmissionContext(),
|
|
10571
10653
|
submissionStatus = _6.submissionStatus,
|
|
10572
10654
|
setIdFrontImage = _6.setIdFrontImage,
|
|
10573
10655
|
setIdBackImage = _6.setIdBackImage,
|
|
@@ -10576,6 +10658,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
10576
10658
|
setIdBackIrImage = _6.setIdBackIrImage,
|
|
10577
10659
|
setIdFrontUvImage = _6.setIdFrontUvImage,
|
|
10578
10660
|
setIdBackUvImage = _6.setIdBackUvImage,
|
|
10661
|
+
setIdBarcodeImage = _6.setIdBarcodeImage,
|
|
10579
10662
|
logIdFrontCaptureAttempt = _6.logIdFrontCaptureAttempt,
|
|
10580
10663
|
logIdBackCaptureAttempt = _6.logIdBackCaptureAttempt;
|
|
10581
10664
|
var _7 = useIdCaptureModelsContext(),
|
|
@@ -10666,7 +10749,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
10666
10749
|
});
|
|
10667
10750
|
}, [logCaptureMetadata, onDocumentCaptured]);
|
|
10668
10751
|
var onSubmitClick = useCallback(function () {
|
|
10669
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
10752
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
10670
10753
|
var docs = state.capturedDocuments;
|
|
10671
10754
|
var submission = {
|
|
10672
10755
|
idFrontImage: maybeDataUrlToBase64Sync((_a = docs.idCardFront) === null || _a === void 0 ? void 0 : _a.imageData),
|
|
@@ -10676,7 +10759,8 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
10676
10759
|
idFrontIrImage: maybeDataUrlToBase64Sync((_e = docs.idFrontIrImage) === null || _e === void 0 ? void 0 : _e.imageData),
|
|
10677
10760
|
idBackIrImage: maybeDataUrlToBase64Sync((_f = docs.idBackIrImage) === null || _f === void 0 ? void 0 : _f.imageData),
|
|
10678
10761
|
idFrontUvImage: maybeDataUrlToBase64Sync((_g = docs.idFrontUvImage) === null || _g === void 0 ? void 0 : _g.imageData),
|
|
10679
|
-
idBackUvImage: maybeDataUrlToBase64Sync((_h = docs.idBackUvImage) === null || _h === void 0 ? void 0 : _h.imageData)
|
|
10762
|
+
idBackUvImage: maybeDataUrlToBase64Sync((_h = docs.idBackUvImage) === null || _h === void 0 ? void 0 : _h.imageData),
|
|
10763
|
+
idBarcodeImage: maybeDataUrlToBase64Sync((_j = docs.idBarcodeImage) === null || _j === void 0 ? void 0 : _j.imageData)
|
|
10680
10764
|
};
|
|
10681
10765
|
if (submission.idFrontImage) setIdFrontImage(submission.idFrontImage);
|
|
10682
10766
|
if (submission.idBackImage) setIdBackImage(submission.idBackImage);
|
|
@@ -10686,11 +10770,12 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
|
|
|
10686
10770
|
if (submission.idBackIrImage) setIdBackIrImage(submission.idBackIrImage);
|
|
10687
10771
|
if (submission.idFrontUvImage) setIdFrontUvImage(submission.idFrontUvImage);
|
|
10688
10772
|
if (submission.idBackUvImage) setIdBackUvImage(submission.idBackUvImage);
|
|
10773
|
+
if (submission.idBarcodeImage) setIdBarcodeImage(submission.idBarcodeImage);
|
|
10689
10774
|
if (releaseCameraAccessOnExit) releaseCameraAccess();
|
|
10690
10775
|
setTimeout(function () {
|
|
10691
10776
|
return onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(submission);
|
|
10692
10777
|
}, 0);
|
|
10693
|
-
}, [onSuccess, releaseCameraAccess, releaseCameraAccessOnExit, setIdBackImage, setIdBackIrImage, setIdBackUvImage, setIdFrontImage, setIdFrontIrImage, setIdFrontUvImage, setPassportImage, state.capturedDocuments]);
|
|
10778
|
+
}, [onSuccess, releaseCameraAccess, releaseCameraAccessOnExit, setIdBarcodeImage, setIdBackImage, setIdBackIrImage, setIdBackUvImage, setIdFrontImage, setIdFrontIrImage, setIdFrontUvImage, setPassportImage, state.capturedDocuments]);
|
|
10694
10779
|
var showSuccessScreen = useShowSuccessScreen(skipSuccessScreen, state.captureState === 'complete', onSubmitClick);
|
|
10695
10780
|
var onRetryClick = useCallback(function () {
|
|
10696
10781
|
return dispatchIdCaptureAction({
|
|
@@ -11492,47 +11577,315 @@ function SelfieCaptureAnimatedMaskWithStatus(_a) {
|
|
|
11492
11577
|
setFrame(0);
|
|
11493
11578
|
return;
|
|
11494
11579
|
}
|
|
11495
|
-
setFrame(1);
|
|
11496
|
-
var interval = setInterval(function () {
|
|
11497
|
-
setFrame(function (n) {
|
|
11498
|
-
return (n + 1) % 6;
|
|
11580
|
+
setFrame(1);
|
|
11581
|
+
var interval = setInterval(function () {
|
|
11582
|
+
setFrame(function (n) {
|
|
11583
|
+
return (n + 1) % 6;
|
|
11584
|
+
});
|
|
11585
|
+
}, 250);
|
|
11586
|
+
return function () {
|
|
11587
|
+
clearInterval(interval);
|
|
11588
|
+
};
|
|
11589
|
+
}, [status]);
|
|
11590
|
+
return /*#__PURE__*/React__default.createElement(SelfieCaptureAnimatedMask, _assign({}, props, {
|
|
11591
|
+
frame: frame,
|
|
11592
|
+
status: status
|
|
11593
|
+
}));
|
|
11594
|
+
}
|
|
11595
|
+
var templateObject_1$p, templateObject_2$m, templateObject_3$g;
|
|
11596
|
+
|
|
11597
|
+
var FaceCaptureGuideContainer = styled.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"], ["\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"])));
|
|
11598
|
+
var FaceCaptureGuideInner = styled.div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n position: relative;\n height: 60%;\n"], ["\n position: relative;\n height: 60%;\n"])));
|
|
11599
|
+
var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
|
|
11600
|
+
var _b = _a.classNames,
|
|
11601
|
+
classNames = _b === void 0 ? {} : _b,
|
|
11602
|
+
_c = _a.status,
|
|
11603
|
+
status = _c === void 0 ? 'ready' : _c,
|
|
11604
|
+
_d = _a.borderWidth,
|
|
11605
|
+
borderWidth = _d === void 0 ? 5 : _d,
|
|
11606
|
+
_e = _a.borderColor,
|
|
11607
|
+
borderColor = _e === void 0 ? 'white' : _e,
|
|
11608
|
+
_f = _a.borderOpacity,
|
|
11609
|
+
borderOpacity = _f === void 0 ? 0.8 : _f;
|
|
11610
|
+
return /*#__PURE__*/React__default.createElement(FaceCaptureGuideContainer, {
|
|
11611
|
+
className: classNames.container
|
|
11612
|
+
}, /*#__PURE__*/React__default.createElement(FaceCaptureGuideInner, null, /*#__PURE__*/React__default.createElement(SelfieCaptureAnimatedMaskWithStatus, {
|
|
11613
|
+
status: status,
|
|
11614
|
+
borderColor: borderColor,
|
|
11615
|
+
borderWidth: borderWidth,
|
|
11616
|
+
borderOpacity: borderOpacity,
|
|
11617
|
+
verticalAlign: "center"
|
|
11618
|
+
})));
|
|
11619
|
+
};
|
|
11620
|
+
var templateObject_1$o, templateObject_2$l;
|
|
11621
|
+
|
|
11622
|
+
var defaultSelfieCaptureModelLoadTimeoutMs = 45000;
|
|
11623
|
+
var detector = null;
|
|
11624
|
+
var detectorSettings = null;
|
|
11625
|
+
function loadFaceDetector() {
|
|
11626
|
+
return __awaiter(this, arguments, void 0, function (modelAssetPath) {
|
|
11627
|
+
var _a, _b;
|
|
11628
|
+
if (modelAssetPath === void 0) {
|
|
11629
|
+
modelAssetPath = defaultFaceDetectorModelPath;
|
|
11630
|
+
}
|
|
11631
|
+
return __generator(this, function (_c) {
|
|
11632
|
+
switch (_c.label) {
|
|
11633
|
+
case 0:
|
|
11634
|
+
if (detector && (detectorSettings === null || detectorSettings === void 0 ? void 0 : detectorSettings.modelAssetPath) === modelAssetPath) return [2 /*return*/, detector];
|
|
11635
|
+
closeFaceDetector();
|
|
11636
|
+
return [4 /*yield*/, preloadFaceDetectorDependencies()];
|
|
11637
|
+
case 1:
|
|
11638
|
+
_c.sent();
|
|
11639
|
+
if (modelCapabilities.delegate === 'NONE') {
|
|
11640
|
+
throw new Error('No available delegate for face detector.');
|
|
11641
|
+
}
|
|
11642
|
+
_b = (_a = FaceDetector).createFromOptions;
|
|
11643
|
+
return [4 /*yield*/, FilesetResolver.forVisionTasks(visionTasksBasePath)];
|
|
11644
|
+
case 2:
|
|
11645
|
+
return [4 /*yield*/, _b.apply(_a, [_c.sent(), {
|
|
11646
|
+
// canvas: document.createElement('canvas'),
|
|
11647
|
+
baseOptions: {
|
|
11648
|
+
modelAssetPath: modelAssetPath,
|
|
11649
|
+
delegate: modelCapabilities.delegate
|
|
11650
|
+
},
|
|
11651
|
+
runningMode: 'VIDEO'
|
|
11652
|
+
}])];
|
|
11653
|
+
case 3:
|
|
11654
|
+
detector = _c.sent();
|
|
11655
|
+
detectorSettings = {
|
|
11656
|
+
modelAssetPath: modelAssetPath
|
|
11657
|
+
};
|
|
11658
|
+
return [2 /*return*/, detector];
|
|
11659
|
+
}
|
|
11660
|
+
});
|
|
11661
|
+
});
|
|
11662
|
+
}
|
|
11663
|
+
function closeFaceDetector() {
|
|
11664
|
+
detector === null || detector === void 0 ? void 0 : detector.close();
|
|
11665
|
+
detector = null;
|
|
11666
|
+
detectorSettings = null;
|
|
11667
|
+
}
|
|
11668
|
+
function useLoadFaceDetector(_a) {
|
|
11669
|
+
var onModelError = _a.onModelError,
|
|
11670
|
+
_b = _a.modelLoadTimeoutMs,
|
|
11671
|
+
modelLoadTimeoutMs = _b === void 0 ? defaultSelfieCaptureModelLoadTimeoutMs : _b,
|
|
11672
|
+
videoRef = _a.videoRef;
|
|
11673
|
+
var _c = useState('not-started'),
|
|
11674
|
+
modelLoadState = _c[0],
|
|
11675
|
+
setModelLoadState = _c[1];
|
|
11676
|
+
var _d = useState(0),
|
|
11677
|
+
modelDownloadProgress = _d[0],
|
|
11678
|
+
setModelDownloadProgress = _d[1];
|
|
11679
|
+
var _e = useState(null),
|
|
11680
|
+
modelWarmingStartedAt = _e[0],
|
|
11681
|
+
setModelWarmingStartedAt = _e[1];
|
|
11682
|
+
var _f = useState(null),
|
|
11683
|
+
modelError = _f[0],
|
|
11684
|
+
setModelError = _f[1];
|
|
11685
|
+
useEffect(function loadModel() {
|
|
11686
|
+
var _this = this;
|
|
11687
|
+
setModelLoadState('downloading');
|
|
11688
|
+
setModelWarmingStartedAt(null);
|
|
11689
|
+
var modelLoadTimeout = setTimeout(function () {
|
|
11690
|
+
setModelError(new Error('Model loading time limit exceeded.'));
|
|
11691
|
+
}, modelLoadTimeoutMs);
|
|
11692
|
+
function handleDownloadProgress(event) {
|
|
11693
|
+
setModelDownloadProgress(progressToPercentage(event.detail));
|
|
11694
|
+
}
|
|
11695
|
+
document.addEventListener('idmission.preloadProgress.faceDetection', handleDownloadProgress);
|
|
11696
|
+
var cancelVideoReady = function cancelVideoReady() {};
|
|
11697
|
+
loadFaceDetector().then(function (model) {
|
|
11698
|
+
return __awaiter(_this, void 0, void 0, function () {
|
|
11699
|
+
var _a, videoReady, cancel, cancelled;
|
|
11700
|
+
return __generator(this, function (_b) {
|
|
11701
|
+
switch (_b.label) {
|
|
11702
|
+
case 0:
|
|
11703
|
+
setModelDownloadProgress(100);
|
|
11704
|
+
clearTimeout(modelLoadTimeout);
|
|
11705
|
+
setModelLoadState('warming');
|
|
11706
|
+
setModelWarmingStartedAt(performance.now());
|
|
11707
|
+
return [4 /*yield*/, testFaceDetectionAgainstKnownImage(model)];
|
|
11708
|
+
case 1:
|
|
11709
|
+
_b.sent();
|
|
11710
|
+
_a = waitForVideoReady(videoRef), videoReady = _a[0], cancel = _a[1];
|
|
11711
|
+
cancelled = false;
|
|
11712
|
+
cancelVideoReady = function cancelVideoReady() {
|
|
11713
|
+
cancelled = true;
|
|
11714
|
+
cancel();
|
|
11715
|
+
};
|
|
11716
|
+
return [4 /*yield*/, videoReady];
|
|
11717
|
+
case 2:
|
|
11718
|
+
_b.sent();
|
|
11719
|
+
if (cancelled) return [2 /*return*/];
|
|
11720
|
+
model.detectForVideo(videoRef.current, performance.now());
|
|
11721
|
+
setModelLoadState('ready');
|
|
11722
|
+
return [2 /*return*/];
|
|
11723
|
+
}
|
|
11724
|
+
});
|
|
11499
11725
|
});
|
|
11500
|
-
}
|
|
11726
|
+
})["catch"](function (e) {
|
|
11727
|
+
setModelError(e);
|
|
11728
|
+
setModelLoadState('error');
|
|
11729
|
+
})["finally"](function () {
|
|
11730
|
+
clearTimeout(modelLoadTimeout);
|
|
11731
|
+
});
|
|
11501
11732
|
return function () {
|
|
11502
|
-
|
|
11733
|
+
log('unloading face detection model');
|
|
11734
|
+
cancelVideoReady();
|
|
11735
|
+
closeFaceDetector();
|
|
11736
|
+
clearTimeout(modelLoadTimeout);
|
|
11737
|
+
document.removeEventListener('idmission.preloadProgress.faceDetection', handleDownloadProgress);
|
|
11503
11738
|
};
|
|
11504
|
-
}, [
|
|
11505
|
-
|
|
11506
|
-
|
|
11507
|
-
|
|
11508
|
-
|
|
11739
|
+
}, [modelLoadTimeoutMs, videoRef]);
|
|
11740
|
+
useEffect(function handleModelError() {
|
|
11741
|
+
if (modelError) onModelError === null || onModelError === void 0 ? void 0 : onModelError(modelError);
|
|
11742
|
+
}, [modelError, onModelError]);
|
|
11743
|
+
return useMemo(function () {
|
|
11744
|
+
return {
|
|
11745
|
+
ready: modelLoadState === 'ready',
|
|
11746
|
+
modelLoadState: modelLoadState,
|
|
11747
|
+
modelDownloadProgress: modelDownloadProgress,
|
|
11748
|
+
modelWarmingStartedAt: modelWarmingStartedAt,
|
|
11749
|
+
modelError: modelError
|
|
11750
|
+
};
|
|
11751
|
+
}, [modelLoadState, modelDownloadProgress, modelWarmingStartedAt, modelError]);
|
|
11752
|
+
}
|
|
11753
|
+
var lastFaceDetectionAt = 0;
|
|
11754
|
+
var lastFaceDetectionTime = 0;
|
|
11755
|
+
function setLastFaceDetectionAt(time) {
|
|
11756
|
+
lastFaceDetectionTime = time - lastFaceDetectionAt;
|
|
11757
|
+
lastFaceDetectionAt = time;
|
|
11758
|
+
}
|
|
11759
|
+
var framesNeededSamples = [];
|
|
11760
|
+
function trackFramesNeeded(value, bufferLength) {
|
|
11761
|
+
if (bufferLength === void 0) {
|
|
11762
|
+
bufferLength = 25;
|
|
11763
|
+
}
|
|
11764
|
+
framesNeededSamples.unshift(value);
|
|
11765
|
+
if (framesNeededSamples.length > bufferLength) framesNeededSamples.length = bufferLength;
|
|
11766
|
+
}
|
|
11767
|
+
var lastNFaces = [];
|
|
11768
|
+
var lastNPairs = [];
|
|
11769
|
+
function trackFace(face, framesNeeded) {
|
|
11770
|
+
if (framesNeeded === void 0) {
|
|
11771
|
+
framesNeeded = 12;
|
|
11772
|
+
}
|
|
11773
|
+
lastNFaces.unshift(face);
|
|
11774
|
+
if (lastNFaces.length > framesNeeded) lastNFaces.length = framesNeeded;
|
|
11775
|
+
if (lastNFaces.length > 1) {
|
|
11776
|
+
var lastFace = lastNFaces[1];
|
|
11777
|
+
var iou = calculateIoU(face.box, lastFace.box);
|
|
11778
|
+
lastNPairs.unshift({
|
|
11779
|
+
a: face,
|
|
11780
|
+
b: lastFace,
|
|
11781
|
+
iou: iou
|
|
11782
|
+
});
|
|
11783
|
+
if (lastNPairs.length > framesNeeded - 1) lastNPairs.length = framesNeeded - 1;
|
|
11784
|
+
}
|
|
11785
|
+
}
|
|
11786
|
+
function makeFaceDetectorPrediction(imageData) {
|
|
11787
|
+
if (!detector) return null;
|
|
11788
|
+
var prediction = detector.detectForVideo(imageData, performance.now());
|
|
11789
|
+
var faces = prediction.detections.map(function (d) {
|
|
11790
|
+
return {
|
|
11791
|
+
box: convertBoundingBox(d.boundingBox),
|
|
11792
|
+
keypoints: d.keypoints.map(function (k) {
|
|
11793
|
+
var _a;
|
|
11794
|
+
return _assign(_assign({}, k), {
|
|
11795
|
+
x: k.x * imageData.width,
|
|
11796
|
+
y: k.y * imageData.height,
|
|
11797
|
+
name: (_a = k.label) !== null && _a !== void 0 ? _a : ''
|
|
11798
|
+
});
|
|
11799
|
+
})
|
|
11800
|
+
};
|
|
11801
|
+
});
|
|
11802
|
+
return _assign(_assign({}, prediction), {
|
|
11803
|
+
faces: faces
|
|
11804
|
+
});
|
|
11805
|
+
}
|
|
11806
|
+
function processFaceDetectorPrediction(_a) {
|
|
11807
|
+
var faces = _a.faces,
|
|
11808
|
+
videoWidth = _a.videoWidth,
|
|
11809
|
+
videoHeight = _a.videoHeight,
|
|
11810
|
+
_b = _a.requireVerticalFaceCentering,
|
|
11811
|
+
requireVerticalFaceCentering = _b === void 0 ? true : _b,
|
|
11812
|
+
_c = _a.stabilityThreshold,
|
|
11813
|
+
stabilityThreshold = _c === void 0 ? 0.7 : _c;
|
|
11814
|
+
var face = faces[0];
|
|
11815
|
+
var faceNotDetected = faces.length === 0;
|
|
11816
|
+
var faceNotCentered = false,
|
|
11817
|
+
faceLookingAway = false,
|
|
11818
|
+
faceTooClose = false,
|
|
11819
|
+
faceTooFar = false;
|
|
11820
|
+
if (face) {
|
|
11821
|
+
// calculate centroids
|
|
11822
|
+
var vCX = videoWidth / 2;
|
|
11823
|
+
var vCY = videoHeight / 2;
|
|
11824
|
+
var fCX = (face.box.xMin + face.box.xMax) / 2;
|
|
11825
|
+
var fCY = (face.box.yMin + face.box.yMax) / 2;
|
|
11826
|
+
// calculate thresholds
|
|
11827
|
+
var vTX = videoWidth * 0.125;
|
|
11828
|
+
var vTY = videoHeight * 0.125;
|
|
11829
|
+
var fTW = face.box.width * 0.2;
|
|
11830
|
+
var fTH = face.box.height * 0.2;
|
|
11831
|
+
var nose = face.keypoints[2]; //.find((k) => k.name === 'noseTip')
|
|
11832
|
+
if (nose) {
|
|
11833
|
+
faceLookingAway = Math.abs(fCX - nose.x) > fTW || Math.abs(fCY - nose.y) > fTH;
|
|
11834
|
+
var faceNotCenteredHorizontally = Math.abs(vCX - fCX) > vTX;
|
|
11835
|
+
var faceNotCenteredVertically = Math.abs(vCY + 50 - fCY) > vTY;
|
|
11836
|
+
faceNotCentered = faceNotCenteredHorizontally || requireVerticalFaceCentering && faceNotCenteredVertically;
|
|
11837
|
+
}
|
|
11838
|
+
var isMobile = videoWidth < videoHeight;
|
|
11839
|
+
var tooCloseMultiple = 1.5;
|
|
11840
|
+
var tooFarMultiple = isMobile ? 6 : 7;
|
|
11841
|
+
faceTooClose = face.box.width > videoWidth / tooCloseMultiple;
|
|
11842
|
+
faceTooFar = face.box.width < videoWidth / tooFarMultiple;
|
|
11843
|
+
}
|
|
11844
|
+
var faceInGuides = !faceNotDetected && !faceNotCentered && !faceLookingAway && !faceTooClose && !faceTooFar;
|
|
11845
|
+
if (lastFaceDetectionTime > 0) {
|
|
11846
|
+
trackFramesNeeded(500 / lastFaceDetectionTime);
|
|
11847
|
+
}
|
|
11848
|
+
var faceIsStable = false;
|
|
11849
|
+
if (faceInGuides) {
|
|
11850
|
+
var framesNeeded = Math.ceil(average(framesNeededSamples));
|
|
11851
|
+
trackFace(face, framesNeeded);
|
|
11852
|
+
faceIsStable = lastNFaces.length >= framesNeeded && !lastNPairs.some(function (pair) {
|
|
11853
|
+
return pair.iou < stabilityThreshold;
|
|
11854
|
+
});
|
|
11855
|
+
}
|
|
11856
|
+
var faceReady = faceInGuides && faceIsStable;
|
|
11857
|
+
return {
|
|
11858
|
+
face: face,
|
|
11859
|
+
faceNotDetected: faceNotDetected,
|
|
11860
|
+
faceNotCentered: faceNotCentered,
|
|
11861
|
+
faceLookingAway: faceLookingAway,
|
|
11862
|
+
faceTooClose: faceTooClose,
|
|
11863
|
+
faceTooFar: faceTooFar,
|
|
11864
|
+
faceReady: faceReady,
|
|
11865
|
+
faceReadyAt: faceReady ? new Date() : null,
|
|
11866
|
+
faceIsStable: faceIsStable
|
|
11867
|
+
};
|
|
11868
|
+
}
|
|
11869
|
+
function testFaceDetectionAgainstKnownImage(detector) {
|
|
11870
|
+
return new Promise(function (resolve, reject) {
|
|
11871
|
+
var img = new Image();
|
|
11872
|
+
img.crossOrigin = 'anonymous';
|
|
11873
|
+
img.onload = function () {
|
|
11874
|
+
var prediction = detector.detectForVideo(img, performance.now());
|
|
11875
|
+
if (prediction.detections.length > 0) {
|
|
11876
|
+
debug('face detection test result', prediction.detections);
|
|
11877
|
+
resolve(void 0);
|
|
11878
|
+
} else {
|
|
11879
|
+
warn('face detection test failed');
|
|
11880
|
+
reject(new Error('testFaceDetectionAgainstKnownImage failed to predict'));
|
|
11881
|
+
}
|
|
11882
|
+
};
|
|
11883
|
+
img.onerror = function () {
|
|
11884
|
+
return reject(new Error('testFaceDetectionAgainstKnownImage failed to load image'));
|
|
11885
|
+
};
|
|
11886
|
+
img.src = "".concat(DEFAULT_CDN_URL, "/head-test.jpg");
|
|
11887
|
+
});
|
|
11509
11888
|
}
|
|
11510
|
-
var templateObject_1$p, templateObject_2$m, templateObject_3$g;
|
|
11511
|
-
|
|
11512
|
-
var FaceCaptureGuideContainer = styled.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"], ["\n position: absolute;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px;\n box-sizing: border-box;\n"])));
|
|
11513
|
-
var FaceCaptureGuideInner = styled.div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n position: relative;\n height: 60%;\n"], ["\n position: relative;\n height: 60%;\n"])));
|
|
11514
|
-
var FaceCaptureGuideOverlay = function FaceCaptureGuideOverlay(_a) {
|
|
11515
|
-
var _b = _a.classNames,
|
|
11516
|
-
classNames = _b === void 0 ? {} : _b,
|
|
11517
|
-
_c = _a.status,
|
|
11518
|
-
status = _c === void 0 ? 'ready' : _c,
|
|
11519
|
-
_d = _a.borderWidth,
|
|
11520
|
-
borderWidth = _d === void 0 ? 5 : _d,
|
|
11521
|
-
_e = _a.borderColor,
|
|
11522
|
-
borderColor = _e === void 0 ? 'white' : _e,
|
|
11523
|
-
_f = _a.borderOpacity,
|
|
11524
|
-
borderOpacity = _f === void 0 ? 0.8 : _f;
|
|
11525
|
-
return /*#__PURE__*/React__default.createElement(FaceCaptureGuideContainer, {
|
|
11526
|
-
className: classNames.container
|
|
11527
|
-
}, /*#__PURE__*/React__default.createElement(FaceCaptureGuideInner, null, /*#__PURE__*/React__default.createElement(SelfieCaptureAnimatedMaskWithStatus, {
|
|
11528
|
-
status: status,
|
|
11529
|
-
borderColor: borderColor,
|
|
11530
|
-
borderWidth: borderWidth,
|
|
11531
|
-
borderOpacity: borderOpacity,
|
|
11532
|
-
verticalAlign: "center"
|
|
11533
|
-
})));
|
|
11534
|
-
};
|
|
11535
|
-
var templateObject_1$o, templateObject_2$l;
|
|
11536
11889
|
|
|
11537
11890
|
var SelfieGuidanceModelsContext = /*#__PURE__*/createContext({
|
|
11538
11891
|
start: function start() {
|