@idscan/idvc2
Version:
component for the capturing documents
318 lines • 24.9 kB
HTML
<html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta charset="utf-8"><title>Demo Pages</title><style>body {
/*background: #eff3fc;*/
background: #ffe4c4;
margin: 0;
}
.container * {
box-sizing: border-box;
font-family: Inter, sans-serif;
}
#control-buttons-container {
margin-top: 25px;
height: 100px;
}
#control-buttons-container button {
padding: 8px;
font-size: 14px;
}</style></head><body><div><div id="videoCapturingEl" class="container"></div></div><div id="control-buttons-container"><button id="btn">Show Spinner</button> <button id="btn-loader">Show Loader</button> <button id="btn-reload">Reload component</button> <button id="btn-remount">Remount component</button> <button id="btn-resetAllSteps">Reset All Steps</button> <button id="btn-reconfig">Change config</button> <button id="btn-reconfig1">Change config 1</button> <button id="btn-redocs">Change docTypes</button> <button id="btn-unmount">Unmount IDVC</button> <button id="btn-change-en">En</button> <button id="btn-change-es">Es</button></div><script src="idvc.js"></script><script src="langs.js"></script><script type="module">import IDVC from './idvc.js'
// 10.105.74.121: 'eyJwZGY0MTdrZXkiOiJXYkZZY2RrdTJOMWdlVXJIb1hZL2RhQW1QUERKZ2NGRTRDODJqazhzYkczaWJoekM0dXV3SnJ4dWZtOE5YcFNBWDJoREhYRXQvMVl4SVhPRGNhOUVHQ0w1cUFPdllQemp2T2hhTzZzcXAvc1lHWGxBTytnZ0NVSkthRm04MTFnQThpajE0RXhrY013NzNLMEwzcEhwMTlvYjdsUUpFSE9xbG83dTNvTjRNczQ9IiwiaW1hZ2VQcm9jZXNzaW5nS2V5Ijoiam1EWWVVMkhqOFhVVWJEdFlPcHRkLzZobnFEcEFQaldhVlpWOG9qOGU3WUVoQ3Q1L3ovNlVlWnRkMDhDWjduaXhrQ1d3SlVpUUllbC9rRHI4RGFxeXpLVnRtZzNRbnROcHZBZnFjQ2ZmeGpBTk1SeVkvbjJWQjloSE02MzlWcG03dktsNWxRQWRJQlFMZFUydGdBcHhYVy9WK3JFa1pIVDVKT1FMdzA0WXBnPSIsInRyYWNrU3RyaW5nUGFyc2VyS2V5IjoiSGlBaUt4UER6amRtUjFSRUZJR0oxUEpmR0tleFl2Z2ZFS3dtVXMwcDVxdWswL1pzbGNiazRXaGt0amFxc0FiYnRyYllZeVB5b21mRm1neFVkLzdHVnJtdFJPTiszZEZZcFk5NHlNMEtSY2dpd3Nrdm5PaGlZZjJubnZ1U0REMGhUWkZKWlh1NDNJNDQxR0U5OHh0d3JJdGN2aVQ1SWJ6bXJOTS9OYlRKK2Z3PSIsImNvbW1vbkxpY2Vuc2VLZXkiOiJkaTdLYmN6T3gzUjA2MTNxNENUaUIrYS9iY2gvcEhuemlucmVUK0JtOXBrcERod1EvbXUyM0dJOFdnOWtkcHRPR3VJbDRmWHpCd214enRZN1hZclg5YVU0SWxoNHhRQUgzY0x6cHJnb0ZyY2EyZjllZ3RJb0NiYkJKcnRWZFVXdUVmZE15NkRMSVA4WG04ZHJjdDFFc29XYnE5dHB3OFh5Ukt4cEM4N1pIbGs9In0='
// 10.105.74.159: 'ew0KICAicGRmNDE3a2V5IjogIjIwdCtiMUY4UFRYNmh5Qy9NbUNGSEV3TGVsZEFkU3k3SEhQZFhKenpUSlFsWkE2cjV2OVZTcXJiMGFRNmNIeEJHUEs0S2xEV2UwbHVYalArK2ZkRXkxUFRwcjNmbnNCMExybkFnUWsrUUR4R0RNdjJpUE9HS2trNTVBWmpZOWVNQ2tsWklyTDRldGl2VEpPaFBSc2FqWFdyZCs1eUtoVExhNUttdGlTSU5TVT0iLA0KICAiaW1hZ2VQcm9jZXNzaW5nS2V5IjogIlBKNk44dWNKRW5kcWN6Z095dnoxd1pGUnNmTExVUmZyN3F6NnRSMnJSalMvNUtUQ3A5RnI2SURaamQzeU1GbzJOanV1NFJ0S1hpTzgveGN0eEJmZVBWN1RiQ3NsNUhhWXhZYk4zRGRhaU1Kd21vdGEraytpZURIdXhPbTNROXhUdklkdkd6QUF3SnM0YmlWSnZra1BVNEF0d3pqL2UrT2w1UGFEM2QzRWhhRT0iLA0KICAidHJhY2tTdHJpbmdQYXJzZXJLZXkiOiAiQWxTOXlwdkN2M0luZk90dmN5dHNlTU56UkRRd01FYnE2VWY1T1BMR2s1cmMwZ3B2bm1WTm5MelROOTliejZuQlE2MDZhOURkeEJiTmlYWDJzV2FqV0FXelhiVHlpTmd3cjd4c1AvcXlyc0ZTcDExcFJtWkFOMnhmVTB3MDlIQVFxeFRDWU1xbWdwZ1RoZHZlZ2Q0UVJ4TlJRZm9rUzBISXZEa2c2S3gwSXVzPSIsDQogICJjb21tb25MaWNlbnNlS2V5IjogIkFnS2tQcHNZK29LZkFESzkvNm9lNnV2bkRpNGJlUWJRc2VsTE5nVU9uZythTnRMaWJnNk52SGJzVXpsTU1CYmdwVGFwMTYxaUNJS2hSMStuYVdpVXdxeW5zQWNPZ1hVSXVMbEFvczVnMDdDTGZxSFk3ci9YQXNQTHNHRUY4V0c5MEpUK3VUYlNYODVCT0tPdllKemVvVWRGK1ZwRGorU1pObXVkdkJwYndIZz0iLA0KICAiaU9TTVJaRGV0ZWN0b3JLZXkiOiAiU0NsM05IQ3hUalVsM0xhbnNFVGdJSDRCODdMcU1melFDVURXTFpHOVBNZTBhMFp3amhYWjFnaHI3RFJjcXBiVlFNWEVZdE80T09BU2NlS3RoaFBjeTVURmRnK1poT2FGa3JwUlY4Q2liblpPckhQU1ZxMVg0L2oreGthQXRXb0ZpMVZHSlZ4dGU3RFB3RWlFNEJjVDh0bWZGZThSYTNsKzlrZVZreUprSWxrPSIsDQogICJpT1NQREZEZXRlY3RvcktleSI6ICIxQjBLLkIxUDBNNU8uRzdJNE4uRTFMNUc5TG5JY0tpTyINCn0='
// LESHA: 'eyJwZGY0MTdrZXkiOiJRZmw3UlhrM2tocHlVQXY3SUFCVUF1L1lkUkpvYW9HRGpZQ3RFN3NlSUFXc0dFT3FpeFpiN1dzMDdsSmtzTVorZk5PNVYvTDZXZEhBRy9RTW94SkEzOE5aUUk4WnJ5dTdrOUpySWg3Y2J4K25wV0JzZXZzVkJFNm9FaHlCUUhsdGhYM2h2UWJ1TXkzNlQySlo2Sm8yeklOZ1Y5Q2ZVU1hVMjN3WDJGbGtIRGc9IiwiaW1hZ2VQcm9jZXNzaW5nS2V5IjoidHVJbStyQThKb0pUeHlFU3FRbCt4RjRweWI1ZXkwSllXNWhhQWpjcjBnWHpaVHU2NFJBYlpMQjRWaVNCWlpGVmhISElybFp0NFlRUFVCRElWNmU0OG95RndkWnVLRllINFNuUlZKSEpBaDB6Y0lONzZXTDBVMWZRdkJNK1lQL293dFQreWxpK2NkUk9jOXRVVHR5U2NsbTZPblFlNU4yK1FDdDdBTmx6NmEwPSIsInRyYWNrU3RyaW5nUGFyc2VyS2V5IjoiQ1ZGOThTdHFqVXU2R09GejNVQUF4KzY2VzhaUWhGQzRMUnJodDU0K3ZDMFdtbUo1Qi91QlpLSEhWdWo4VnYvdnB2ajBybUdES3RIQmtERlY1Y1JhbE5PZkNvZFNZU0lSOTVoTnJNYXhqRU12eVpDcmNXblovSmtmSnoxS3lYNDBqa1Ryb3NrYWpQbTQrRnpDd3Vwa0dYUlRkMXVDSTkvSGE3T1E5YitTN3BzPSIsImNvbW1vbkxpY2Vuc2VLZXkiOiJ3U0s1NU5NVW1UMzRnRDltNE1DL25EK2tEdlE5Vi9SWUp2YXl5WlFOYXVYMjk0VGVMek5qaE44OTlKNElscW9ZNFIrenh2SWhkM2dCQVRXaFB0WEt6NWFJbWdWN1phNWVPZFFwcVVRN3ZBaGxSZ3dnZFVCdnhyTUdkc29RT0lDMnBaR0NiYmowWnZNZXdCYmVYVmhRUWdua0k4N0hXMFVCUzBBVHROTkNoR0k9In0='
// 126: 'eyJwZGY0MTdrZXkiOiJyQmJkSENQclhMTkpIZGRoRTdFQWdmem8wM0xvQThYc0FKVkhIeng0a0ozZXY4VFJMMGdSb3JlYkk4RXpFY0praW5Wbk9Ha1dPWXZFZzlISm04dE00T3haeWozMnFhMjdmUDlzL3l5WU9VRFkrZDJYMVpNWGFyeW5MakRLTjJQYzN1N0toN0MxcGlURkI2ajVaVmk5SlFmUzl0enVCTG1pdzdINGZwL29yUm89IiwiaW1hZ2VQcm9jZXNzaW5nS2V5IjoiSWR5OWZOTHp1OGYxTk4xRXBXMlVKeW1XaFIvVUlhc0dEeUNRTVdvTlBYMmNXc2piNitNNGxIRnhBTU93VUJBYWFzYWFGTkNHaE4wZStPVkgyVEdyYWVOYkNtbDUxTXdCS0Zjc3V4QzhrWXRoTlAxYkMyUC9rUFZDU0RnTmF4MnZYM1VuYXN4RTFPK1hOR0txR3lWdzI0RkVNd0JDSStsSlVZTDZtV2dRTnhFPSIsInRyYWNrU3RyaW5nUGFyc2VyS2V5IjoiYlVaekJrdSs1Vkplb0JmMVVzcm94RHBscEdaR0R2eTloNUJ3QXhuK1o1aWRUbitGZHBYQjZ0SHo5SkR2WXpFVmZ2VHM0YlNmV0hOZFM1cTNWUW5YeHpZWVhVUEM2MFlrYjZ0Q3AwN3ZWZ1JFQ2hqOWU5NURxUk94UFpvYkF5YnNReVc2M2lqNnpxTGRNaFpQZXkreUNTSVlzcjVJY2loZDZDaTQvMmNLR25NPSIsImNvbW1vbkxpY2Vuc2VLZXkiOiJDY2ZvVHdiYjdVcHZtSnZNYys0dEVJZTl1eXhiSDVTSFh5ZjBTVW4xbzA3dlI2UlpTb1hYMTdYeFU4NkVBSGQxcStNYzFZRmh3QmlwSTUrM0xsN2h5N1JEazE5TDBSTVY3T1BMVURueENzMzJ0NDB4d0R6N3Bzd2k1amRrN0RRMEFWbHRaY1Y5TzRuYnAwcVJUYmljbFRlZ2xza1VHcysxWG9oVnR3cENJdXc9In0='
// 192: 'ew0KICAicGRmNDE3a2V5IjogInhlYWtqbE12RWdMb3ZBSXZRMXBEb1dydnRoeks0b0lEbVdOVEppeTM4MXc2dTF5RDNBb1hlUkR0UVBlSHlKUk1Wb3pNcDgveHdPdU15dGl1N1Q3UDhoTytlMkk5UTJXOFNCYmRaOFEyTmdwQ2RZbTlvYmFITExhR0F2eEg4c1EvR1B1QmhFckJaaGc3WktscG13M0tUdk03T1JubEpKempiUDVMOXJJM0ZrOD0iLA0KICAiaW1hZ2VQcm9jZXNzaW5nS2V5IjogIk5pUTZkQVRlVi9qeklYVWR6QjR2eldKeXJIT2d0RWNsVGl5bkdDZWplbUZGd0NtWXRBaWhsNHdkdTZxN3luMklMeVQ2UTk3V1FNLzE2bzJUTVQ2OWwxZFowSFZXVjBjQWF5WWdLMDZIVXdpMWdBV3V1K0ZYSTZObTNCaEpaaGlCS0FuZDhZZzZ2TGg1K2F2U0daazNIVGcwMlFsUElVWFhrckpwN1h1RE5Bbz0iLA0KICAidHJhY2tTdHJpbmdQYXJzZXJLZXkiOiAiWmFkZWNsd1QvVHZjTmlHUDdGYy9SNEtaTXRZWGJ0YktEbG03ckx2UUlZc2paZ0FJTTc0WjBHWXhOODdWL2J1akU1MnpVM3l1VTB5eUhJM3dhYm80RnU3Q2VmMENHcEJqVWJVTmEvamoxZ0JrY3ZBRjQ5b2RmYk5IVXBVcGNWUXl4ZGtPdU5JeGRpU3poN0tLQzdBVy9jYUFBdjdDanpjcmJGckVHZVRQdkpVPSIsDQogICJjb21tb25MaWNlbnNlS2V5IjogIlRYV0VzTkFzWVNUb3dxQnRDU1d4YXY3clJteUNHMmJURlk3TUl5VU5vV3N0dnAyNzZnN3l5NStGNW5vazhuU01hY09JK3hkb2d2TUE4NHJ4OGFlV29ZR3g5bzlBTjNwV0NURE9UREM4YmFQdWhEY3REY2c0Y1R3WWtIQ2I2TVBWSGU3akl4aXA3Z1dyRmpZY0c0MkJhRzRyS3NzZU1KT29yQWF1T3NETkZSRT0iLA0KICAiaU9TTVJaRGV0ZWN0b3JLZXkiOiAiUTJPRXZQTSt3RDkzcklIRjhnVzI0aUpvYVRHSTdFOWJ6NjR0eVFUYTlnbkJwYzBRZXQrc0pDbGsveVd2QVhnYzRyTFpTV0VzSURiS2VOSEFwcDlESVo3WGxmWDFTS3lrUFk2eXVoYXY5YmlNWFY1UlV0RXdpSXliSHBOaFJxNlNxNlliRFNwQ3RKRFA3L0JqSVNTV0lPbU1yWFlrNmNraUtyalkyckNIV2ZjPSIsDQogICJpT1NQREZEZXRlY3RvcktleSI6ICIxQjlLMkUuTzFINk84SS5KMEkuQjFEMEI0R3NPZ0duTCINCn0='
// 10.105.74.159 ew0KICAicGRmNDE3a2V5IjogIjIwdCtiMUY4UFRYNmh5Qy9NbUNGSEV3TGVsZEFkU3k3SEhQZFhKenpUSlFsWkE2cjV2OVZTcXJiMGFRNmNIeEJHUEs0S2xEV2UwbHVYalArK2ZkRXkxUFRwcjNmbnNCMExybkFnUWsrUUR4R0RNdjJpUE9HS2trNTVBWmpZOWVNQ2tsWklyTDRldGl2VEpPaFBSc2FqWFdyZCs1eUtoVExhNUttdGlTSU5TVT0iLA0KICAiaW1hZ2VQcm9jZXNzaW5nS2V5IjogIlBKNk44dWNKRW5kcWN6Z095dnoxd1pGUnNmTExVUmZyN3F6NnRSMnJSalMvNUtUQ3A5RnI2SURaamQzeU1GbzJOanV1NFJ0S1hpTzgveGN0eEJmZVBWN1RiQ3NsNUhhWXhZYk4zRGRhaU1Kd21vdGEraytpZURIdXhPbTNROXhUdklkdkd6QUF3SnM0YmlWSnZra1BVNEF0d3pqL2UrT2w1UGFEM2QzRWhhRT0iLA0KICAidHJhY2tTdHJpbmdQYXJzZXJLZXkiOiAiQWxTOXlwdkN2M0luZk90dmN5dHNlTU56UkRRd01FYnE2VWY1T1BMR2s1cmMwZ3B2bm1WTm5MelROOTliejZuQlE2MDZhOURkeEJiTmlYWDJzV2FqV0FXelhiVHlpTmd3cjd4c1AvcXlyc0ZTcDExcFJtWkFOMnhmVTB3MDlIQVFxeFRDWU1xbWdwZ1RoZHZlZ2Q0UVJ4TlJRZm9rUzBISXZEa2c2S3gwSXVzPSIsDQogICJjb21tb25MaWNlbnNlS2V5IjogIkFnS2tQcHNZK29LZkFESzkvNm9lNnV2bkRpNGJlUWJRc2VsTE5nVU9uZythTnRMaWJnNk52SGJzVXpsTU1CYmdwVGFwMTYxaUNJS2hSMStuYVdpVXdxeW5zQWNPZ1hVSXVMbEFvczVnMDdDTGZxSFk3ci9YQXNQTHNHRUY4V0c5MEpUK3VUYlNYODVCT0tPdllKemVvVWRGK1ZwRGorU1pObXVkdkJwYndIZz0iLA0KICAiaU9TTVJaRGV0ZWN0b3JLZXkiOiAiU0NsM05IQ3hUalVsM0xhbnNFVGdJSDRCODdMcU1melFDVURXTFpHOVBNZTBhMFp3amhYWjFnaHI3RFJjcXBiVlFNWEVZdE80T09BU2NlS3RoaFBjeTVURmRnK1poT2FGa3JwUlY4Q2liblpPckhQU1ZxMVg0L2oreGthQXRXb0ZpMVZHSlZ4dGU3RFB3RWlFNEJjVDh0bWZGZThSYTNsKzlrZVZreUprSWxrPSIsDQogICJpT1NQREZEZXRlY3RvcktleSI6ICIxQjBLLkIxUDBNNU8uRzdJNE4uRTFMNUc5TG5JY0tpTyINCn0=
let config = {
el: 'videoCapturingEl',
licenseKey: 'eyJwZGY0MTdrZXkiOiJXYkZZY2RrdTJOMWdlVXJIb1hZL2RhQW1QUERKZ2NGRTRDODJqazhzYkczaWJoekM0dXV3SnJ4dWZtOE5YcFNBWDJoREhYRXQvMVl4SVhPRGNhOUVHQ0w1cUFPdllQemp2T2hhTzZzcXAvc1lHWGxBTytnZ0NVSkthRm04MTFnQThpajE0RXhrY013NzNLMEwzcEhwMTlvYjdsUUpFSE9xbG83dTNvTjRNczQ9IiwiaW1hZ2VQcm9jZXNzaW5nS2V5Ijoiam1EWWVVMkhqOFhVVWJEdFlPcHRkLzZobnFEcEFQaldhVlpWOG9qOGU3WUVoQ3Q1L3ovNlVlWnRkMDhDWjduaXhrQ1d3SlVpUUllbC9rRHI4RGFxeXpLVnRtZzNRbnROcHZBZnFjQ2ZmeGpBTk1SeVkvbjJWQjloSE02MzlWcG03dktsNWxRQWRJQlFMZFUydGdBcHhYVy9WK3JFa1pIVDVKT1FMdzA0WXBnPSIsInRyYWNrU3RyaW5nUGFyc2VyS2V5IjoiSGlBaUt4UER6amRtUjFSRUZJR0oxUEpmR0tleFl2Z2ZFS3dtVXMwcDVxdWswL1pzbGNiazRXaGt0amFxc0FiYnRyYllZeVB5b21mRm1neFVkLzdHVnJtdFJPTiszZEZZcFk5NHlNMEtSY2dpd3Nrdm5PaGlZZjJubnZ1U0REMGhUWkZKWlh1NDNJNDQxR0U5OHh0d3JJdGN2aVQ1SWJ6bXJOTS9OYlRKK2Z3PSIsImNvbW1vbkxpY2Vuc2VLZXkiOiJkaTdLYmN6T3gzUjA2MTNxNENUaUIrYS9iY2gvcEhuemlucmVUK0JtOXBrcERod1EvbXUyM0dJOFdnOWtkcHRPR3VJbDRmWHpCd214enRZN1hZclg5YVU0SWxoNHhRQUgzY0x6cHJnb0ZyY2EyZjllZ3RJb0NiYkJKcnRWZFVXdUVmZE15NkRMSVA4WG04ZHJjdDFFc29XYnE5dHB3OFh5Ukt4cEM4N1pIbGs9In0=',
autoContinue: false,
fixFrontOrientAfterUpload: true,
realFaceMode: 'all', // none, auto, all
useCDN: false,
useHeic: true,
resizeUploadedImage: 2000,
isShowDocumentTypeSelect: true,
autoStart: false,
allowSubmitWithWarnings: false,
isShowGuidelinesButton: true,
showSubmitBtn: true,
playPreviewAnimations: true,
language: 'en',
networkUrl: '', // Всегда должно быть таким значением для режима разработки
// из-за того, что чанки должны лежать в той же директории, что и idvc.js файл
captureTimeout: 22,
modalPosition: 'center',
autocaptureConfidence: 0.8,
documentTypes: [
{
type: 'DL',
steps: [
{ type: 'front', name: 'Document\'s Front Image', mode: { uploader: true, video: true }, enableDesktopNotification: true, autocaptureDelay: 2000 },
{ type: 'pdf', name: 'Document\'s Back Image', enableFourCornerCapture: true, enableDesktopNotification: true, mode: { uploader: true, video: true }, autocaptureDelay: 0 },
{ type: 'face', name: 'User\ Selfie', mode: { uploader: true, video: true } },
],
},
{
type: 'IC',
steps: [
{ type: 'front', name: 'Document\'s Front Image', mode: { uploader: true, video: true }, enableDesktopNotification: true, autocaptureDelay: 2000 },
{ type: 'pdf', name: 'Document\'s Back Image', enableFourCornerCapture: true, enableDesktopNotification: true, mode: { uploader: true, video: true }, autocaptureDelay: 0 },
{ type: 'face', name: 'User\ Selfie', mode: { uploader: true, video: true } },
],
},
// {
// type: 'VIN',
// steps:[
// { type: 'photo', name: 'VIN' },
// ],
// },
{
type: 'Barcode',
steps:[
{ type: 'barcode', name: 'Barcode detection', mode: { uploader: false, video: true } },
],
},
{
type: 'Passport',
steps:[
// { type: 'front', name: 'Passport Front' },
{ type: 'mrz', name: 'Passport MRZ', enableFourCornerCapture: true, mode: { uploader: true, video: true } },
{ type: 'face', name: 'Face', mode: { uploader: true, video: true } }
],
},
{
type: 'PassportCard',
steps:[
{ type: 'front', name: 'Document Card Front' },
{ type: 'mrz', name: 'Passport Card Back', enableFourCornerCapture: true, mode: { uploader: false, video: true } },
{ type: 'face', name: 'User Selfie', mode: { uploader: true, video: true } }
],
},
{
type: 'GreenCard',
steps:[
{ type: 'front', name: 'Document Front' },
{ type: 'mrz', name: 'Passport Back', mode: { uploader: true, video: true } },
{ type: 'face', name: 'Face', mode: { uploader: true, video: true } }
],
},
{
type: 'InternationalId',
steps: [
{ type: 'front', name: 'Document Front', mode: { uploader: true, video: true }, enableDesktopNotification: true, autocaptureDelay: 3000 },
{ type: 'back', name: 'International Back', enableFourCornerCapture: true, mode: { uploader: true, video: true } },
{ type: 'face', name: 'Face', mode: { uploader: true, video: true } }
]
},
],
onChange (data) {
console.log('change')
console.log(data)
},
onReset (data) {
console.log('reset')
console.log(data)
},
onCameraError (data) {
console.log('CAMERA_ERR', JSON.stringify(data))
},
submit (data) {
console.log('submit data', data);
// return new Promise((resolve, reject) => {
// setTimeout(()=> {
// console.log('SUBMIT TIMEOUT');
// reject();
// }, 2000);
// fetch(
// 'https://us-central1-web-library-test-app-proxy.cloudfunctions.net/api/Verify',
// {
// method: 'POST',
// headers: {
// 'Content-Type': 'application/json;charset=utf-8',
// },
// body: JSON.stringify(data),
// },
// )
// .then((response) => response.json())
// .then((data1) => {
// console.log('inner submit');
// console.log(data1);
// resolve();
// })
// .catch((err) => {
// console.log('inner submit');
// console.log(err);
// reject();
// });
// });
},
onRetakeHook(data) {
console.log('retake');
console.log(data);
},
onMounted() {
console.log('onMounted');
},
onReloaded() {
console.log('onReloaded');
},
onCaptureTimeout(data) {
console.log(data);
}
};
// let newConfig = {
// licenseKey: 'eyJwZGY0MTdrZXkiOiJXYkZZY2RrdTJOMWdlVXJIb1hZL2RhQW1QUERKZ2NGRTRDODJqazhzYkczaWJoekM0dXV3SnJ4dWZtOE5YcFNBWDJoREhYRXQvMVl4SVhPRGNhOUVHQ0w1cUFPdllQemp2T2hhTzZzcXAvc1lHWGxBTytnZ0NVSkthRm04MTFnQThpajE0RXhrY013NzNLMEwzcEhwMTlvYjdsUUpFSE9xbG83dTNvTjRNczQ9IiwiaW1hZ2VQcm9jZXNzaW5nS2V5Ijoiam1EWWVVMkhqOFhVVWJEdFlPcHRkLzZobnFEcEFQaldhVlpWOG9qOGU3WUVoQ3Q1L3ovNlVlWnRkMDhDWjduaXhrQ1d3SlVpUUllbC9rRHI4RGFxeXpLVnRtZzNRbnROcHZBZnFjQ2ZmeGpBTk1SeVkvbjJWQjloSE02MzlWcG03dktsNWxRQWRJQlFMZFUydGdBcHhYVy9WK3JFa1pIVDVKT1FMdzA0WXBnPSIsInRyYWNrU3RyaW5nUGFyc2VyS2V5IjoiSGlBaUt4UER6amRtUjFSRUZJR0oxUEpmR0tleFl2Z2ZFS3dtVXMwcDVxdWswL1pzbGNiazRXaGt0amFxc0FiYnRyYllZeVB5b21mRm1neFVkLzdHVnJtdFJPTiszZEZZcFk5NHlNMEtSY2dpd3Nrdm5PaGlZZjJubnZ1U0REMGhUWkZKWlh1NDNJNDQxR0U5OHh0d3JJdGN2aVQ1SWJ6bXJOTS9OYlRKK2Z3PSIsImNvbW1vbkxpY2Vuc2VLZXkiOiJkaTdLYmN6T3gzUjA2MTNxNENUaUIrYS9iY2gvcEhuemlucmVUK0JtOXBrcERod1EvbXUyM0dJOFdnOWtkcHRPR3VJbDRmWHpCd214enRZN1hZclg5YVU0SWxoNHhRQUgzY0x6cHJnb0ZyY2EyZjllZ3RJb0NiYkJKcnRWZFVXdUVmZE15NkRMSVA4WG04ZHJjdDFFc29XYnE5dHB3OFh5Ukt4cEM4N1pIbGs9In0=',
// showSubmitBtn: true,
// documentTypes: [
// // {
// // type: 'ID',
// // steps: [
// // { type: 'front', name: 'Document Front', mode: { uploader: false, video: true } },
// // { type: 'pdf', name: 'Document PDF417 Barcode', mode: { uploader: false, video: true } },
// // { type: 'face', name: 'Face', mode: { uploader: false, video: true } },
// // ],
// // },
// {
// type: 'PassportCard',
// steps:[
// { type: 'front', name: 'Document Card Front' },
// { type: 'mrz', name: 'Passport Card Back', mode: { uploader: true, video: true } },
// { type: 'face', name: 'User Selfie', mode: { uploader: true, video: true } }
// ],
// },
// // {
// // type: 'FaceAuthorization',
// // steps: [
// // { type: 'face', name: 'Face', mode: { uploader: true, video: true } },
// // ],
// // },
// ],
// onChange (data) {
// console.log('change')
// console.log(data)
// },
// onReset (data) {
// console.log('reset')
// console.log(data)
// },
// onCameraError (data) {
// console.log('CAMERA_ERR', JSON.stringify(data))
// },
// submit (data) {
// console.log('submit', data);
// },
// onRetakeHook(data) {
// console.log('retake');
// console.log(data);
// },
// onMounted() {
// console.log('onMounted');
// },
// onReloaded() {
// console.log('onReloaded');
// },
// };
let newConfig = {
licenseKey: 'eyJwZGY0MTdrZXkiOiJXYkZZY2RrdTJOMWdlVXJIb1hZL2RhQW1QUERKZ2NGRTRDODJqazhzYkczaWJoekM0dXV3SnJ4dWZtOE5YcFNBWDJoREhYRXQvMVl4SVhPRGNhOUVHQ0w1cUFPdllQemp2T2hhTzZzcXAvc1lHWGxBTytnZ0NVSkthRm04MTFnQThpajE0RXhrY013NzNLMEwzcEhwMTlvYjdsUUpFSE9xbG83dTNvTjRNczQ9IiwiaW1hZ2VQcm9jZXNzaW5nS2V5Ijoiam1EWWVVMkhqOFhVVWJEdFlPcHRkLzZobnFEcEFQaldhVlpWOG9qOGU3WUVoQ3Q1L3ovNlVlWnRkMDhDWjduaXhrQ1d3SlVpUUllbC9rRHI4RGFxeXpLVnRtZzNRbnROcHZBZnFjQ2ZmeGpBTk1SeVkvbjJWQjloSE02MzlWcG03dktsNWxRQWRJQlFMZFUydGdBcHhYVy9WK3JFa1pIVDVKT1FMdzA0WXBnPSIsInRyYWNrU3RyaW5nUGFyc2VyS2V5IjoiSGlBaUt4UER6amRtUjFSRUZJR0oxUEpmR0tleFl2Z2ZFS3dtVXMwcDVxdWswL1pzbGNiazRXaGt0amFxc0FiYnRyYllZeVB5b21mRm1neFVkLzdHVnJtdFJPTiszZEZZcFk5NHlNMEtSY2dpd3Nrdm5PaGlZZjJubnZ1U0REMGhUWkZKWlh1NDNJNDQxR0U5OHh0d3JJdGN2aVQ1SWJ6bXJOTS9OYlRKK2Z3PSIsImNvbW1vbkxpY2Vuc2VLZXkiOiJkaTdLYmN6T3gzUjA2MTNxNENUaUIrYS9iY2gvcEhuemlucmVUK0JtOXBrcERod1EvbXUyM0dJOFdnOWtkcHRPR3VJbDRmWHpCd214enRZN1hZclg5YVU0SWxoNHhRQUgzY0x6cHJnb0ZyY2EyZjllZ3RJb0NiYkJKcnRWZFVXdUVmZE15NkRMSVA4WG04ZHJjdDFFc29XYnE5dHB3OFh5Ukt4cEM4N1pIbGs9In0=',
chunkPublicPath: '',
networkUrl: 'networks/',
language: 'es',
isShowDocumentTypeSelect: true,
documentTypes: [
{
type: 'GreenCard',
steps:[
{ type: 'front', name: 'Document Front' },
{ type: 'mrz', name: 'Passport Back', mode: { uploader: true, video: true } },
{ type: 'face', name: 'Face', mode: { uploader: true, video: true } }
],
},
{
type: 'InternationalId',
steps: [
{ type: 'front', name: 'Document Front', mode: { uploader: true, video: true }, enableDesktopNotification: true, autocaptureDelay: 3000 },
{ type: 'back', name: 'International Back', mode: { uploader: true, video: true } },
{ type: 'face', name: 'Face', mode: { uploader: true, video: true } }
]
},
// {
// type: 'PassportCard',
// steps:[
// { type: 'front', name: 'Document Card Front' },
// { type: 'mrz', name: 'Passport Card Back', mode: { uploader: true, video: true } },
// { type: 'face', name: 'User Selfie', mode: { uploader: true, video: true } }
// ],
// },
]
};
let newConfig1 = {
licenseKey: 'eyJwZGY0MTdrZXkiOiJXYkZZY2RrdTJOMWdlVXJIb1hZL2RhQW1QUERKZ2NGRTRDODJqazhzYkczaWJoekM0dXV3SnJ4dWZtOE5YcFNBWDJoREhYRXQvMVl4SVhPRGNhOUVHQ0w1cUFPdllQemp2T2hhTzZzcXAvc1lHWGxBTytnZ0NVSkthRm04MTFnQThpajE0RXhrY013NzNLMEwzcEhwMTlvYjdsUUpFSE9xbG83dTNvTjRNczQ9IiwiaW1hZ2VQcm9jZXNzaW5nS2V5Ijoiam1EWWVVMkhqOFhVVWJEdFlPcHRkLzZobnFEcEFQaldhVlpWOG9qOGU3WUVoQ3Q1L3ovNlVlWnRkMDhDWjduaXhrQ1d3SlVpUUllbC9rRHI4RGFxeXpLVnRtZzNRbnROcHZBZnFjQ2ZmeGpBTk1SeVkvbjJWQjloSE02MzlWcG03dktsNWxRQWRJQlFMZFUydGdBcHhYVy9WK3JFa1pIVDVKT1FMdzA0WXBnPSIsInRyYWNrU3RyaW5nUGFyc2VyS2V5IjoiSGlBaUt4UER6amRtUjFSRUZJR0oxUEpmR0tleFl2Z2ZFS3dtVXMwcDVxdWswL1pzbGNiazRXaGt0amFxc0FiYnRyYllZeVB5b21mRm1neFVkLzdHVnJtdFJPTiszZEZZcFk5NHlNMEtSY2dpd3Nrdm5PaGlZZjJubnZ1U0REMGhUWkZKWlh1NDNJNDQxR0U5OHh0d3JJdGN2aVQ1SWJ6bXJOTS9OYlRKK2Z3PSIsImNvbW1vbkxpY2Vuc2VLZXkiOiJkaTdLYmN6T3gzUjA2MTNxNENUaUIrYS9iY2gvcEhuemlucmVUK0JtOXBrcERod1EvbXUyM0dJOFdnOWtkcHRPR3VJbDRmWHpCd214enRZN1hZclg5YVU0SWxoNHhRQUgzY0x6cHJnb0ZyY2EyZjllZ3RJb0NiYkJKcnRWZFVXdUVmZE15NkRMSVA4WG04ZHJjdDFFc29XYnE5dHB3OFh5Ukt4cEM4N1pIbGs9In0=',
chunkPublicPath: '',
networkUrl: 'networks/',
isShowDocumentTypeSelect: true,
documentTypes: [
{
type: 'PassportCard',
steps:[
{ type: 'front', name: 'Document Card Front' },
{ type: 'mrz', name: 'Passport Card Back', mode: { uploader: true, video: true } },
{ type: 'face', name: 'User Selfie', mode: { uploader: true, video: true } }
],
},
{
type: 'Barcode',
steps:[
{ type: 'barcode', name: 'Barcode detection' },
],
},
]
};
let videoCapturingComponent = new IDVC(config);
let k = false
let c = false
document.getElementById('btn').addEventListener('click', () => {
k = !k
videoCapturingComponent.showSpinner(k)
})
document.getElementById('btn-reconfig').addEventListener('click', () => {
videoCapturingComponent.reloadComponent(newConfig)
})
document.getElementById('btn-reconfig1').addEventListener('click', () => {
videoCapturingComponent.reloadComponent(newConfig1)
})
document.getElementById('btn-loader').addEventListener('click', () => {
c = !c
videoCapturingComponent.showLoader(c, '<div>lupa <br> pupa</div>', 'peepo pepe')
})
document.getElementById('btn-reload').addEventListener('click', () => {
videoCapturingComponent.reloadComponent(config);
})
document.getElementById('btn-resetAllSteps').addEventListener('click', () => {
videoCapturingComponent.resetAllSteps();
})
document.getElementById('btn-remount').addEventListener('click', () => {
const el = document.getElementById(config.el);
el.innerHTML = '';
videoCapturingComponent = new IDVC(config)
})
document.getElementById('btn-redocs').addEventListener('click', () => {
videoCapturingComponent.updateDocumentTypes([
{
type: 'PassportCard',
steps:[
{ type: 'front', name: 'Document Card Front' },
{ type: 'mrz', name: 'Passport Card Back', mode: { uploader: true, video: true } },
{ type: 'face', name: 'User Selfie', mode: { uploader: true, video: true } }
],
},
]);
})
document.getElementById('btn-change-en').addEventListener('click', () => {
videoCapturingComponent.changeLanguage('en');
})
document.getElementById('btn-change-es').addEventListener('click', () => {
videoCapturingComponent.changeLanguage('es');
})
document.getElementById('btn-unmount').addEventListener('click', () => {
const el = document.getElementById(config.el);
el.remove();
})</script></body></html>