@jaak.ai/stamps 2.0.0-dev.45 → 2.0.0-dev.46
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/jaak-stamps-webcomponent.cjs.js +1 -1
- package/dist/cjs/jaak-stamps.cjs.entry.js +47 -2
- package/dist/cjs/jaak-stamps.cjs.entry.js.map +1 -1
- package/dist/cjs/jaak-stamps.entry.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/my-component/my-component.js +89 -3
- package/dist/collection/components/my-component/my-component.js.map +1 -1
- package/dist/components/jaak-stamps.js +50 -2
- package/dist/components/jaak-stamps.js.map +1 -1
- package/dist/esm/jaak-stamps-webcomponent.js +1 -1
- package/dist/esm/jaak-stamps.entry.js +47 -2
- package/dist/esm/jaak-stamps.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/jaak-stamps-webcomponent/jaak-stamps-webcomponent.esm.js +1 -1
- package/dist/jaak-stamps-webcomponent/jaak-stamps.entry.esm.js.map +1 -1
- package/dist/jaak-stamps-webcomponent/{p-10ee2dab.entry.js → p-1d39b9be.entry.js} +2 -2
- package/dist/jaak-stamps-webcomponent/p-1d39b9be.entry.js.map +1 -0
- package/dist/types/components/my-component/my-component.d.ts +6 -0
- package/dist/types/components.d.ts +16 -0
- package/package.json +2 -2
- package/dist/jaak-stamps-webcomponent/p-10ee2dab.entry.js.map +0 -1
|
@@ -18,7 +18,7 @@ var patchBrowser = () => {
|
|
|
18
18
|
|
|
19
19
|
patchBrowser().then(async (options) => {
|
|
20
20
|
await index.globalScripts();
|
|
21
|
-
return index.bootstrapLazy([["jaak-stamps.cjs",[[1,"jaak-stamps",{"debug":[4],"alignmentTolerance":[2,"alignment-tolerance"],"maskSize":[2,"mask-size"],"cropMargin":[2,"crop-margin"],"useDocumentClassification":[4,"use-document-classification"],"preferredCamera":[1,"preferred-camera"],"captureDelay":[2,"capture-delay"],"detectionBoxes":[32],"sideAlignment":[32],"isMaskReady":[32],"shouldMirrorVideo":[32],"showCameraSelector":[32],"isSwitchingCamera":[32],"hasDocumentDetected":[32],"currentStatus":[32],"performanceData":[32],"getCapturedImages":[64],"isProcessCompleted":[64],"startCapture":[64],"stopCapture":[64],"resetCapture":[64],"skipBackCapture":[64],"getStatus":[64],"preloadModel":[64],"getCameraInfo":[64],"setPreferredCamera":[64],"setCaptureDelay":[64],"getCaptureDelay":[64],"setTorchEnabled":[64],"focusAtPoint":[64]}]]]], options);
|
|
21
|
+
return index.bootstrapLazy([["jaak-stamps.cjs",[[1,"jaak-stamps",{"debug":[4],"alignmentTolerance":[2,"alignment-tolerance"],"maskSize":[2,"mask-size"],"cropMargin":[2,"crop-margin"],"useDocumentClassification":[4,"use-document-classification"],"preferredCamera":[1,"preferred-camera"],"captureDelay":[2,"capture-delay"],"enableBackDocumentTimer":[4,"enable-back-document-timer"],"backDocumentTimerDuration":[2,"back-document-timer-duration"],"detectionBoxes":[32],"sideAlignment":[32],"isMaskReady":[32],"shouldMirrorVideo":[32],"showCameraSelector":[32],"isSwitchingCamera":[32],"hasDocumentDetected":[32],"currentStatus":[32],"performanceData":[32],"backDocumentTimerRemaining":[32],"getCapturedImages":[64],"isProcessCompleted":[64],"startCapture":[64],"stopCapture":[64],"resetCapture":[64],"skipBackCapture":[64],"getStatus":[64],"preloadModel":[64],"getCameraInfo":[64],"setPreferredCamera":[64],"setCaptureDelay":[64],"getCaptureDelay":[64],"setTorchEnabled":[64],"focusAtPoint":[64]}]]]], options);
|
|
22
22
|
});
|
|
23
23
|
|
|
24
24
|
exports.setNonce = index.setNonce;
|
|
@@ -1159,6 +1159,8 @@ const JaakStamps = class {
|
|
|
1159
1159
|
useDocumentClassification = false;
|
|
1160
1160
|
preferredCamera = 'auto';
|
|
1161
1161
|
captureDelay = 1500;
|
|
1162
|
+
enableBackDocumentTimer = false;
|
|
1163
|
+
backDocumentTimerDuration = 20;
|
|
1162
1164
|
captureCompleted;
|
|
1163
1165
|
isReady;
|
|
1164
1166
|
// State derived from services
|
|
@@ -1187,6 +1189,7 @@ const JaakStamps = class {
|
|
|
1187
1189
|
successfulDetections: 0,
|
|
1188
1190
|
detectionRate: 0
|
|
1189
1191
|
};
|
|
1192
|
+
backDocumentTimerRemaining = 0;
|
|
1190
1193
|
// Services
|
|
1191
1194
|
serviceContainer;
|
|
1192
1195
|
logger;
|
|
@@ -1205,6 +1208,7 @@ const JaakStamps = class {
|
|
|
1205
1208
|
hasScreenshotTaken = false;
|
|
1206
1209
|
alignmentStartTime;
|
|
1207
1210
|
alignmentTimer;
|
|
1211
|
+
backDocumentTimer;
|
|
1208
1212
|
// Performance monitoring
|
|
1209
1213
|
performanceMetrics = {
|
|
1210
1214
|
fps: 0,
|
|
@@ -1670,7 +1674,13 @@ const JaakStamps = class {
|
|
|
1670
1674
|
});
|
|
1671
1675
|
}
|
|
1672
1676
|
// Update document detection state
|
|
1677
|
+
const wasDocumentDetected = this.hasDocumentDetected;
|
|
1673
1678
|
this.hasDocumentDetected = detections.length > 0;
|
|
1679
|
+
// Restart timer if document detected during back capture
|
|
1680
|
+
if (!wasDocumentDetected && this.hasDocumentDetected &&
|
|
1681
|
+
captureState.step === 'back' && this.enableBackDocumentTimer) {
|
|
1682
|
+
this.startBackDocumentTimer();
|
|
1683
|
+
}
|
|
1674
1684
|
// Adaptive frame rate
|
|
1675
1685
|
if (detections.length === 0) {
|
|
1676
1686
|
this.consecutiveFailures++;
|
|
@@ -1747,7 +1757,7 @@ const JaakStamps = class {
|
|
|
1747
1757
|
availableCameras: [],
|
|
1748
1758
|
selectedCameraId: null,
|
|
1749
1759
|
deviceType: 'desktop'};
|
|
1750
|
-
return (index.h("div", { key: '
|
|
1760
|
+
return (index.h("div", { key: '9d4d77042218ab3d0bc4fb1ce879db09dc3e78b4', class: "detector-container" }, index.h("div", { key: '51ac8ccb1275637282b038ad8364d19f14ef61b1', class: "video-container" }, index.h("video", { key: 'a34f0481da20ec5b7b62b21aa275ec5f6dfec5d1', ref: el => this.videoRef = el, autoplay: true, muted: true, playsinline: true, class: this.shouldMirrorVideo ? 'mirror' : '', style: { display: captureState.isVideoActive ? 'block' : 'none' } }), index.h("div", { key: '43b71dfe3eaf20ffa66a4139e24b1af6a2074631', ref: el => this.detectionContainer = el, class: `detection-overlay ${this.shouldMirrorVideo ? 'mirror' : ''}` }, this.debug && this.detectionBoxes.map((box, index$1) => (index.h("div", { key: index$1, class: "detection-box", style: {
|
|
1751
1761
|
position: 'absolute',
|
|
1752
1762
|
left: `${box.x}px`,
|
|
1753
1763
|
top: `${box.y}px`,
|
|
@@ -1756,7 +1766,9 @@ const JaakStamps = class {
|
|
|
1756
1766
|
border: '2px solid #32406C',
|
|
1757
1767
|
pointerEvents: 'none',
|
|
1758
1768
|
boxSizing: 'border-box'
|
|
1759
|
-
} })))), this.isMaskReady && (index.h("div", { key: '
|
|
1769
|
+
} })))), this.isMaskReady && (index.h("div", { key: 'c2596f8cabb227e3ea3b082495f52b141cb1690f', class: "overlay-mask" }, index.h("div", { key: 'ba1ea39b5df1cd312a9bd9410b7225a29cfb8a29', class: "card-outline" }, index.h("div", { key: '6ce4d4d969d5f3fbcf75a4eb285f61d434c5633b', class: "side side-top" }), index.h("div", { key: '36653ecc4fcda25dfc84bc4d1f4c4c5dfb71ced7', class: "side side-right" }), index.h("div", { key: '8b108fa8fb370b229a0d1a77cb1ff044319a8f75', class: "side side-bottom" }), index.h("div", { key: 'a7aa3b45c065a50445aafd5c3ccefb57b0c9c769', class: "side side-left" }), !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (index.h("div", { key: 'b94b92273e12a019238e11ae57f21e140f13c3f1', class: "guide-text" }, "Alinee su identificaci\u00F3n con el marco"))), captureState.step === 'back' && !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (index.h("button", { key: 'c035db562697dc47104e2eca0bdf5edb9ddf2c5c', class: "skip-button", onClick: () => this.skipBackCapture(), type: "button" }, this.enableBackDocumentTimer && this.backDocumentTimerRemaining > 0
|
|
1770
|
+
? `Saltar reverso (${this.backDocumentTimerRemaining}s)`
|
|
1771
|
+
: 'Saltar reverso')), captureState.isVideoActive && (index.h("div", { key: '89f12b3d8a62f432c7dc9681103f58aaa62e825d', class: "camera-controls" }, index.h("button", { key: '3b33078be683b917d6305b625626064d68ad96d0', class: `camera-selector-button ${this.isSwitchingCamera ? 'loading' : ''}`, onClick: () => this.toggleCameraSelector(), type: "button", title: "Seleccionar c\u00E1mara", disabled: this.isSwitchingCamera }, this.isSwitchingCamera ? (index.h("div", { class: "button-spinner" })) : ('Cámaras')))), this.showCameraSelector && cameraInfo.availableCameras.length > 0 && (index.h("div", { key: 'cfb3a8d6b54819f547f14216ed8f7125a3e8204f', class: "camera-selector-dropdown" }, index.h("div", { key: '55fdca0391d4168e6213cc13a984331192cc0418', class: "camera-selector-header" }, index.h("span", { key: '514afcdfae390b12e62cec48952c3a2b2776ff13' }, "Seleccionar C\u00E1mara"), index.h("button", { key: '4b024517f86bdf88f3e6ff7ef0265203dabddb77', class: "close-selector", onClick: () => this.toggleCameraSelector(), type: "button" }, "\u00D7")), index.h("div", { key: '6847609f0b1dfeca5684222c81b1c286e97a5338', class: "camera-list" }, cameraInfo.availableCameras.map((camera) => (index.h("button", { key: camera.id, class: `camera-option ${cameraInfo.selectedCameraId === camera.id ? 'selected' : ''}`, onClick: () => this.handleCameraSwitch(camera.id), type: "button" }, index.h("span", { class: "camera-label" }, camera.label || `Cámara ${cameraInfo.availableCameras.indexOf(camera) + 1}`), cameraInfo.selectedCameraId === camera.id && (index.h("span", { class: "selected-indicator" }, "\u2713")))))), index.h("div", { key: '64b10c71389ce687afbe797d6ea4375fc6e3445f', class: "device-info" }, index.h("small", { key: '0084017f0934ce4f63fe609e731540e1e1b49813' }, "Dispositivo: ", cameraInfo.deviceType)))))), captureState.isCapturing && (index.h("div", { key: 'fb6e41f1a26a258a8a8b1a7f91ac20da0e7f1574', class: "capture-animation" })), captureState.showFlipAnimation && (index.h("div", { key: '63e516f170c04dadfdf7ced2b930d017b313dfd3', class: "flip-animation" }, index.h("div", { key: 'fa3676adb192dec0f5389080659775e3ecc265b6', class: "id-card-icon" }), index.h("div", { key: '2c4cddefeac476bf642470f6404c5b3e9de26b00', class: "flip-text" }, "\u00A1Voltea tu identificaci\u00F3n!"))), captureState.showSuccessAnimation && (index.h("div", { key: '1486f5d26ba46b9acfbb82b5649071584cd9fc3e', class: "success-animation" }, index.h("div", { key: '0fadba687d56a9e143128568a39504b3fb1a5c4f', class: "check-icon" }), index.h("div", { key: 'b7302f6a559ff5ede1e49bef3efe0bd1f2ebe5dc', class: "success-text" }, "\u00A1Proceso completado!"))), index.h("div", { key: '08c9b49216719ac6c63bee3a0d9de5944af806be', class: `component-status status-${this.currentStatus.type}` }, (this.currentStatus.type === 'loading' || this.currentStatus.type === 'initializing') && (index.h("div", { key: '78bd1edfa9cc6c1525c927e2200bd239f153fa05', class: "status-spinner" })), index.h("div", { key: '38cc19e3cedbee2b2492cf896f3816c20f43f76c', class: "status-content" }, index.h("div", { key: '92280665b0f23d882ea64a9ef7316b679d33aa24', class: "status-message" }, this.currentStatus.message), this.currentStatus.description && (index.h("div", { key: 'e2608bffb1430d565ea48ec4f3020320dd6df942', class: "status-description" }, this.currentStatus.description)))), this.debug && (index.h("div", { key: '70540ce4120a5e58477d27b9ada583d1bd08d173', class: "performance-monitor" }, index.h("div", { key: '9748bd765097226c6b83cfb11014addf50bc689a', class: "performance-expanded" }, index.h("div", { key: '232b42e1711cfc3fc5273570d342ca76dd9bd600', class: "metrics-row" }, index.h("div", { key: '582de2674be443604bc7ea1d0febac35f0b4d98c', class: "metric-compact" }, index.h("span", { key: 'd7814f7e32ca27bcd1262bf70d23e0f20de8f4fe', class: "metric-label" }, "FPS"), index.h("span", { key: '80d35b145b152d40a587b2f367dbb90d8410a51c', class: `metric-value ${this.performanceData.fps < 15 ? 'warning' : this.performanceData.fps < 10 ? 'danger' : 'good'}` }, this.performanceData.fps)), index.h("div", { key: 'e34ab4ac393d65626e07f363de76bb4db0a6eb89', class: "metric-compact" }, index.h("span", { key: '47d544db4edd3f4ac9d84bdcafb3f24ecffdb53e', class: "metric-label" }, "MEM"), index.h("span", { key: 'd0d8d0e6bc2a868fdb6d9cfa8c7227e5a67c59db', class: `metric-value ${this.performanceData.memoryUsage > 100 ? 'warning' : this.performanceData.memoryUsage > 200 ? 'danger' : 'good'}` }, this.performanceData.memoryUsage, "MB"))), index.h("div", { key: '5b4d97625bf3ce6ff4b3f58c86f0b54b9426c3e1', class: "metrics-row" }, index.h("div", { key: 'a7523a1e08c6134d0660f7bda36036ce58c68f06', class: "metric-compact" }, index.h("span", { key: '7554b3f17b50e40aa03418beaa840a1b4ca54473', class: "metric-label" }, "INF"), index.h("span", { key: 'a3f0e2895bb9b889b927003257861998526460bf', class: `metric-value ${this.performanceData.inferenceTime > 100 ? 'warning' : this.performanceData.inferenceTime > 200 ? 'danger' : 'good'}` }, this.performanceData.inferenceTime, "ms")), index.h("div", { key: '43f4cc28e109d349049bb270710df4a31c8be775', class: "metric-compact" }, index.h("span", { key: '788fd432fafb1885ca6b090bf2c5f109de2a62f5', class: "metric-label" }, "FRAME"), index.h("span", { key: 'de30f8ea0068724999ea4e2541525131f7feff0e', class: `metric-value ${this.performanceData.frameProcessingTime > 50 ? 'warning' : this.performanceData.frameProcessingTime > 100 ? 'danger' : 'good'}` }, this.performanceData.frameProcessingTime, "ms"))), index.h("div", { key: 'ca1f57a73a26f3af81bb237e16ed2799ab20bcc5', class: "metrics-row" }, index.h("div", { key: '4ebc8c75f9e9a713e484774ecb33f277a93aae6a', class: "metric-compact" }, index.h("span", { key: 'b5e3342b69dc7066ef13959c4002ad77cd9602be', class: "metric-label" }, "DET"), index.h("span", { key: '3cddca746d3a028cbac6a2c716710e9f4e3cc9c3', class: "metric-value good" }, this.performanceData.successfulDetections, "/", this.performanceData.totalDetections)), index.h("div", { key: '4896bcb120733c89a018b804c222209795585750', class: "metric-compact" }, index.h("span", { key: '512196bbf3ba72dbceebdd51c3a6cd6080d4ec57', class: "metric-label" }, "RATE"), index.h("span", { key: '78c2478d921ee99d8d990a573b2c90e2d593faf0', class: `metric-value ${this.performanceData.detectionRate < 30 ? 'danger' : this.performanceData.detectionRate < 60 ? 'warning' : 'good'}` }, this.performanceData.detectionRate, "%")))))), index.h("div", { key: 'f2ebe3ed19749fe1db059b1cdca27283373c89da', class: "watermark" }, index.h("img", { key: 'e18b9458221d2f912e6d5280801476c0e35deb9c', src: "https://storage.googleapis.com/jaak-static/commons/powered-by-jaak.png", alt: "Powered by Jaak" })))));
|
|
1760
1772
|
}
|
|
1761
1773
|
// Utility methods
|
|
1762
1774
|
updateDetectionBoxes(boxes) {
|
|
@@ -1825,6 +1837,15 @@ const JaakStamps = class {
|
|
|
1825
1837
|
bottomSide?.classList.toggle('aligned', currentAlignment.bottom);
|
|
1826
1838
|
leftSide?.classList.toggle('aligned', currentAlignment.left);
|
|
1827
1839
|
const allSidesAligned = this.detectionService.areAllSidesAligned(currentAlignment);
|
|
1840
|
+
// Restart back document timer if any border is aligned during back capture
|
|
1841
|
+
const captureState = this.stateManager.getCaptureState();
|
|
1842
|
+
if (captureState.step === 'back' && this.enableBackDocumentTimer && bestBox) {
|
|
1843
|
+
const anyBorderAligned = currentAlignment.top || currentAlignment.right ||
|
|
1844
|
+
currentAlignment.bottom || currentAlignment.left;
|
|
1845
|
+
if (anyBorderAligned) {
|
|
1846
|
+
this.startBackDocumentTimer();
|
|
1847
|
+
}
|
|
1848
|
+
}
|
|
1828
1849
|
if (allSidesAligned && bestBox) {
|
|
1829
1850
|
cardOutline?.classList.add('perfect-match');
|
|
1830
1851
|
corners?.forEach(corner => corner.classList.add('perfect-match'));
|
|
@@ -1939,6 +1960,7 @@ const JaakStamps = class {
|
|
|
1939
1960
|
showFlipAnimation: false,
|
|
1940
1961
|
isDetectionPaused: false
|
|
1941
1962
|
});
|
|
1963
|
+
this.startBackDocumentTimer();
|
|
1942
1964
|
}, 3000);
|
|
1943
1965
|
}
|
|
1944
1966
|
else if (captureState.step === 'back') {
|
|
@@ -1989,9 +2011,32 @@ const JaakStamps = class {
|
|
|
1989
2011
|
cancelAnimationFrame(this.animationId);
|
|
1990
2012
|
this.animationId = undefined;
|
|
1991
2013
|
}
|
|
2014
|
+
this.clearBackDocumentTimer();
|
|
1992
2015
|
this.detectionBoxes = [];
|
|
1993
2016
|
this.logger.state('DETECTOR_DETENIDO', { timestamp: Date.now() });
|
|
1994
2017
|
}
|
|
2018
|
+
startBackDocumentTimer() {
|
|
2019
|
+
if (!this.enableBackDocumentTimer)
|
|
2020
|
+
return;
|
|
2021
|
+
if (this.backDocumentTimer) {
|
|
2022
|
+
clearInterval(this.backDocumentTimer);
|
|
2023
|
+
}
|
|
2024
|
+
this.backDocumentTimerRemaining = this.backDocumentTimerDuration;
|
|
2025
|
+
this.backDocumentTimer = window.setInterval(() => {
|
|
2026
|
+
this.backDocumentTimerRemaining--;
|
|
2027
|
+
if (this.backDocumentTimerRemaining <= 0) {
|
|
2028
|
+
this.clearBackDocumentTimer();
|
|
2029
|
+
this.skipBackCapture();
|
|
2030
|
+
}
|
|
2031
|
+
}, 1000);
|
|
2032
|
+
}
|
|
2033
|
+
clearBackDocumentTimer() {
|
|
2034
|
+
if (this.backDocumentTimer) {
|
|
2035
|
+
clearInterval(this.backDocumentTimer);
|
|
2036
|
+
this.backDocumentTimer = undefined;
|
|
2037
|
+
}
|
|
2038
|
+
this.backDocumentTimerRemaining = 0;
|
|
2039
|
+
}
|
|
1995
2040
|
toggleCameraSelector() {
|
|
1996
2041
|
if (this.isSwitchingCamera)
|
|
1997
2042
|
return; // Don't toggle if switching camera
|