@remotion/media 4.0.363 → 4.0.364

package/dist/audio/audio-for-preview.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { Internals, Audio as RemotionAudio, useBufferState, useCurrentFrame, } from 'remotion';
+import { MediaPlayer } from '../media-player';
 import { useLoopDisplay } from '../show-in-timeline';
 import { useMediaInTimeline } from '../use-media-in-timeline';
-import { MediaPlayer } from '../video/media-player';
 const { useUnsafeVideoConfig, Timeline, SharedAudioContext, useMediaMutedState, useMediaVolumeState, useFrameForVolumeProp, evaluateVolume, warnAboutTooHighVolume, usePreload, SequenceContext, } = Internals;
 const NewAudioForPreview = ({ src, playbackRate, logLevel, muted, volume, loopVolumeCurveBehavior, loop, trimAfter, trimBefore, name, showInTimeline, stack, disallowFallbackToHtml5Audio, toneFrequency, audioStreamIndex, fallbackHtml5AudioProps, }) => {
     const videoConfig = useUnsafeVideoConfig();
@@ -76,6 +76,8 @@ const NewAudioForPreview = ({ src, playbackRate, logLevel, muted, volume, loopVo
                 canvas: null,
                 playbackRate,
                 audioStreamIndex: audioStreamIndex ?? 0,
+                debugOverlay: false,
+                bufferState: buffer,
             });
             mediaPlayerRef.current = player;
             player
@@ -152,6 +154,7 @@ const NewAudioForPreview = ({ src, playbackRate, logLevel, muted, volume, loopVo
         videoConfig.fps,
         audioStreamIndex,
         disallowFallbackToHtml5Audio,
+        buffer,
     ]);
     useEffect(() => {
         const audioPlayer = mediaPlayerRef.current;

package/dist/audio/audio-iterator.d.ts

@@ -0,0 +1,11 @@
+import type { AudioBufferSink } from 'mediabunny';
+export declare const HEALTHY_BUFFER_THRESHOLD_SECONDS = 1;
+export declare const makeAudioIterator: (audioSink: AudioBufferSink, startFromSecond: number) => {
+    iterator: AsyncGenerator<import("mediabunny").WrappedAudioBuffer, void, unknown>;
+    destroy: () => void;
+    isReadyToPlay: () => boolean;
+    setAudioIteratorStarted: (started: boolean) => void;
+    getNext: () => Promise<IteratorResult<import("mediabunny").WrappedAudioBuffer, void>>;
+    setAudioBufferHealth: (health: number) => void;
+};
+export type AudioIterator = ReturnType<typeof makeAudioIterator>;

package/dist/audio/audio-iterator.js

@@ -0,0 +1,24 @@
+export const HEALTHY_BUFFER_THRESHOLD_SECONDS = 1;
+export const makeAudioIterator = (audioSink, startFromSecond) => {
+    const iterator = audioSink.buffers(startFromSecond);
+    let audioIteratorStarted = false;
+    let audioBufferHealth = 0;
+    return {
+        iterator,
+        destroy: () => {
+            iterator.return().catch(() => undefined);
+        },
+        isReadyToPlay: () => {
+            return audioIteratorStarted && audioBufferHealth > 0;
+        },
+        setAudioIteratorStarted: (started) => {
+            audioIteratorStarted = started;
+        },
+        getNext: () => {
+            return iterator.next();
+        },
+        setAudioBufferHealth: (health) => {
+            audioBufferHealth = health;
+        },
+    };
+};

package/dist/audio/audio-preview-iterator.d.ts

@@ -0,0 +1,14 @@
+import type { AudioBufferSink } from 'mediabunny';
+export declare const HEALTHY_BUFFER_THRESHOLD_SECONDS = 1;
+export declare const makeAudioIterator: (audioSink: AudioBufferSink, startFromSecond: number) => {
+    cleanupAudioQueue: () => void;
+    destroy: () => void;
+    isReadyToPlay: () => boolean;
+    setAudioIteratorStarted: (started: boolean) => void;
+    getNext: () => Promise<IteratorResult<import("mediabunny").WrappedAudioBuffer, void>>;
+    setAudioBufferHealth: (health: number) => void;
+    isDestroyed: () => boolean;
+    addQueuedAudioNode: (node: AudioBufferSourceNode) => void;
+    removeQueuedAudioNode: (node: AudioBufferSourceNode) => void;
+};
+export type AudioIterator = ReturnType<typeof makeAudioIterator>;

package/dist/audio/audio-preview-iterator.js

@@ -0,0 +1,43 @@
+export const HEALTHY_BUFFER_THRESHOLD_SECONDS = 1;
+export const makeAudioIterator = (audioSink, startFromSecond) => {
+    let destroyed = false;
+    const iterator = audioSink.buffers(startFromSecond);
+    let audioIteratorStarted = false;
+    let audioBufferHealth = 0;
+    const queuedAudioNodes = new Set();
+    const cleanupAudioQueue = () => {
+        for (const node of queuedAudioNodes) {
+            node.stop();
+        }
+        queuedAudioNodes.clear();
+    };
+    return {
+        cleanupAudioQueue,
+        destroy: () => {
+            cleanupAudioQueue();
+            destroyed = true;
+            iterator.return().catch(() => undefined);
+        },
+        isReadyToPlay: () => {
+            return audioIteratorStarted && audioBufferHealth > 0;
+        },
+        setAudioIteratorStarted: (started) => {
+            audioIteratorStarted = started;
+        },
+        getNext: () => {
+            return iterator.next();
+        },
+        setAudioBufferHealth: (health) => {
+            audioBufferHealth = health;
+        },
+        isDestroyed: () => {
+            return destroyed;
+        },
+        addQueuedAudioNode: (node) => {
+            queuedAudioNodes.add(node);
+        },
+        removeQueuedAudioNode: (node) => {
+            queuedAudioNodes.delete(node);
+        },
+    };
+};

package/dist/debug-overlay/preview-overlay.d.ts

@@ -0,0 +1,5 @@
+export type DebugStats = {
+    videoIteratorsCreated: number;
+    framesRendered: number;
+};
+export declare const drawPreviewOverlay: (context: CanvasRenderingContext2D, stats: DebugStats, audioContextState: AudioContextState, audioSyncAnchor: number) => void;

package/dist/debug-overlay/preview-overlay.js

@@ -0,0 +1,13 @@
+export const drawPreviewOverlay = (context, stats, audioContextState, audioSyncAnchor) => {
+    // Optionally, set a background for text legibility
+    context.fillStyle = 'rgba(0, 0, 0, 1)';
+    context.fillRect(20, 20, 600, 180);
+    context.fillStyle = 'white';
+    context.font = '24px sans-serif';
+    context.textBaseline = 'top';
+    context.fillText(`Debug overlay`, 30, 30);
+    context.fillText(`Video iterators created: ${stats.videoIteratorsCreated}`, 30, 60);
+    context.fillText(`Frames rendered: ${stats.framesRendered}`, 30, 90);
+    context.fillText(`Audio context state: ${audioContextState}`, 30, 120);
+    context.fillText(`Audio time: ${audioSyncAnchor.toFixed(3)}s`, 30, 150);
+};