remotion - npm Package Compare versions

Comparing version 4.0.278 to 4.0.279

dist/cjs/audio/AudioForPreview.js

@@ -8,4 +8,6 @@ "use strict";
 const SequenceManager_js_1 = require("../SequenceManager.js");
+const log_level_context_js_1 = require("../log-level-context.js");
 const prefetch_js_1 = require("../prefetch.js");
 const random_js_1 = require("../random.js");
+const use_amplification_js_1 = require("../use-amplification.js");
 const use_media_in_timeline_js_1 = require("../use-media-in-timeline.js");
@@ -24,2 +26,3 @@ const use_media_playback_js_1 = require("../use-media-playback.js");
     }
+    const logLevel = (0, log_level_context_js_1.useLogLevel)();
     const { volume, muted, playbackRate, shouldPreMountAudioTags, src, onDuration, acceptableTimeShiftInSeconds, _remotionInternalNeedsDurationCalculation, _remotionInternalNativeLoopPassed, _remotionInternalStack, allowAmplificationDuringRender, name, pauseWhenBuffering, showInTimeline, loopVolumeCurveBehavior, stack, ...nativeProps } = props;
@@ -41,3 +44,2 @@ const [mediaVolume] = (0, volume_position_state_js_1.useMediaVolumeState)();
         mediaVolume,
-        allowAmplificationDuringRender: false,
     });
@@ -92,2 +94,7 @@ const propsToPass = (0, react_1.useMemo)(() => {
     });
+    (0, use_amplification_js_1.useAmplification)({
+        logLevel,
+        mediaRef: audioRef,
+        volume: userPreferredVolume,
+    });
     (0, use_media_playback_js_1.useMediaPlayback)({
@@ -99,6 +106,7 @@ mediaRef: audioRef,
         onlyWarnForMediaSeekingError: false,
-        acceptableTimeshift: acceptableTimeShiftInSeconds !== null && acceptableTimeShiftInSeconds !== void 0 ? acceptableTimeShiftInSeconds : use_media_playback_js_1.DEFAULT_ACCEPTABLE_TIMESHIFT,
+        acceptableTimeshift: acceptableTimeShiftInSeconds !== null && acceptableTimeShiftInSeconds !== void 0 ? acceptableTimeShiftInSeconds : null,
         isPremounting: Boolean(sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.premounting),
         pauseWhenBuffering,
         onAutoPlayError: null,
+        userPreferredVolume,
     });
@@ -105,0 +113,0 @@ (0, react_1.useImperativeHandle)(ref, () => {

dist/cjs/audio/AudioForRendering.js

@@ -38,3 +38,2 @@ "use strict";
         mediaVolume: 1,
-        allowAmplificationDuringRender: allowAmplificationDuringRender !== null && allowAmplificationDuringRender !== void 0 ? allowAmplificationDuringRender : false,
     });
@@ -66,3 +65,2 @@ (0, react_1.useImperativeHandle)(ref, () => {
             playbackRate: (_a = props.playbackRate) !== null && _a !== void 0 ? _a : 1,
-            allowAmplificationDuringRender: allowAmplificationDuringRender !== null && allowAmplificationDuringRender !== void 0 ? allowAmplificationDuringRender : false,
             toneFrequency: toneFrequency !== null && toneFrequency !== void 0 ? toneFrequency : null,
@@ -84,3 +82,2 @@ audioStartFrame: Math.max(0, -((_b = sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom) !== null && _b !== void 0 ? _b : 0)),
         props.playbackRate,
-        allowAmplificationDuringRender,
         toneFrequency,
@@ -87,0 +84,0 @@ sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom,

dist/cjs/audio/props.d.ts

@@ -12,2 +12,5 @@ import type { VolumeProp } from '../volume-prop.js';
     acceptableTimeShiftInSeconds?: number;
+    /**
+     * @deprecated Amplification is now always enabled. To prevent amplification, set `volume` to a value less than 1.
+     */
     allowAmplificationDuringRender?: boolean;
@@ -14,0 +17,0 @@ _remotionInternalNeedsDurationCalculation?: boolean;

dist/cjs/CompositionManager.d.ts

@@ -67,3 +67,2 @@ import type { ComponentType, LazyExoticComponent } from 'react';
     playbackRate: number;
-    allowAmplificationDuringRender: boolean;
     toneFrequency: number | null;
@@ -70,0 +69,0 @@ audioStartFrame: number;

dist/cjs/use-media-in-timeline.js

@@ -54,3 +54,2 @@ "use strict";
                 mediaVolume,
-                allowAmplificationDuringRender: false,
             });
@@ -57,0 +56,0 @@ })

dist/cjs/use-media-playback.d.ts

 import type { RefObject } from 'react';
-export declare const DEFAULT_ACCEPTABLE_TIMESHIFT = 0.45;
-export declare const useMediaPlayback: ({ mediaRef, src, mediaType, playbackRate: localPlaybackRate, onlyWarnForMediaSeekingError, acceptableTimeshift, pauseWhenBuffering, isPremounting, onAutoPlayError, }: {
+export declare const useMediaPlayback: ({ mediaRef, src, mediaType, playbackRate: localPlaybackRate, onlyWarnForMediaSeekingError, acceptableTimeshift, pauseWhenBuffering, isPremounting, onAutoPlayError, userPreferredVolume, }: {
     mediaRef: RefObject<HTMLVideoElement | HTMLAudioElement | null>;
@@ -9,6 +8,7 @@ src: string | undefined;
     onlyWarnForMediaSeekingError: boolean;
-    acceptableTimeshift: number;
+    acceptableTimeshift: number | null;
     pauseWhenBuffering: boolean;
     isPremounting: boolean;
     onAutoPlayError: null | (() => void);
+    userPreferredVolume: number;
 }) => void;

dist/cjs/use-media-playback.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMediaPlayback = exports.DEFAULT_ACCEPTABLE_TIMESHIFT = void 0;
+exports.useMediaPlayback = void 0;
 const react_1 = require("react");
@@ -14,2 +14,3 @@ const use_audio_frame_js_1 = require("./audio/use-audio-frame.js");
 const timeline_position_state_js_1 = require("./timeline-position-state.js");
+const use_amplification_js_1 = require("./use-amplification.js");
 const use_current_frame_js_1 = require("./use-current-frame.js");
@@ -21,4 +22,3 @@ const use_media_buffering_js_1 = require("./use-media-buffering.js");
 const warn_about_non_seekable_media_js_1 = require("./warn-about-non-seekable-media.js");
-exports.DEFAULT_ACCEPTABLE_TIMESHIFT = 0.45;
-const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybackRate, onlyWarnForMediaSeekingError, acceptableTimeshift, pauseWhenBuffering, isPremounting, onAutoPlayError, }) => {
+const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybackRate, onlyWarnForMediaSeekingError, acceptableTimeshift, pauseWhenBuffering, isPremounting, onAutoPlayError, userPreferredVolume, }) => {
     const { playbackRate: globalPlaybackRate } = (0, react_1.useContext)(timeline_position_state_js_1.TimelineContext);
@@ -74,9 +74,16 @@ const frame = (0, use_current_frame_js_1.useCurrentFrame)();
     const playbackRate = localPlaybackRate * globalPlaybackRate;
-    // For short audio, a lower acceptable time shift is used
     const acceptableTimeShiftButLessThanDuration = (() => {
         var _a;
+        // In Safari, it seems to lag behind mostly around ~0.4 seconds
+        const DEFAULT_ACCEPTABLE_TIMESHIFT_WITH_NORMAL_PLAYBACK = 0.45;
+        // If there is amplification, the acceptable timeshift is higher
+        const DEFAULT_ACCEPTABLE_TIMESHIFT_WITH_AMPLIFICATION = DEFAULT_ACCEPTABLE_TIMESHIFT_WITH_NORMAL_PLAYBACK + 0.2;
+        const defaultAcceptableTimeshift = (0, use_amplification_js_1.getShouldAmplify)(userPreferredVolume)
+            ? DEFAULT_ACCEPTABLE_TIMESHIFT_WITH_AMPLIFICATION
+            : DEFAULT_ACCEPTABLE_TIMESHIFT_WITH_NORMAL_PLAYBACK;
+        // For short audio, a lower acceptable time shift is used
         if ((_a = mediaRef.current) === null || _a === void 0 ? void 0 : _a.duration) {
-            return Math.min(mediaRef.current.duration, acceptableTimeshift !== null && acceptableTimeshift !== void 0 ? acceptableTimeshift : exports.DEFAULT_ACCEPTABLE_TIMESHIFT);
+            return Math.min(mediaRef.current.duration, acceptableTimeshift !== null && acceptableTimeshift !== void 0 ? acceptableTimeshift : defaultAcceptableTimeshift);
         }
-        return acceptableTimeshift;
+        return acceptableTimeshift !== null && acceptableTimeshift !== void 0 ? acceptableTimeshift : defaultAcceptableTimeshift;
     })();
@@ -177,3 +184,3 @@ const isPlayerBuffering = (0, buffering_js_1.useIsPlayerBuffering)(buffering);
         }
-        const seekThreshold = playing ? 0.15 : 0.00001;
+        const seekThreshold = playing ? 0.15 : 0.01;
         // Only perform a seek if the time is not already the same.
@@ -180,0 +187,0 @@ // Chrome rounds to 6 digits, so 0.033333333 -> 0.033333,

dist/cjs/use-sync-volume-with-media-tag.js

@@ -16,6 +16,5 @@ "use strict";
             mediaVolume,
-            allowAmplificationDuringRender: false,
         });
         if (!(0, is_approximately_the_same_js_1.isApproximatelyTheSame)(userPreferredVolume, mediaRef.current.volume)) {
-            mediaRef.current.volume = userPreferredVolume;
+            mediaRef.current.volume = Math.min(userPreferredVolume, 1);
         }
@@ -22,0 +21,0 @@ }, [mediaRef, mediaVolume, volume, volumePropFrame]);

dist/cjs/version.d.ts

@@ -6,2 +6,2 @@ /**
  */
-export declare const VERSION = "4.0.278";
+export declare const VERSION = "4.0.279";

dist/cjs/version.js

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

dist/cjs/video/OffthreadVideoForRendering.js

@@ -51,3 +51,2 @@ "use strict";
         mediaVolume: 1,
-        allowAmplificationDuringRender: allowAmplificationDuringRender !== null && allowAmplificationDuringRender !== void 0 ? allowAmplificationDuringRender : false,
     });
@@ -76,3 +75,2 @@ (0, react_1.useEffect)(() => {
             playbackRate: playbackRate !== null && playbackRate !== void 0 ? playbackRate : 1,
-            allowAmplificationDuringRender: allowAmplificationDuringRender !== null && allowAmplificationDuringRender !== void 0 ? allowAmplificationDuringRender : false,
             toneFrequency: toneFrequency !== null && toneFrequency !== void 0 ? toneFrequency : null,
@@ -92,3 +90,2 @@ audioStartFrame: Math.max(0, -((_a = sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom) !== null && _a !== void 0 ? _a : 0)),
         playbackRate,
-        allowAmplificationDuringRender,
         toneFrequency,
@@ -95,0 +92,0 @@ sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom,

dist/cjs/video/VideoForPreview.js

@@ -12,2 +12,3 @@ "use strict";
 const prefetch_js_1 = require("../prefetch.js");
+const use_amplification_js_1 = require("../use-amplification.js");
 const use_media_in_timeline_js_1 = require("../use-media-in-timeline.js");
@@ -18,2 +19,3 @@ const use_media_playback_js_1 = require("../use-media-playback.js");
 const volume_position_state_js_1 = require("../volume-position-state.js");
+const volume_prop_js_1 = require("../volume-prop.js");
 const emit_video_frame_js_1 = require("./emit-video-frame.js");
@@ -40,2 +42,7 @@ const video_fragment_js_1 = require("./video-fragment.js");
     const [mediaMuted] = (0, volume_position_state_js_1.useMediaMutedState)();
+    const userPreferredVolume = (0, volume_prop_js_1.evaluateVolume)({
+        frame: volumePropFrame,
+        volume,
+        mediaVolume,
+    });
     (0, use_media_in_timeline_js_1.useMediaInTimeline)({
@@ -62,2 +69,7 @@ mediaRef: videoRef,
     });
+    (0, use_amplification_js_1.useAmplification)({
+        logLevel,
+        mediaRef: videoRef,
+        volume: userPreferredVolume,
+    });
     (0, use_media_playback_js_1.useMediaPlayback)({
@@ -69,6 +81,7 @@ mediaRef: videoRef,
         onlyWarnForMediaSeekingError,
-        acceptableTimeshift: acceptableTimeShiftInSeconds !== null && acceptableTimeShiftInSeconds !== void 0 ? acceptableTimeShiftInSeconds : use_media_playback_js_1.DEFAULT_ACCEPTABLE_TIMESHIFT,
+        acceptableTimeshift: acceptableTimeShiftInSeconds !== null && acceptableTimeShiftInSeconds !== void 0 ? acceptableTimeShiftInSeconds : null,
         isPremounting: Boolean(parentSequence === null || parentSequence === void 0 ? void 0 : parentSequence.premounting),
         pauseWhenBuffering,
         onAutoPlayError: onAutoPlayError !== null && onAutoPlayError !== void 0 ? onAutoPlayError : null,
+        userPreferredVolume,
     });
@@ -174,4 +187,4 @@ const actualFrom = parentSequence ? parentSequence.relativeFrom : 0;
     const crossOriginValue = crossOrigin !== null && crossOrigin !== void 0 ? crossOrigin : (onVideoFrame ? 'anonymous' : undefined);
-    return ((0, jsx_runtime_1.jsx)("video", { ref: videoRef, muted: muted || mediaMuted, playsInline: true, src: actualSrc, loop: _remotionInternalNativeLoopPassed, style: actualStyle, disableRemotePlayback: true, crossOrigin: crossOriginValue, ...nativeProps }));
+    return ((0, jsx_runtime_1.jsx)("video", { ref: videoRef, muted: muted || mediaMuted || isSequenceHidden || userPreferredVolume <= 0, playsInline: true, src: actualSrc, loop: _remotionInternalNativeLoopPassed, style: actualStyle, disableRemotePlayback: true, crossOrigin: crossOriginValue, ...nativeProps }));
 };
 exports.VideoForPreview = (0, react_1.forwardRef)(VideoForDevelopmentRefForwardingFunction);

dist/cjs/video/VideoForRendering.js

@@ -51,3 +51,2 @@ "use strict";
         mediaVolume: 1,
-        allowAmplificationDuringRender: allowAmplificationDuringRender !== null && allowAmplificationDuringRender !== void 0 ? allowAmplificationDuringRender : false,
     });
@@ -76,3 +75,2 @@ (0, react_1.useEffect)(() => {
             playbackRate: playbackRate !== null && playbackRate !== void 0 ? playbackRate : 1,
-            allowAmplificationDuringRender: allowAmplificationDuringRender !== null && allowAmplificationDuringRender !== void 0 ? allowAmplificationDuringRender : false,
             toneFrequency: toneFrequency !== null && toneFrequency !== void 0 ? toneFrequency : null,
@@ -92,3 +90,2 @@ audioStartFrame: Math.max(0, -((_a = sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom) !== null && _a !== void 0 ? _a : 0)),
         playbackRate,
-        allowAmplificationDuringRender,
         toneFrequency,
@@ -95,0 +92,0 @@ sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom,

dist/cjs/volume-prop.d.ts

 export type VolumeProp = number | ((frame: number) => number);
-export declare const evaluateVolume: ({ frame, volume, mediaVolume, allowAmplificationDuringRender, }: {
+export declare const evaluateVolume: ({ frame, volume, mediaVolume, }: {
     frame: number;
     volume: VolumeProp | undefined;
     mediaVolume: number;
-    allowAmplificationDuringRender: boolean;
 }) => number;

dist/cjs/volume-prop.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.evaluateVolume = void 0;
-const evaluateVolume = ({ frame, volume, mediaVolume = 1, allowAmplificationDuringRender, }) => {
-    const maxVolume = allowAmplificationDuringRender ? Infinity : 1;
+const evaluateVolume = ({ frame, volume, mediaVolume = 1, }) => {
     if (typeof volume === 'number') {
-        return Math.min(maxVolume, volume * mediaVolume);
+        return volume * mediaVolume;
     }
@@ -22,4 +21,4 @@ if (typeof volume === 'undefined') {
     }
-    return Math.max(0, Math.min(maxVolume, evaluated));
+    return Math.max(0, evaluated);
 };
 exports.evaluateVolume = evaluateVolume;

package.json

@@ -6,3 +6,3 @@ {
   "name": "remotion",
-  "version": "4.0.278",
+  "version": "4.0.279",
   "description": "Make videos programmatically",
@@ -32,3 +32,3 @@ "main": "dist/cjs/index.js",
     "eslint": "9.19.0",
-    "@remotion/eslint-config-internal": "4.0.278"
+    "@remotion/eslint-config-internal": "4.0.279"
   },
@@ -35,0 +35,0 @@ "keywords": [

No alert changes

Improved metrics

Total package byte prevSize

711273

0.61%

Lines of code

18349

0.87%

No dependency changes