idmission-web-sdk 2.3.98 → 2.3.99

package/dist/sdk2.esm.js

@@ -16,6 +16,7 @@ import { devtools } from 'zustand/middleware';
 import { useShallow } from 'zustand/react/shallow';
 import cn from 'clsx';
 import SignatureCanvas from 'react-signature-canvas';
+import { mediaInfoFactory } from 'mediainfo.js';
 import { renderToString } from 'react-dom/server';
 
 /******************************************************************************
@@ -205,7 +206,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
   return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var webSdkVersion = '2.3.98';
+var webSdkVersion = '2.3.99';
 
 function getPlatform() {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -14295,14 +14296,23 @@ function inferBlobType(blobPart) {
   return t.length > 0 ? t : undefined;
 }
 
-// import { mediaInfoFactory } from 'mediainfo.js'
-// import type { ReadChunkFunc, MediaInfo, MediaInfoResult } from 'mediainfo.js'
-// import { DEFAULT_CDN_URL } from '../common/cdn'
-// import { warn } from '../../lib/utils/logger'
-// function makeReadChunk(file: File | Blob): ReadChunkFunc {
-//   return async (chunkSize: number, offset: number) =>
-//     new Uint8Array(await file.slice(offset, offset + chunkSize).arrayBuffer())
-// }
+function makeReadChunk(file) {
+  var _this = this;
+  return function (chunkSize, offset) {
+    return __awaiter(_this, void 0, void 0, function () {
+      var _a;
+      return __generator(this, function (_b) {
+        switch (_b.label) {
+          case 0:
+            _a = Uint8Array.bind;
+            return [4 /*yield*/, file.slice(offset, offset + chunkSize).arrayBuffer()];
+          case 1:
+            return [2 /*return*/, new (_a.apply(Uint8Array, [void 0, _b.sent()]))()];
+        }
+      });
+    });
+  };
+}
 var signatureRecorder = null;
 var signatureChunks = [];
 var videoSignatureInitialState = {
@@ -14337,9 +14347,8 @@ var useVideoSignatureStore = create()(devtools(function (set, get) {
       if (!camera) throw new Error('Camera not found');
       // set our flag and clear whatever we have recorded so far.
       signatureChunks = [];
-      var outputCanvas = get().outputCanvas;
       // start recording from the output canvas to capture the signature
-      var outputStream = (_a = outputCanvas.current) === null || _a === void 0 ? void 0 : _a.captureStream(24);
+      var outputStream = (_a = get().outputCanvas.current) === null || _a === void 0 ? void 0 : _a.captureStream(24);
       if (!outputStream) throw new Error('outputStream not found');
       var tracks = [outputStream.getVideoTracks()[0]];
       if (captureAudio) {
@@ -14384,39 +14393,42 @@ var useVideoSignatureStore = create()(devtools(function (set, get) {
         signatureRecorder.stop();
         signatureRecorder.onstop = function () {
           return __awaiter(void 0, void 0, void 0, function () {
-            var recordingStoppedAt, inferredType, blob, _a, onSignatureVideoCaptured, recordingStartRequestedAt, recordingStartedAt, firstChunkReceivedAt, signatureStartedAt, signatureEndedAt, recordingStopRequestedAt, lastChunkReceivedAt;
-            return __generator(this, function (_b) {
-              recordingStoppedAt = performance.now();
-              set({
-                recordingStoppedAt: recordingStoppedAt
-              });
-              inferredType = inferBlobType(signatureChunks[0]) || (signatureRecorder === null || signatureRecorder === void 0 ? void 0 : signatureRecorder.mimeType) || 'video/mp4';
-              blob = new Blob(signatureChunks, {
-                type: inferredType
-              });
-              signatureChunks = [];
-              signatureRecorder = null;
-              if (!signatureData) return [2 /*return*/];
-              _a = get(), onSignatureVideoCaptured = _a.onSignatureVideoCaptured, recordingStartRequestedAt = _a.recordingStartRequestedAt, recordingStartedAt = _a.recordingStartedAt, firstChunkReceivedAt = _a.firstChunkReceivedAt, signatureStartedAt = _a.signatureStartedAt, signatureEndedAt = _a.signatureEndedAt, recordingStopRequestedAt = _a.recordingStopRequestedAt, lastChunkReceivedAt = _a.lastChunkReceivedAt;
-              // const mediaInfo = await get().mediaInfo?.analyzeData(
-              //   blob.size,
-              //   makeReadChunk(blob),
-              // )
-              onSignatureVideoCaptured(blob, signatureData, imageUrl !== null && imageUrl !== void 0 ? imageUrl : null, {
-                // mediaInfo,
-                mimeType: inferredType,
-                timingData: {
-                  recordingStartRequestedAt: recordingStartRequestedAt,
-                  recordingStartedAt: recordingStartedAt,
-                  firstChunkReceivedAt: firstChunkReceivedAt,
-                  signatureStartedAt: signatureStartedAt,
-                  signatureEndedAt: signatureEndedAt,
-                  recordingStopRequestedAt: recordingStopRequestedAt,
-                  recordingStoppedAt: recordingStoppedAt,
-                  lastChunkReceivedAt: lastChunkReceivedAt
-                }
-              });
-              return [2 /*return*/];
+            var recordingStoppedAt, inferredType, blob, _a, onSignatureVideoCaptured, recordingStartRequestedAt, recordingStartedAt, firstChunkReceivedAt, signatureStartedAt, signatureEndedAt, recordingStopRequestedAt, lastChunkReceivedAt, mediaInfo;
+            var _b;
+            return __generator(this, function (_c) {
+              switch (_c.label) {
+                case 0:
+                  recordingStoppedAt = performance.now();
+                  set({
+                    recordingStoppedAt: recordingStoppedAt
+                  });
+                  inferredType = inferBlobType(signatureChunks[0]) || (signatureRecorder === null || signatureRecorder === void 0 ? void 0 : signatureRecorder.mimeType) || 'video/mp4';
+                  blob = new Blob(signatureChunks, {
+                    type: inferredType
+                  });
+                  signatureChunks = [];
+                  signatureRecorder = null;
+                  if (!signatureData) return [2 /*return*/];
+                  _a = get(), onSignatureVideoCaptured = _a.onSignatureVideoCaptured, recordingStartRequestedAt = _a.recordingStartRequestedAt, recordingStartedAt = _a.recordingStartedAt, firstChunkReceivedAt = _a.firstChunkReceivedAt, signatureStartedAt = _a.signatureStartedAt, signatureEndedAt = _a.signatureEndedAt, recordingStopRequestedAt = _a.recordingStopRequestedAt, lastChunkReceivedAt = _a.lastChunkReceivedAt;
+                  return [4 /*yield*/, (_b = get().mediaInfo) === null || _b === void 0 ? void 0 : _b.analyzeData(blob.size, makeReadChunk(blob))];
+                case 1:
+                  mediaInfo = _c.sent();
+                  onSignatureVideoCaptured(blob, signatureData, imageUrl !== null && imageUrl !== void 0 ? imageUrl : null, {
+                    mediaInfo: mediaInfo,
+                    mimeType: inferredType,
+                    timingData: {
+                      recordingStartRequestedAt: recordingStartRequestedAt,
+                      recordingStartedAt: recordingStartedAt,
+                      firstChunkReceivedAt: firstChunkReceivedAt,
+                      signatureStartedAt: signatureStartedAt,
+                      signatureEndedAt: signatureEndedAt,
+                      recordingStopRequestedAt: recordingStopRequestedAt,
+                      recordingStoppedAt: recordingStoppedAt,
+                      lastChunkReceivedAt: lastChunkReceivedAt
+                    }
+                  });
+                  return [2 /*return*/];
+              }
             });
           });
         };
@@ -14466,7 +14478,9 @@ function waitForOneMoreChunk(timeoutMs) {
 function VideoSignatureContextProvider(_a) {
   var _this = this;
   var _b, _c, _d, _e;
-  var children = _a.children;
+  var children = _a.children,
+    _f = _a.captureMediaInfo,
+    captureMediaInfo = _f === void 0 ? false : _f;
   var videoRef = useCameraStore().videoRef;
   var outputCanvas = useRef(null);
   useEffect(function () {
@@ -14476,27 +14490,31 @@ function VideoSignatureContextProvider(_a) {
   }, []);
   var signatureVideoRef = useRef(null);
   var frameCheckCanvas = useRef(null);
-  // useEffect(() => {
-  //   if (!captureMediaInfo) return
-  //   mediaInfoFactory({
-  //     format: 'object',
-  //     full: true,
-  //     locateFile: (filename) => `${DEFAULT_CDN_URL}/${filename}`,
-  //   })
-  //     .then((mediaInfo) => {
-  //       useVideoSignatureStore.setState({ mediaInfo })
-  //     })
-  //     .catch((e) => {
-  //       warn('error loading mediaInfo', e)
-  //     })
-  //   return () => {
-  //     const mediaInfo = useVideoSignatureStore.getState().mediaInfo
-  //     if (mediaInfo) {
-  //       mediaInfo.close()
-  //       useVideoSignatureStore.setState({ mediaInfo: undefined })
-  //     }
-  //   }
-  // }, [captureMediaInfo])
+  useEffect(function () {
+    if (!captureMediaInfo) return;
+    mediaInfoFactory({
+      format: 'object',
+      full: true,
+      locateFile: function locateFile(filename) {
+        return "".concat(DEFAULT_CDN_URL, "/").concat(filename);
+      }
+    }).then(function (mediaInfo) {
+      useVideoSignatureStore.setState({
+        mediaInfo: mediaInfo
+      });
+    })["catch"](function (e) {
+      warn('error loading mediaInfo', e);
+    });
+    return function () {
+      var mediaInfo = useVideoSignatureStore.getState().mediaInfo;
+      if (mediaInfo) {
+        mediaInfo.close();
+        useVideoSignatureStore.setState({
+          mediaInfo: undefined
+        });
+      }
+    };
+  }, [captureMediaInfo]);
   var signaturePadEmpty = useVideoSignatureStore().signaturePadEmpty;
   var blankCheckPassed = useRef(false);
   useEffect(function () {
@@ -14537,40 +14555,15 @@ function VideoSignatureContextProvider(_a) {
       });
     });
   }, [videoRef, outputCanvas]);
-  useEffect(function () {
-    if (!signatureVideoRef.current) return;
-    var video = signatureVideoRef.current;
-    function onFrame() {
-      blankCheckPassed.current || (blankCheckPassed.current = !isVideoBlank(signatureVideoRef.current, frameCheckCanvas.current));
-      drawOutputFrame();
-      video.requestVideoFrameCallback(onFrame);
-    }
-    function onPlay() {
-      video.requestVideoFrameCallback(onFrame);
-    }
-    video.addEventListener('play', onPlay);
-    return function () {
-      video.removeEventListener('play', onPlay);
-    };
-  }, [drawOutputFrame]);
-  useEffect(function () {
-    if (!videoRef.current) return;
-    var video = videoRef.current;
-    function onFrame() {
-      drawOutputFrame();
-      video.requestVideoFrameCallback(onFrame);
-    }
-    function onPlay() {
-      video.requestVideoFrameCallback(onFrame);
-    }
-    video.addEventListener('play', onPlay);
-    return function () {
-      video.removeEventListener('play', onPlay);
-    };
-  }, [drawOutputFrame, videoRef]);
-  var _f = useVideoSignatureStore(),
-    signaturePad = _f.signaturePad,
-    recordingStartedAt = _f.recordingStartedAt;
+  var checkBlankAndDrawOutputFrame = useCallback(function () {
+    blankCheckPassed.current || (blankCheckPassed.current = !isVideoBlank(signatureVideoRef.current, frameCheckCanvas.current));
+    drawOutputFrame();
+  }, [drawOutputFrame, signatureVideoRef]);
+  useVideoFrameLoop(signatureVideoRef, checkBlankAndDrawOutputFrame);
+  useVideoFrameLoop(videoRef, drawOutputFrame);
+  var _g = useVideoSignatureStore(),
+    signaturePad = _g.signaturePad,
+    recordingStartedAt = _g.recordingStartedAt;
   useEffect(function () {
     var _a;
     if (!signaturePad.current || !recordingStartedAt) return;
@@ -14610,6 +14603,32 @@ function isCanvasBlank(canvas) {
   });
   return result;
 }
+function requestVideoFrameCallback(video, onFrame) {
+  if (typeof (video === null || video === void 0 ? void 0 : video.requestVideoFrameCallback) === 'function') {
+    video.requestVideoFrameCallback(onFrame);
+  } else {
+    requestAnimationFrame(onFrame);
+  }
+}
+function videoFrameLoop(video, onFrame) {
+  if (!video) return;
+  function onFrameRecursive() {
+    onFrame();
+    requestVideoFrameCallback(video, onFrameRecursive);
+  }
+  function onPlay() {
+    requestVideoFrameCallback(video, onFrameRecursive);
+  }
+  video.addEventListener('play', onPlay);
+  return function () {
+    video.removeEventListener('play', onPlay);
+  };
+}
+function useVideoFrameLoop(ref, onFrame) {
+  useEffect(function () {
+    return videoFrameLoop(ref.current, onFrame);
+  }, [onFrame, ref]);
+}
 
 function VideoSignaturePad(_a) {
   var onAcceptBtnClicked = _a.onAcceptBtnClicked,