@remotion/media 4.0.354 → 4.0.355

package/dist/video-extraction/new-video-for-preview.js

@@ -1,114 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useContext, useEffect, useRef, useState } from 'react';
-import { Internals, useBufferState, useCurrentFrame } from 'remotion';
-import { Log } from '../log';
-import { MediaPlayer } from '../video/media-player';
-const { useUnsafeVideoConfig, Timeline, SharedAudioContext } = Internals;
-export const NewVideoForPreview = ({ src, style, playbackRate = 1, logLevel = 'info', }) => {
-    const canvasRef = useRef(null);
-    const videoConfig = useUnsafeVideoConfig();
-    const frame = useCurrentFrame();
-    const lastCurrentTimeRef = useRef(-1);
-    const mediaPlayerRef = useRef(null);
-    const [mediaPlayerReady, setMediaPlayerReady] = useState(false);
-    const [playing] = Timeline.usePlayingState();
-    const sharedAudioContext = useContext(SharedAudioContext);
-    const buffer = useBufferState();
-    const delayHandleRef = useRef(null);
-    if (!videoConfig) {
-        throw new Error('No video config found');
-    }
-    if (!src) {
-        throw new TypeError('No `src` was passed to <NewVideoForPreview>.');
-    }
-    const actualFps = videoConfig.fps / playbackRate;
-    const currentTime = frame / actualFps;
-    const [initialTimestamp] = useState(currentTime);
-    useEffect(() => {
-        if (!canvasRef.current)
-            return;
-        if (!sharedAudioContext)
-            return;
-        if (!sharedAudioContext.audioContext)
-            return;
-        try {
-            Log.trace(logLevel, `[NewVideoForPreview] Creating MediaPlayer for src: ${src}`);
-            const player = new MediaPlayer({
-                canvas: canvasRef.current,
-                src,
-                logLevel,
-                sharedAudioContext: sharedAudioContext.audioContext,
-            });
-            mediaPlayerRef.current = player;
-            player
-                .initialize(initialTimestamp)
-                .then(() => {
-                setMediaPlayerReady(true);
-                Log.trace(logLevel, `[NewVideoForPreview] MediaPlayer initialized successfully`);
-            })
-                .catch((error) => {
-                Log.error('[NewVideoForPreview] Failed to initialize MediaPlayer', error);
-            });
-        }
-        catch (error) {
-            Log.error('[NewVideoForPreview] MediaPlayer initialization failed', error);
-        }
-        return () => {
-            if (delayHandleRef.current) {
-                delayHandleRef.current.unblock();
-                delayHandleRef.current = null;
-            }
-            if (mediaPlayerRef.current) {
-                Log.trace(logLevel, `[NewVideoForPreview] Disposing MediaPlayer`);
-                mediaPlayerRef.current.dispose();
-                mediaPlayerRef.current = null;
-            }
-            setMediaPlayerReady(false);
-        };
-    }, [src, logLevel, sharedAudioContext, initialTimestamp]);
-    // sync play/pause state with Remotion timeline (like old VideoForPreview video does)
-    useEffect(() => {
-        const mediaPlayer = mediaPlayerRef.current;
-        if (!mediaPlayer)
-            return;
-        if (playing) {
-            Log.trace(logLevel, `[NewVideoForPreview] Remotion playing - calling MediaPlayer.play()`);
-            mediaPlayer.play().catch((error) => {
-                Log.error('[NewVideoForPreview] Failed to play', error);
-            });
-        }
-        else {
-            Log.trace(logLevel, `[NewVideoForPreview] Remotion paused - calling MediaPlayer.pause()`);
-            mediaPlayer.pause();
-        }
-    }, [playing, logLevel, mediaPlayerReady]);
-    // sync target time with MediaPlayer
-    useEffect(() => {
-        const mediaPlayer = mediaPlayerRef.current;
-        if (!mediaPlayer || !mediaPlayerReady)
-            return;
-        mediaPlayer.seekTo(currentTime);
-        Log.trace(logLevel, `[NewVideoForPreview] Updating target time to ${currentTime.toFixed(3)}s`);
-        lastCurrentTimeRef.current = currentTime;
-    }, [currentTime, logLevel, mediaPlayerReady]);
-    // sync MediaPlayer stalling with Remotion buffering
-    useEffect(() => {
-        const mediaPlayer = mediaPlayerRef.current;
-        if (!mediaPlayer || !mediaPlayerReady)
-            return;
-        mediaPlayer.onStalledChange((isStalled) => {
-            if (isStalled && !delayHandleRef.current) {
-                // Start blocking Remotion playback
-                delayHandleRef.current = buffer.delayPlayback();
-                Log.trace(logLevel, '[NewVideoForPreview] MediaPlayer stalled - blocking Remotion playback');
-            }
-            else if (!isStalled && delayHandleRef.current) {
-                // Unblock Remotion playback
-                delayHandleRef.current.unblock();
-                delayHandleRef.current = null;
-                Log.trace(logLevel, '[NewVideoForPreview] MediaPlayer unstalled - unblocking Remotion playback');
-            }
-        });
-    }, [mediaPlayerReady, buffer, logLevel]);
-    return (_jsx("canvas", { ref: canvasRef, width: videoConfig.width, height: videoConfig.height, style: style }));
-};

package/dist/video-for-rendering.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-import type { VideoProps } from './video/props';
-export declare const VideoForRendering: React.FC<VideoProps>;

package/dist/video-for-rendering.js

@@ -1,108 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useContext, useLayoutEffect, useMemo, useRef, useState, } from 'react';
-import { cancelRender, Internals, useCurrentFrame, useDelayRender, useRemotionEnvironment, } from 'remotion';
-import { extractFrameViaBroadcastChannel } from './extract-frame-via-broadcast-channel';
-export const VideoForRendering = ({ volume: volumeProp, playbackRate, src, muted, loopVolumeCurveBehavior, delayRenderRetries, delayRenderTimeoutInMilliseconds, 
-// call when a frame of the video, i.e. frame drawn on canvas
-onVideoFrame, logLevel = window.remotion_logLevel, }) => {
-    const absoluteFrame = Internals.useTimelinePosition();
-    const videoConfig = Internals.useUnsafeVideoConfig();
-    const canvasRef = useRef(null);
-    const { registerRenderAsset, unregisterRenderAsset } = useContext(Internals.RenderAssetManager);
-    const frame = useCurrentFrame();
-    const volumePropsFrame = Internals.useFrameForVolumeProp(loopVolumeCurveBehavior ?? 'repeat');
-    const environment = useRemotionEnvironment();
-    const [id] = useState(() => `${Math.random()}`.replace('0.', ''));
-    if (!videoConfig) {
-        throw new Error('No video config found');
-    }
-    if (!src) {
-        throw new TypeError('No `src` was passed to <Video>.');
-    }
-    const volume = Internals.evaluateVolume({
-        volume: volumeProp,
-        frame: volumePropsFrame,
-        mediaVolume: 1,
-    });
-    Internals.warnAboutTooHighVolume(volume);
-    const shouldRenderAudio = useMemo(() => {
-        if (!window.remotion_audioEnabled) {
-            return false;
-        }
-        if (muted) {
-            return false;
-        }
-        if (volume <= 0) {
-            return false;
-        }
-        return true;
-    }, [muted, volume]);
-    const { fps } = videoConfig;
-    const { delayRender, continueRender } = useDelayRender();
-    useLayoutEffect(() => {
-        if (!canvasRef.current) {
-            return;
-        }
-        const actualFps = playbackRate ? fps / playbackRate : fps;
-        const timestamp = frame / actualFps;
-        const durationInSeconds = 1 / actualFps;
-        const newHandle = delayRender(`Extracting frame number ${frame}`, {
-            retries: delayRenderRetries ?? undefined,
-            timeoutInMilliseconds: delayRenderTimeoutInMilliseconds ?? undefined,
-        });
-        extractFrameViaBroadcastChannel({
-            src,
-            timeInSeconds: timestamp,
-            durationInSeconds,
-            logLevel: logLevel ?? 'info',
-            shouldRenderAudio,
-            isClientSideRendering: environment.isClientSideRendering,
-        })
-            .then(({ frame: imageBitmap, audio }) => {
-            if (!imageBitmap) {
-                cancelRender(new Error('No video frame found'));
-            }
-            onVideoFrame?.(imageBitmap);
-            canvasRef.current?.getContext('2d')?.drawImage(imageBitmap, 0, 0);
-            imageBitmap.close();
-            if (audio) {
-                registerRenderAsset({
-                    type: 'inline-audio',
-                    id,
-                    audio: Array.from(audio.data),
-                    sampleRate: audio.sampleRate,
-                    numberOfChannels: audio.numberOfChannels,
-                    frame: absoluteFrame,
-                    timestamp: audio.timestamp,
-                    duration: (audio.numberOfFrames / audio.sampleRate) * 1000000,
-                });
-            }
-            continueRender(newHandle);
-        })
-            .catch((error) => {
-            cancelRender(error);
-        });
-        return () => {
-            continueRender(newHandle);
-            unregisterRenderAsset(id);
-        };
-    }, [
-        absoluteFrame,
-        continueRender,
-        delayRender,
-        delayRenderRetries,
-        delayRenderTimeoutInMilliseconds,
-        environment.isClientSideRendering,
-        fps,
-        frame,
-        id,
-        logLevel,
-        onVideoFrame,
-        playbackRate,
-        registerRenderAsset,
-        shouldRenderAudio,
-        src,
-        unregisterRenderAsset,
-    ]);
-    return (_jsx("canvas", { ref: canvasRef, width: videoConfig.width, height: videoConfig.height }));
-};

package/dist/video.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-import type { VideoProps } from './props';
-export declare const Video: React.FC<VideoProps>;

package/dist/video.js

@@ -1,37 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback } from 'react';
-import { Internals, Sequence, useRemotionEnvironment } from 'remotion';
-import { VideoForRendering } from './video-for-rendering';
-const { validateMediaTrimProps, resolveTrimProps, validateMediaProps, VideoForPreview, } = Internals;
-export const Video = (props) => {
-    // Should only destruct `trimBefore` and `trimAfter` from props,
-    // rest gets drilled down
-    const { trimBefore, trimAfter, name, pauseWhenBuffering, stack, showInTimeline, ...otherProps } = props;
-    const environment = useRemotionEnvironment();
-    const onDuration = useCallback(() => undefined, []);
-    if (typeof props.src !== 'string') {
-        throw new TypeError(`The \`<Video>\` tag requires a string for \`src\`, but got ${JSON.stringify(props.src)} instead.`);
-    }
-    validateMediaTrimProps({
-        startFrom: undefined,
-        endAt: undefined,
-        trimBefore,
-        trimAfter,
-    });
-    const { trimBeforeValue, trimAfterValue } = resolveTrimProps({
-        startFrom: undefined,
-        endAt: undefined,
-        trimBefore,
-        trimAfter,
-    });
-    if (typeof trimBeforeValue !== 'undefined' ||
-        typeof trimAfterValue !== 'undefined') {
-        return (_jsx(Sequence, { layout: "none", from: 0 - (trimBeforeValue ?? 0), showInTimeline: false, durationInFrames: trimAfterValue, name: name, children: _jsx(Video, { pauseWhenBuffering: pauseWhenBuffering ?? false, ...otherProps }) }));
-    }
-    validateMediaProps(props, 'Video');
-    if (environment.isRendering) {
-        return _jsx(VideoForRendering, { ...otherProps });
-    }
-    const { onAutoPlayError, onVideoFrame, crossOrigin, delayRenderRetries, delayRenderTimeoutInMilliseconds, ...propsForPreview } = otherProps;
-    return (_jsx(VideoForPreview, { _remotionInternalStack: stack ?? null, _remotionInternalNativeLoopPassed: false, onDuration: onDuration, onlyWarnForMediaSeekingError: true, pauseWhenBuffering: pauseWhenBuffering ?? false, showInTimeline: showInTimeline ?? true, onAutoPlayError: onAutoPlayError ?? undefined, onVideoFrame: onVideoFrame ?? null, crossOrigin: crossOrigin, ...propsForPreview }));
-};