@jaak.ai/stamps 2.0.0-dev.44 → 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/README.md +2 -2
- package/dist/cjs/jaak-stamps-webcomponent.cjs.js +1 -1
- package/dist/cjs/jaak-stamps.cjs.entry.js +51 -6
- 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 +95 -9
- package/dist/collection/components/my-component/my-component.js.map +1 -1
- package/dist/components/jaak-stamps.js +54 -6
- 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 +51 -6
- 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-3074405d.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 +20 -4
- package/package.json +2 -2
- package/dist/jaak-stamps-webcomponent/p-3074405d.entry.js.map +0 -1
|
@@ -16,7 +16,7 @@ var patchBrowser = () => {
|
|
|
16
16
|
|
|
17
17
|
patchBrowser().then(async (options) => {
|
|
18
18
|
await globalScripts();
|
|
19
|
-
return bootstrapLazy([["jaak-stamps",[[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);
|
|
19
|
+
return bootstrapLazy([["jaak-stamps",[[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);
|
|
20
20
|
});
|
|
21
21
|
//# sourceMappingURL=jaak-stamps-webcomponent.js.map
|
|
22
22
|
|
|
@@ -1151,12 +1151,14 @@ const JaakStamps = class {
|
|
|
1151
1151
|
}
|
|
1152
1152
|
get el() { return getElement(this); }
|
|
1153
1153
|
debug = false;
|
|
1154
|
-
alignmentTolerance =
|
|
1154
|
+
alignmentTolerance = 15;
|
|
1155
1155
|
maskSize = 80;
|
|
1156
1156
|
cropMargin = 20;
|
|
1157
1157
|
useDocumentClassification = false;
|
|
1158
1158
|
preferredCamera = 'auto';
|
|
1159
|
-
captureDelay =
|
|
1159
|
+
captureDelay = 1500;
|
|
1160
|
+
enableBackDocumentTimer = false;
|
|
1161
|
+
backDocumentTimerDuration = 20;
|
|
1160
1162
|
captureCompleted;
|
|
1161
1163
|
isReady;
|
|
1162
1164
|
// State derived from services
|
|
@@ -1185,6 +1187,7 @@ const JaakStamps = class {
|
|
|
1185
1187
|
successfulDetections: 0,
|
|
1186
1188
|
detectionRate: 0
|
|
1187
1189
|
};
|
|
1190
|
+
backDocumentTimerRemaining = 0;
|
|
1188
1191
|
// Services
|
|
1189
1192
|
serviceContainer;
|
|
1190
1193
|
logger;
|
|
@@ -1203,6 +1206,7 @@ const JaakStamps = class {
|
|
|
1203
1206
|
hasScreenshotTaken = false;
|
|
1204
1207
|
alignmentStartTime;
|
|
1205
1208
|
alignmentTimer;
|
|
1209
|
+
backDocumentTimer;
|
|
1206
1210
|
// Performance monitoring
|
|
1207
1211
|
performanceMetrics = {
|
|
1208
1212
|
fps: 0,
|
|
@@ -1300,8 +1304,8 @@ const JaakStamps = class {
|
|
|
1300
1304
|
this.preferredCamera = 'auto';
|
|
1301
1305
|
}
|
|
1302
1306
|
if (this.captureDelay < 0 || this.captureDelay > 10000) {
|
|
1303
|
-
this.logger.warn(`Propiedad captureDelay inválida. Valor: ${this.captureDelay}, esperado: 0-10000. Usando valor por defecto:
|
|
1304
|
-
this.captureDelay =
|
|
1307
|
+
this.logger.warn(`Propiedad captureDelay inválida. Valor: ${this.captureDelay}, esperado: 0-10000. Usando valor por defecto: 1500`);
|
|
1308
|
+
this.captureDelay = 1500;
|
|
1305
1309
|
}
|
|
1306
1310
|
}
|
|
1307
1311
|
async loadOnnxRuntime() {
|
|
@@ -1668,7 +1672,13 @@ const JaakStamps = class {
|
|
|
1668
1672
|
});
|
|
1669
1673
|
}
|
|
1670
1674
|
// Update document detection state
|
|
1675
|
+
const wasDocumentDetected = this.hasDocumentDetected;
|
|
1671
1676
|
this.hasDocumentDetected = detections.length > 0;
|
|
1677
|
+
// Restart timer if document detected during back capture
|
|
1678
|
+
if (!wasDocumentDetected && this.hasDocumentDetected &&
|
|
1679
|
+
captureState.step === 'back' && this.enableBackDocumentTimer) {
|
|
1680
|
+
this.startBackDocumentTimer();
|
|
1681
|
+
}
|
|
1672
1682
|
// Adaptive frame rate
|
|
1673
1683
|
if (detections.length === 0) {
|
|
1674
1684
|
this.consecutiveFailures++;
|
|
@@ -1745,7 +1755,7 @@ const JaakStamps = class {
|
|
|
1745
1755
|
availableCameras: [],
|
|
1746
1756
|
selectedCameraId: null,
|
|
1747
1757
|
deviceType: 'desktop'};
|
|
1748
|
-
return (h("div", { key: '
|
|
1758
|
+
return (h("div", { key: '9d4d77042218ab3d0bc4fb1ce879db09dc3e78b4', class: "detector-container" }, h("div", { key: '51ac8ccb1275637282b038ad8364d19f14ef61b1', class: "video-container" }, 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' } }), h("div", { key: '43b71dfe3eaf20ffa66a4139e24b1af6a2074631', ref: el => this.detectionContainer = el, class: `detection-overlay ${this.shouldMirrorVideo ? 'mirror' : ''}` }, this.debug && this.detectionBoxes.map((box, index) => (h("div", { key: index, class: "detection-box", style: {
|
|
1749
1759
|
position: 'absolute',
|
|
1750
1760
|
left: `${box.x}px`,
|
|
1751
1761
|
top: `${box.y}px`,
|
|
@@ -1754,7 +1764,9 @@ const JaakStamps = class {
|
|
|
1754
1764
|
border: '2px solid #32406C',
|
|
1755
1765
|
pointerEvents: 'none',
|
|
1756
1766
|
boxSizing: 'border-box'
|
|
1757
|
-
} })))), this.isMaskReady && (h("div", { key: '
|
|
1767
|
+
} })))), this.isMaskReady && (h("div", { key: 'c2596f8cabb227e3ea3b082495f52b141cb1690f', class: "overlay-mask" }, h("div", { key: 'ba1ea39b5df1cd312a9bd9410b7225a29cfb8a29', class: "card-outline" }, h("div", { key: '6ce4d4d969d5f3fbcf75a4eb285f61d434c5633b', class: "side side-top" }), h("div", { key: '36653ecc4fcda25dfc84bc4d1f4c4c5dfb71ced7', class: "side side-right" }), h("div", { key: '8b108fa8fb370b229a0d1a77cb1ff044319a8f75', class: "side side-bottom" }), h("div", { key: 'a7aa3b45c065a50445aafd5c3ccefb57b0c9c769', class: "side side-left" }), !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: 'b94b92273e12a019238e11ae57f21e140f13c3f1', class: "guide-text" }, "Alinee su identificaci\u00F3n con el marco"))), captureState.step === 'back' && !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("button", { key: 'c035db562697dc47104e2eca0bdf5edb9ddf2c5c', class: "skip-button", onClick: () => this.skipBackCapture(), type: "button" }, this.enableBackDocumentTimer && this.backDocumentTimerRemaining > 0
|
|
1768
|
+
? `Saltar reverso (${this.backDocumentTimerRemaining}s)`
|
|
1769
|
+
: 'Saltar reverso')), captureState.isVideoActive && (h("div", { key: '89f12b3d8a62f432c7dc9681103f58aaa62e825d', class: "camera-controls" }, 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 ? (h("div", { class: "button-spinner" })) : ('Cámaras')))), this.showCameraSelector && cameraInfo.availableCameras.length > 0 && (h("div", { key: 'cfb3a8d6b54819f547f14216ed8f7125a3e8204f', class: "camera-selector-dropdown" }, h("div", { key: '55fdca0391d4168e6213cc13a984331192cc0418', class: "camera-selector-header" }, h("span", { key: '514afcdfae390b12e62cec48952c3a2b2776ff13' }, "Seleccionar C\u00E1mara"), h("button", { key: '4b024517f86bdf88f3e6ff7ef0265203dabddb77', class: "close-selector", onClick: () => this.toggleCameraSelector(), type: "button" }, "\u00D7")), h("div", { key: '6847609f0b1dfeca5684222c81b1c286e97a5338', class: "camera-list" }, cameraInfo.availableCameras.map((camera) => (h("button", { key: camera.id, class: `camera-option ${cameraInfo.selectedCameraId === camera.id ? 'selected' : ''}`, onClick: () => this.handleCameraSwitch(camera.id), type: "button" }, h("span", { class: "camera-label" }, camera.label || `Cámara ${cameraInfo.availableCameras.indexOf(camera) + 1}`), cameraInfo.selectedCameraId === camera.id && (h("span", { class: "selected-indicator" }, "\u2713")))))), h("div", { key: '64b10c71389ce687afbe797d6ea4375fc6e3445f', class: "device-info" }, h("small", { key: '0084017f0934ce4f63fe609e731540e1e1b49813' }, "Dispositivo: ", cameraInfo.deviceType)))))), captureState.isCapturing && (h("div", { key: 'fb6e41f1a26a258a8a8b1a7f91ac20da0e7f1574', class: "capture-animation" })), captureState.showFlipAnimation && (h("div", { key: '63e516f170c04dadfdf7ced2b930d017b313dfd3', class: "flip-animation" }, h("div", { key: 'fa3676adb192dec0f5389080659775e3ecc265b6', class: "id-card-icon" }), h("div", { key: '2c4cddefeac476bf642470f6404c5b3e9de26b00', class: "flip-text" }, "\u00A1Voltea tu identificaci\u00F3n!"))), captureState.showSuccessAnimation && (h("div", { key: '1486f5d26ba46b9acfbb82b5649071584cd9fc3e', class: "success-animation" }, h("div", { key: '0fadba687d56a9e143128568a39504b3fb1a5c4f', class: "check-icon" }), h("div", { key: 'b7302f6a559ff5ede1e49bef3efe0bd1f2ebe5dc', class: "success-text" }, "\u00A1Proceso completado!"))), h("div", { key: '08c9b49216719ac6c63bee3a0d9de5944af806be', class: `component-status status-${this.currentStatus.type}` }, (this.currentStatus.type === 'loading' || this.currentStatus.type === 'initializing') && (h("div", { key: '78bd1edfa9cc6c1525c927e2200bd239f153fa05', class: "status-spinner" })), h("div", { key: '38cc19e3cedbee2b2492cf896f3816c20f43f76c', class: "status-content" }, h("div", { key: '92280665b0f23d882ea64a9ef7316b679d33aa24', class: "status-message" }, this.currentStatus.message), this.currentStatus.description && (h("div", { key: 'e2608bffb1430d565ea48ec4f3020320dd6df942', class: "status-description" }, this.currentStatus.description)))), this.debug && (h("div", { key: '70540ce4120a5e58477d27b9ada583d1bd08d173', class: "performance-monitor" }, h("div", { key: '9748bd765097226c6b83cfb11014addf50bc689a', class: "performance-expanded" }, h("div", { key: '232b42e1711cfc3fc5273570d342ca76dd9bd600', class: "metrics-row" }, h("div", { key: '582de2674be443604bc7ea1d0febac35f0b4d98c', class: "metric-compact" }, h("span", { key: 'd7814f7e32ca27bcd1262bf70d23e0f20de8f4fe', class: "metric-label" }, "FPS"), h("span", { key: '80d35b145b152d40a587b2f367dbb90d8410a51c', class: `metric-value ${this.performanceData.fps < 15 ? 'warning' : this.performanceData.fps < 10 ? 'danger' : 'good'}` }, this.performanceData.fps)), h("div", { key: 'e34ab4ac393d65626e07f363de76bb4db0a6eb89', class: "metric-compact" }, h("span", { key: '47d544db4edd3f4ac9d84bdcafb3f24ecffdb53e', class: "metric-label" }, "MEM"), h("span", { key: 'd0d8d0e6bc2a868fdb6d9cfa8c7227e5a67c59db', class: `metric-value ${this.performanceData.memoryUsage > 100 ? 'warning' : this.performanceData.memoryUsage > 200 ? 'danger' : 'good'}` }, this.performanceData.memoryUsage, "MB"))), h("div", { key: '5b4d97625bf3ce6ff4b3f58c86f0b54b9426c3e1', class: "metrics-row" }, h("div", { key: 'a7523a1e08c6134d0660f7bda36036ce58c68f06', class: "metric-compact" }, h("span", { key: '7554b3f17b50e40aa03418beaa840a1b4ca54473', class: "metric-label" }, "INF"), h("span", { key: 'a3f0e2895bb9b889b927003257861998526460bf', class: `metric-value ${this.performanceData.inferenceTime > 100 ? 'warning' : this.performanceData.inferenceTime > 200 ? 'danger' : 'good'}` }, this.performanceData.inferenceTime, "ms")), h("div", { key: '43f4cc28e109d349049bb270710df4a31c8be775', class: "metric-compact" }, h("span", { key: '788fd432fafb1885ca6b090bf2c5f109de2a62f5', class: "metric-label" }, "FRAME"), h("span", { key: 'de30f8ea0068724999ea4e2541525131f7feff0e', class: `metric-value ${this.performanceData.frameProcessingTime > 50 ? 'warning' : this.performanceData.frameProcessingTime > 100 ? 'danger' : 'good'}` }, this.performanceData.frameProcessingTime, "ms"))), h("div", { key: 'ca1f57a73a26f3af81bb237e16ed2799ab20bcc5', class: "metrics-row" }, h("div", { key: '4ebc8c75f9e9a713e484774ecb33f277a93aae6a', class: "metric-compact" }, h("span", { key: 'b5e3342b69dc7066ef13959c4002ad77cd9602be', class: "metric-label" }, "DET"), h("span", { key: '3cddca746d3a028cbac6a2c716710e9f4e3cc9c3', class: "metric-value good" }, this.performanceData.successfulDetections, "/", this.performanceData.totalDetections)), h("div", { key: '4896bcb120733c89a018b804c222209795585750', class: "metric-compact" }, h("span", { key: '512196bbf3ba72dbceebdd51c3a6cd6080d4ec57', class: "metric-label" }, "RATE"), h("span", { key: '78c2478d921ee99d8d990a573b2c90e2d593faf0', class: `metric-value ${this.performanceData.detectionRate < 30 ? 'danger' : this.performanceData.detectionRate < 60 ? 'warning' : 'good'}` }, this.performanceData.detectionRate, "%")))))), h("div", { key: 'f2ebe3ed19749fe1db059b1cdca27283373c89da', class: "watermark" }, h("img", { key: 'e18b9458221d2f912e6d5280801476c0e35deb9c', src: "https://storage.googleapis.com/jaak-static/commons/powered-by-jaak.png", alt: "Powered by Jaak" })))));
|
|
1758
1770
|
}
|
|
1759
1771
|
// Utility methods
|
|
1760
1772
|
updateDetectionBoxes(boxes) {
|
|
@@ -1823,6 +1835,15 @@ const JaakStamps = class {
|
|
|
1823
1835
|
bottomSide?.classList.toggle('aligned', currentAlignment.bottom);
|
|
1824
1836
|
leftSide?.classList.toggle('aligned', currentAlignment.left);
|
|
1825
1837
|
const allSidesAligned = this.detectionService.areAllSidesAligned(currentAlignment);
|
|
1838
|
+
// Restart back document timer if any border is aligned during back capture
|
|
1839
|
+
const captureState = this.stateManager.getCaptureState();
|
|
1840
|
+
if (captureState.step === 'back' && this.enableBackDocumentTimer && bestBox) {
|
|
1841
|
+
const anyBorderAligned = currentAlignment.top || currentAlignment.right ||
|
|
1842
|
+
currentAlignment.bottom || currentAlignment.left;
|
|
1843
|
+
if (anyBorderAligned) {
|
|
1844
|
+
this.startBackDocumentTimer();
|
|
1845
|
+
}
|
|
1846
|
+
}
|
|
1826
1847
|
if (allSidesAligned && bestBox) {
|
|
1827
1848
|
cardOutline?.classList.add('perfect-match');
|
|
1828
1849
|
corners?.forEach(corner => corner.classList.add('perfect-match'));
|
|
@@ -1937,6 +1958,7 @@ const JaakStamps = class {
|
|
|
1937
1958
|
showFlipAnimation: false,
|
|
1938
1959
|
isDetectionPaused: false
|
|
1939
1960
|
});
|
|
1961
|
+
this.startBackDocumentTimer();
|
|
1940
1962
|
}, 3000);
|
|
1941
1963
|
}
|
|
1942
1964
|
else if (captureState.step === 'back') {
|
|
@@ -1987,9 +2009,32 @@ const JaakStamps = class {
|
|
|
1987
2009
|
cancelAnimationFrame(this.animationId);
|
|
1988
2010
|
this.animationId = undefined;
|
|
1989
2011
|
}
|
|
2012
|
+
this.clearBackDocumentTimer();
|
|
1990
2013
|
this.detectionBoxes = [];
|
|
1991
2014
|
this.logger.state('DETECTOR_DETENIDO', { timestamp: Date.now() });
|
|
1992
2015
|
}
|
|
2016
|
+
startBackDocumentTimer() {
|
|
2017
|
+
if (!this.enableBackDocumentTimer)
|
|
2018
|
+
return;
|
|
2019
|
+
if (this.backDocumentTimer) {
|
|
2020
|
+
clearInterval(this.backDocumentTimer);
|
|
2021
|
+
}
|
|
2022
|
+
this.backDocumentTimerRemaining = this.backDocumentTimerDuration;
|
|
2023
|
+
this.backDocumentTimer = window.setInterval(() => {
|
|
2024
|
+
this.backDocumentTimerRemaining--;
|
|
2025
|
+
if (this.backDocumentTimerRemaining <= 0) {
|
|
2026
|
+
this.clearBackDocumentTimer();
|
|
2027
|
+
this.skipBackCapture();
|
|
2028
|
+
}
|
|
2029
|
+
}, 1000);
|
|
2030
|
+
}
|
|
2031
|
+
clearBackDocumentTimer() {
|
|
2032
|
+
if (this.backDocumentTimer) {
|
|
2033
|
+
clearInterval(this.backDocumentTimer);
|
|
2034
|
+
this.backDocumentTimer = undefined;
|
|
2035
|
+
}
|
|
2036
|
+
this.backDocumentTimerRemaining = 0;
|
|
2037
|
+
}
|
|
1993
2038
|
toggleCameraSelector() {
|
|
1994
2039
|
if (this.isSwitchingCamera)
|
|
1995
2040
|
return; // Don't toggle if switching camera
|