remotion - npm Package Compare versions

Comparing version 4.0.187 to 4.0.188

dist/cjs/buffer-until-first-frame.d.ts

@@ -1,5 +0,6 @@
-export declare const useBufferUntilFirstFrame: ({ mediaRef, mediaType, onVariableFpsVideoDetected, }: {
+export declare const useBufferUntilFirstFrame: ({ mediaRef, mediaType, onVariableFpsVideoDetected, pauseWhenBuffering, }: {
     mediaRef: React.RefObject<HTMLVideoElement | HTMLAudioElement>;
     mediaType: 'video' | 'audio';
     onVariableFpsVideoDetected: () => void;
+    pauseWhenBuffering: boolean;
 }) => {
@@ -6,0 +7,0 @@ isBuffering: () => boolean;

dist/cjs/buffer-until-first-frame.js

@@ -6,3 +6,3 @@ "use strict";
 const use_buffer_state_1 = require("./use-buffer-state");
-const useBufferUntilFirstFrame = ({ mediaRef, mediaType, onVariableFpsVideoDetected, }) => {
+const useBufferUntilFirstFrame = ({ mediaRef, mediaType, onVariableFpsVideoDetected, pauseWhenBuffering, }) => {
     const bufferingRef = (0, react_1.useRef)(false);
@@ -14,2 +14,5 @@ const { delayPlayback } = (0, use_buffer_state_1.useBufferState)();
         }
+        if (!pauseWhenBuffering) {
+            return;
+        }
         const current = mediaRef.current;
@@ -52,3 +55,9 @@ if (!current) {
         current.addEventListener('pause', onEndedOrPause, { once: true });
-    }, [delayPlayback, mediaRef, mediaType, onVariableFpsVideoDetected]);
+    }, [
+        delayPlayback,
+        mediaRef,
+        mediaType,
+        onVariableFpsVideoDetected,
+        pauseWhenBuffering,
+    ]);
     return (0, react_1.useMemo)(() => {
@@ -55,0 +64,0 @@ return {

dist/cjs/use-media-playback.js

@@ -35,6 +35,23 @@ "use strict";
     const lastSeekDueToShift = (0, react_1.useRef)(null);
+    const lastSeek = (0, react_1.useRef)(null);
     if (!buffering) {
         throw new Error('useMediaPlayback must be used inside a <BufferingContext>');
     }
-    const currentTime = (0, use_request_video_callback_time_js_1.useRequestVideoCallbackTime)(mediaRef, mediaType);
+    const isVariableFpsVideoMap = (0, react_1.useRef)({});
+    const onVariableFpsVideoDetected = (0, react_1.useCallback)(() => {
+        if (!src) {
+            return;
+        }
+        if (debugSeeking) {
+            // eslint-disable-next-line no-console
+            console.log(`Detected ${src} as a variable FPS video. Disabling buffering while seeking.`);
+        }
+        isVariableFpsVideoMap.current[src] = true;
+    }, [debugSeeking, src]);
+    const currentTime = (0, use_request_video_callback_time_js_1.useRequestVideoCallbackTime)({
+        mediaRef,
+        mediaType,
+        lastSeek,
+        onVariableFpsVideoDetected,
+    });
     const desiredUnclampedTime = (0, get_current_time_js_1.getMediaTime)({
@@ -51,13 +68,2 @@ frame,
     });
-    const isVariableFpsVideoMap = (0, react_1.useRef)({});
-    const onVariableFpsVideoDetected = (0, react_1.useCallback)(() => {
-        if (!src) {
-            return;
-        }
-        if (debugSeeking) {
-            // eslint-disable-next-line no-console
-            console.log(`Detected ${src} as a variable FPS video. Disabling buffering while seeking.`);
-        }
-        isVariableFpsVideoMap.current[src] = true;
-    }, [debugSeeking, src]);
     const { bufferUntilFirstFrame, isBuffering } = (0, buffer_until_first_frame_js_1.useBufferUntilFirstFrame)({
@@ -67,2 +73,3 @@ mediaRef,
         onVariableFpsVideoDetected,
+        pauseWhenBuffering,
     });
@@ -143,5 +150,7 @@ const playbackRate = localPlaybackRate * globalPlaybackRate;
                     timeShift,
+                    isVariableFpsVideo,
                 });
             }
             seek(mediaRef, shouldBeTime);
+            lastSeek.current = shouldBeTime;
             lastSeekDueToShift.current = shouldBeTime;
@@ -171,2 +180,3 @@ if (playing && !isVariableFpsVideo) {
                 seek(mediaRef, shouldBeTime);
+                lastSeek.current = shouldBeTime;
             }
@@ -180,2 +190,3 @@ return;
                 seek(mediaRef, shouldBeTime);
+                lastSeek.current = shouldBeTime;
             }
@@ -182,0 +193,0 @@ (0, play_and_handle_not_allowed_error_js_1.playAndHandleNotAllowedError)(mediaRef, mediaType, onAutoPlayError);

dist/cjs/use-request-video-callback-time.d.ts

 import type { RefObject } from 'react';
-export declare const useRequestVideoCallbackTime: (mediaRef: RefObject<HTMLVideoElement | HTMLAudioElement>, mediaType: 'video' | 'audio') => import("react").MutableRefObject<number | null>;
+export declare const useRequestVideoCallbackTime: ({ mediaRef, mediaType, lastSeek, onVariableFpsVideoDetected, }: {
+    mediaRef: RefObject<HTMLVideoElement | HTMLAudioElement>;
+    mediaType: 'video' | 'audio';
+    lastSeek: React.MutableRefObject<number | null>;
+    onVariableFpsVideoDetected: () => void;
+}) => import("react").MutableRefObject<number | null>;

dist/cjs/use-request-video-callback-time.js

@@ -5,3 +5,3 @@ "use strict";
 const react_1 = require("react");
-const useRequestVideoCallbackTime = (mediaRef, mediaType) => {
+const useRequestVideoCallbackTime = ({ mediaRef, mediaType, lastSeek, onVariableFpsVideoDetected, }) => {
     const currentTime = (0, react_1.useRef)(null);
@@ -31,2 +31,16 @@ (0, react_1.useEffect)(() => {
             const cb = videoTag.requestVideoFrameCallback((_, info) => {
+                if (currentTime.current !== null) {
+                    const difference = Math.abs(currentTime.current - info.mediaTime);
+                    const differenceToLastSeek = Math.abs(lastSeek.current === null
+                        ? Infinity
+                        : info.mediaTime - lastSeek.current);
+                    // If a video suddenly jumps to a position much further than previously
+                    // and there was no relevant seek
+                    // Case to be seen with 66a4a49b0862333a56c7d03c.mp4 and autoPlay and pauseWhenBuffering
+                    if (difference > 0.5 &&
+                        differenceToLastSeek > 0.5 &&
+                        info.mediaTime > currentTime.current) {
+                        onVariableFpsVideoDetected();
+                    }
+                }
                 currentTime.current = info.mediaTime;
@@ -44,5 +58,5 @@ request();
         };
-    }, [mediaRef, mediaType]);
+    }, [lastSeek, mediaRef, mediaType, onVariableFpsVideoDetected]);
     return currentTime;
 };
 exports.useRequestVideoCallbackTime = useRequestVideoCallbackTime;

dist/cjs/version.d.ts

@@ -6,2 +6,2 @@ /**
  */
-export declare const VERSION = "4.0.187";
+export declare const VERSION = "4.0.188";

dist/cjs/version.js

@@ -10,2 +10,2 @@ "use strict";
  */
-exports.VERSION = '4.0.187';
+exports.VERSION = '4.0.188';

dist/cjs/video/OffthreadVideoForRendering.js

@@ -139,2 +139,9 @@ "use strict";
             catch (err) {
+                // If component is unmounted, we should not throw
+                if (err.message.includes('aborted')) {
+                    return;
+                }
+                if (controller.signal.aborted) {
+                    return;
+                }
                 if (onError) {
@@ -141,0 +148,0 @@ onError(err);

package.json

@@ -6,3 +6,3 @@ {
   "name": "remotion",
-  "version": "4.0.187",
+  "version": "4.0.188",
   "description": "Make videos programmatically",
@@ -9,0 +9,0 @@ "main": "dist/cjs/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

653745

increased by0.58%

Number of package files

257

increased by1.58%

Lines of code

16625

increased by0.67%

No dependency changes