@remotion/webcodecs 4.0.226 → 4.0.228

package/dist/esm/index.mjs

@@ -1,24 +1,175 @@
+// src/log.ts
+import { MediaParserInternals } from "@remotion/media-parser";
+var { Log } = MediaParserInternals;
+
+// src/with-resolvers.ts
+var withResolvers = function() {
+  let resolve;
+  let reject;
+  const promise = new Promise((res, rej) => {
+    resolve = res;
+    reject = rej;
+  });
+  return { promise, resolve, reject };
+};
+var withResolversAndWaitForReturn = () => {
+  const { promise, reject, resolve } = withResolvers();
+  const { promise: returnPromise, resolve: resolveReturn } = withResolvers();
+  return {
+    getPromiseToImmediatelyReturn: () => {
+      resolveReturn(undefined);
+      return promise;
+    },
+    reject: (reason) => {
+      returnPromise.then(() => reject(reason));
+    },
+    resolve
+  };
+};
+
+// src/io-manager/event-emitter.ts
+class IoEventEmitter {
+  listeners = {
+    input: [],
+    output: [],
+    processed: []
+  };
+  addEventListener(name, callback) {
+    this.listeners[name].push(callback);
+  }
+  removeEventListener(name, callback) {
+    this.listeners[name] = this.listeners[name].filter((l) => l !== callback);
+  }
+  dispatchEvent(dispatchName, context) {
+    this.listeners[dispatchName].forEach((callback) => {
+      callback({ detail: context });
+    });
+  }
+}
+
+// src/io-manager/io-synchronizer.ts
+var makeIoSynchronizer = (logLevel, label) => {
+  const eventEmitter = new IoEventEmitter;
+  let lastInput = 0;
+  let lastInputKeyframe = 0;
+  let lastOutput = 0;
+  let inputsSinceLastOutput = 0;
+  let inputs = [];
+  let keyframes = [];
+  let unprocessed = 0;
+  const getUnprocessed = () => unprocessed;
+  const getUnemittedItems = () => {
+    inputs = inputs.filter((input) => input > lastOutput);
+    return inputs.length;
+  };
+  const getUnemittedKeyframes = () => {
+    keyframes = keyframes.filter((keyframe) => keyframe > lastOutput);
+    return keyframes.length;
+  };
+  const printState = (prefix) => {
+    Log.trace(logLevel, `[${label}] ${prefix}, state: Last input = ${lastInput} Last input keyframe = ${lastInputKeyframe} Last output = ${lastOutput} Inputs since last output = ${inputsSinceLastOutput}, Queue = ${getUnemittedItems()} (${getUnemittedKeyframes()} keyframes), Unprocessed = ${getUnprocessed()}`);
+  };
+  const inputItem = (timestamp, keyFrame) => {
+    lastInput = timestamp;
+    if (keyFrame) {
+      lastInputKeyframe = timestamp;
+      keyframes.push(timestamp);
+    }
+    inputsSinceLastOutput++;
+    inputs.push(timestamp);
+    eventEmitter.dispatchEvent("input", {
+      timestamp,
+      keyFrame
+    });
+    printState("Input item");
+  };
+  const onOutput = (timestamp) => {
+    lastOutput = timestamp;
+    inputsSinceLastOutput = 0;
+    eventEmitter.dispatchEvent("output", {
+      timestamp
+    });
+    unprocessed++;
+    printState("Got output");
+  };
+  const waitForOutput = () => {
+    const { promise, resolve } = withResolvers();
+    const on = () => {
+      eventEmitter.removeEventListener("output", on);
+      resolve();
+    };
+    eventEmitter.addEventListener("output", on);
+    return promise;
+  };
+  const waitForProcessed = () => {
+    const { promise, resolve } = withResolvers();
+    const on = () => {
+      eventEmitter.removeEventListener("processed", on);
+      resolve();
+    };
+    eventEmitter.addEventListener("processed", on);
+    return promise;
+  };
+  const waitFor = async ({
+    _unprocessed,
+    unemitted
+  }) => {
+    while (getUnemittedItems() > unemitted) {
+      await waitForOutput();
+    }
+    while (getUnprocessed() > _unprocessed) {
+      await waitForProcessed();
+    }
+  };
+  const waitForFinish = async () => {
+    await waitFor({ _unprocessed: 0, unemitted: 0 });
+  };
+  const onProcessed = () => {
+    eventEmitter.dispatchEvent("processed", {});
+    unprocessed--;
+  };
+  return {
+    inputItem,
+    onOutput,
+    waitFor,
+    waitForFinish,
+    onProcessed,
+    getUnprocessed
+  };
+};
+
 // src/audio-decoder.ts
 var createAudioDecoder = ({
   onFrame,
   onError,
   signal,
-  config
+  config,
+  logLevel
 }) => {
   if (signal.aborted) {
     throw new Error("Not creating audio decoder, already aborted");
   }
+  const ioSynchronizer = makeIoSynchronizer(logLevel, "Audio decoder");
   let outputQueue = Promise.resolve();
-  let outputQueueSize = 0;
-  let dequeueResolver = () => {
-  };
   const audioDecoder = new AudioDecoder({
     output(inputFrame) {
-      outputQueueSize++;
-      outputQueue = outputQueue.then(() => onFrame(inputFrame)).then(() => {
-        dequeueResolver();
-        outputQueueSize--;
+      ioSynchronizer.onOutput(inputFrame.timestamp);
+      const abortHandler = () => {
+        inputFrame.close();
+      };
+      signal.addEventListener("abort", abortHandler, { once: true });
+      outputQueue = outputQueue.then(() => {
+        if (signal.aborted) {
+          return;
+        }
+        return onFrame(inputFrame);
+      }).then(() => {
+        ioSynchronizer.onProcessed();
+        signal.removeEventListener("abort", abortHandler);
         return Promise.resolve();
+      }).catch((err) => {
+        inputFrame.close();
+        onError(err);
       });
     },
     error(error) {
@@ -36,32 +187,15 @@ var createAudioDecoder = ({
     close();
   };
   signal.addEventListener("abort", onAbort);
-  const getQueueSize = () => {
-    return audioDecoder.decodeQueueSize + outputQueueSize;
-  };
   audioDecoder.configure(config);
-  const waitForDequeue = async () => {
-    await new Promise((r) => {
-      dequeueResolver = r;
-      audioDecoder.addEventListener("dequeue", () => r(), {
-        once: true
-      });
-    });
-  };
-  const waitForFinish = async () => {
-    while (getQueueSize() > 0) {
-      await waitForDequeue();
-    }
-  };
   const processSample = async (audioSample) => {
     if (audioDecoder.state === "closed") {
       return;
     }
-    while (getQueueSize() > 10) {
-      await waitForDequeue();
-    }
+    await ioSynchronizer.waitFor({ unemitted: 100, _unprocessed: 2 });
     const chunk = new EncodedAudioChunk(audioSample);
     audioDecoder.decode(chunk);
+    ioSynchronizer.inputItem(chunk.timestamp, audioSample.type === "key");
   };
   let queue = Promise.resolve();
   return {
@@ -71,11 +205,10 @@ var createAudioDecoder = ({
     },
     waitForFinish: async () => {
       await audioDecoder.flush();
-      await waitForFinish();
+      await ioSynchronizer.waitForFinish();
       await outputQueue;
     },
     close,
-    getQueueSize,
     flush: async () => {
       await audioDecoder.flush();
     }
@@ -87,22 +220,27 @@ var createAudioEncoder = ({
   onError,
   codec,
   signal,
-  config: audioEncoderConfig
+  config: audioEncoderConfig,
+  logLevel
 }) => {
   if (signal.aborted) {
     throw new Error("Not creating audio encoder, already aborted");
   }
+  const ioSynchronizer = makeIoSynchronizer(logLevel, "Audio encoder");
   let prom = Promise.resolve();
-  let outputQueue = 0;
-  let dequeueResolver = () => {
-  };
   const encoder = new AudioEncoder({
     output: (chunk) => {
-      outputQueue++;
-      prom = prom.then(() => onChunk(chunk)).then(() => {
-        outputQueue--;
-        dequeueResolver();
+      ioSynchronizer.onOutput(chunk.timestamp);
+      prom = prom.then(() => {
+        if (signal.aborted) {
+          return;
+        }
+        return onChunk(chunk);
+      }).then(() => {
+        ioSynchronizer.onProcessed();
         return Promise.resolve();
+      }).catch((err) => {
+        onError(err);
       });
     },
     error(error) {
@@ -123,34 +261,17 @@ var createAudioEncoder = ({
   if (codec !== "opus") {
     throw new Error('Only `codec: "opus"` is supported currently');
   }
-  const getQueueSize = () => {
-    return encoder.encodeQueueSize + outputQueue;
-  };
   encoder.configure(audioEncoderConfig);
-  const waitForDequeue = async () => {
-    await new Promise((r) => {
-      dequeueResolver = r;
-      encoder.addEventListener("dequeue", () => r(), {
-        once: true
-      });
-    });
-  };
-  const waitForFinish = async () => {
-    while (getQueueSize() > 0) {
-      await waitForDequeue();
-    }
-  };
   const encodeFrame = async (audioData) => {
     if (encoder.state === "closed") {
       return;
     }
-    while (getQueueSize() > 10) {
-      await waitForDequeue();
-    }
+    await ioSynchronizer.waitFor({ unemitted: 2, _unprocessed: 2 });
     if (encoder.state === "closed") {
       return;
     }
     encoder.encode(audioData);
+    ioSynchronizer.inputItem(audioData.timestamp, true);
   };
   let queue = Promise.resolve();
   return {
@@ -160,11 +281,10 @@ var createAudioEncoder = ({
     },
     waitForFinish: async () => {
       await encoder.flush();
-      await waitForFinish();
+      await ioSynchronizer.waitForFinish();
       await prom;
     },
     close,
-    getQueueSize,
     flush: async () => {
       await encoder.flush();
     }
@@ -172,11 +292,37 @@ var createAudioEncoder = ({
 };
 // src/convert-media.ts
 import {
-  MediaParserInternals,
+  MediaParserInternals as MediaParserInternals2,
   parseMedia
 } from "@remotion/media-parser";
+
+// src/auto-select-writer.ts
 import { bufferWriter } from "@remotion/media-parser/buffer";
 import { canUseWebFsWriter, webFsWriter } from "@remotion/media-parser/web-fs";
+var autoSelectWriter = async (writer, logLevel) => {
+  if (writer) {
+    Log.verbose(logLevel, "Using writer provided by user");
+    return writer;
+  }
+  Log.verbose(logLevel, "Determining best writer");
+  if (await canUseWebFsWriter()) {
+    Log.verbose(logLevel, "Using WebFS writer because it is supported");
+    return webFsWriter;
+  }
+  Log.verbose(logLevel, "Using buffer writer because WebFS writer is not supported");
+  return bufferWriter;
+};
+
+// src/calculate-progress.ts
+var calculateProgress = ({
+  millisecondsWritten,
+  expectedOutputMilliseconds
+}) => {
+  if (expectedOutputMilliseconds === null) {
+    return null;
+  }
+  return millisecondsWritten / expectedOutputMilliseconds;
+};
 
 // src/error-cause.ts
 var error_cause_default = Error;
@@ -247,7 +393,8 @@ var makeAudioTrackHandler = ({
   abortConversion,
   onMediaStateUpdate,
   onAudioTrack,
-  bitrate
+  bitrate,
+  logLevel
 }) => async (track) => {
   const audioEncoderConfig = await getAudioEncoderConfig({
     codec: audioCodec,
@@ -313,7 +460,8 @@ var makeAudioTrackHandler = ({
     },
     codec: audioCodec,
     signal: controller.signal,
-    config: audioEncoderConfig
+    config: audioEncoderConfig,
+    logLevel
   });
   const audioDecoder = createAudioDecoder({
     onFrame: async (frame) => {
@@ -328,7 +476,8 @@ var makeAudioTrackHandler = ({
       }));
     },
     signal: controller.signal,
-    config: audioDecoderConfig
+    config: audioDecoderConfig,
+    logLevel
   });
   state.addWaitForFinishPromise(async () => {
     await audioDecoder.waitForFinish();
@@ -384,19 +533,30 @@ var createVideoDecoder = ({
   onFrame,
   onError,
   signal,
-  config
+  config,
+  logLevel
 }) => {
+  const ioSynchronizer = makeIoSynchronizer(logLevel, "Video decoder");
   let outputQueue = Promise.resolve();
-  let outputQueueSize = 0;
-  let dequeueResolver = () => {
-  };
   const videoDecoder = new VideoDecoder({
     output(inputFrame) {
-      outputQueueSize++;
-      outputQueue = outputQueue.then(() => onFrame(inputFrame)).then(() => {
-        outputQueueSize--;
-        dequeueResolver();
+      ioSynchronizer.onOutput(inputFrame.timestamp);
+      const abortHandler = () => {
+        inputFrame.close();
+      };
+      signal.addEventListener("abort", abortHandler, { once: true });
+      outputQueue = outputQueue.then(() => {
+        if (signal.aborted) {
+          return;
+        }
+        return onFrame(inputFrame);
+      }).then(() => {
+        ioSynchronizer.onProcessed();
+        signal.removeEventListener("abort", abortHandler);
         return Promise.resolve();
+      }).catch((err) => {
+        inputFrame.close();
+        onError(err);
       });
     },
     error(error) {
@@ -414,37 +574,20 @@ var createVideoDecoder = ({
     close();
   };
   signal.addEventListener("abort", onAbort);
-  const getQueueSize = () => {
-    return videoDecoder.decodeQueueSize + outputQueueSize;
-  };
   videoDecoder.configure(config);
-  const waitForDequeue = async () => {
-    await new Promise((r) => {
-      dequeueResolver = r;
-      videoDecoder.addEventListener("dequeue", () => r(), {
-        once: true
-      });
-    });
-  };
-  const waitForFinish = async () => {
-    while (getQueueSize() > 0) {
-      await waitForDequeue();
-    }
-  };
   const processSample = async (sample) => {
     if (videoDecoder.state === "closed") {
       return;
     }
-    while (getQueueSize() > 10) {
-      await waitForDequeue();
-    }
     if (videoDecoder.state === "closed") {
       return;
     }
+    await ioSynchronizer.waitFor({ unemitted: 20, _unprocessed: 2 });
     if (sample.type === "key") {
       await videoDecoder.flush();
     }
     videoDecoder.decode(new EncodedVideoChunk(sample));
+    ioSynchronizer.inputItem(sample.timestamp, sample.type === "key");
   };
   let inputQueue = Promise.resolve();
   return {
@@ -454,12 +597,11 @@ var createVideoDecoder = ({
     },
     waitForFinish: async () => {
       await videoDecoder.flush();
-      await waitForFinish();
+      await ioSynchronizer.waitForFinish();
       await outputQueue;
       await inputQueue;
     },
     close,
-    getQueueSize,
     flush: async () => {
       await videoDecoder.flush();
     }
@@ -493,25 +635,34 @@ var createVideoEncoder = ({
   onChunk,
   onError,
   signal,
-  config
+  config,
+  logLevel
 }) => {
   if (signal.aborted) {
     throw new Error("Not creating video encoder, already aborted");
   }
+  const ioSynchronizer = makeIoSynchronizer(logLevel, "Video encoder");
   let outputQueue = Promise.resolve();
-  let outputQueueSize = 0;
-  let dequeueResolver = () => {
-  };
   const encoder = new VideoEncoder({
     error(error) {
       onError(error);
     },
     output(chunk) {
-      outputQueueSize++;
-      outputQueue = outputQueue.then(() => onChunk(chunk)).then(() => {
-        outputQueueSize--;
-        dequeueResolver();
+      if (chunk.duration === null) {
+        throw new Error("Duration is null");
+      }
+      const timestamp = chunk.timestamp + chunk.duration;
+      ioSynchronizer.onOutput(timestamp);
+      outputQueue = outputQueue.then(() => {
+        if (signal.aborted) {
+          return;
+        }
+        return onChunk(chunk);
+      }).then(() => {
+        ioSynchronizer.onProcessed();
         return Promise.resolve();
+      }).catch((err) => {
+        onError(err);
       });
     }
   });
@@ -526,37 +677,24 @@ var createVideoEncoder = ({
     close();
   };
   signal.addEventListener("abort", onAbort);
-  const getQueueSize = () => {
-    return encoder.encodeQueueSize + outputQueueSize;
-  };
   encoder.configure(config);
   let framesProcessed = 0;
-  const waitForDequeue = async () => {
-    await new Promise((r) => {
-      dequeueResolver = r;
-      encoder.addEventListener("dequeue", () => r(), {
-        once: true
-      });
-    });
-  };
-  const waitForFinish = async () => {
-    while (getQueueSize() > 0) {
-      await waitForDequeue();
-    }
-  };
   const encodeFrame = async (frame) => {
     if (encoder.state === "closed") {
       return;
     }
-    while (getQueueSize() > 10) {
-      await waitForDequeue();
-    }
+    await ioSynchronizer.waitFor({
+      unemitted: 2,
+      _unprocessed: 2
+    });
     if (encoder.state === "closed") {
       return;
     }
+    const keyFrame = framesProcessed % 40 === 0;
     encoder.encode(frame, {
-      keyFrame: framesProcessed % 40 === 0
+      keyFrame
     });
+    ioSynchronizer.inputItem(frame.timestamp, keyFrame);
     framesProcessed++;
   };
   let inputQueue = Promise.resolve();
@@ -568,10 +706,9 @@ var createVideoEncoder = ({
     waitForFinish: async () => {
       await encoder.flush();
       await outputQueue;
-      await waitForFinish();
+      await ioSynchronizer.waitForFinish();
     },
     close,
-    getQueueSize,
     flush: async () => {
       await encoder.flush();
     }
@@ -609,8 +746,12 @@ var makeVideoTrackHandler = ({
   convertMediaState,
   controller,
   videoCodec,
-  onVideoTrack
+  onVideoTrack,
+  logLevel
 }) => async (track) => {
+  if (controller.signal.aborted) {
+    throw new error_cause_default("Aborted");
+  }
   const videoEncoderConfig = await getVideoEncoderConfig({
     codec: videoCodec === "vp9" ? "vp09.00.10.08" : videoCodec,
     height: track.displayAspectHeight,
@@ -636,8 +777,8 @@ var makeVideoTrackHandler = ({
       codec: track.codecWithoutConfig,
       codecPrivate: track.codecPrivate
     });
-    return (sample) => {
-      state.addSample(new EncodedVideoChunk(sample), videoTrack.trackNumber, true);
+    return async (sample) => {
+      await state.addSample(new EncodedVideoChunk(sample), videoTrack.trackNumber, true);
       convertMediaState.decodedVideoFrames++;
       onMediaStateUpdate?.({ ...convertMediaState });
     };
@@ -670,7 +811,8 @@ var makeVideoTrackHandler = ({
       }));
     },
     signal: controller.signal,
-    config: videoEncoderConfig
+    config: videoEncoderConfig,
+    logLevel
   });
   const videoDecoder = createVideoDecoder({
     config: videoDecoderConfig,
@@ -686,7 +828,8 @@ var makeVideoTrackHandler = ({
         cause: err
       }));
     },
-    signal: controller.signal
+    signal: controller.signal,
+    logLevel
   });
   state.addWaitForFinishPromise(async () => {
     await videoDecoder.waitForFinish();
@@ -699,29 +842,26 @@ var makeVideoTrackHandler = ({
   };
 };
 
-// src/with-resolvers.ts
-var withResolvers = function() {
-  let resolve;
-  let reject;
-  const promise = new Promise((res, rej) => {
-    resolve = res;
-    reject = rej;
-  });
-  return { promise, resolve, reject };
-};
-
 // src/convert-media.ts
-var convertMedia = async ({
+var convertMedia = async function({
   src,
   onVideoFrame,
-  onMediaStateUpdate,
+  onMediaStateUpdate: onMediaStateDoNoCallDirectly,
   audioCodec,
   to,
   videoCodec,
   signal: userPassedAbortSignal,
   onAudioTrack: userAudioResolver,
-  onVideoTrack: userVideoResolver
-}) => {
+  onVideoTrack: userVideoResolver,
+  reader,
+  fields,
+  logLevel = "info",
+  writer,
+  ...more
+}) {
+  if (userPassedAbortSignal?.aborted) {
+    return Promise.reject(new error_cause_default("Aborted"));
+  }
   if (to !== "webm") {
     return Promise.reject(new TypeError('Only `to: "webm"` is supported currently'));
   }
@@ -731,7 +871,7 @@ var convertMedia = async ({
   if (videoCodec !== "vp8" && videoCodec !== "vp9") {
     return Promise.reject(new TypeError('Only `videoCodec: "vp8"` and `videoCodec: "vp9"` are supported currently'));
   }
-  const { promise, resolve, reject } = withResolvers();
+  const { resolve, reject, getPromiseToImmediatelyReturn } = withResolversAndWaitForReturn();
   const controller = new AbortController;
   const abortConversion = (errCause) => {
     reject(errCause);
@@ -747,10 +887,35 @@ var convertMedia = async ({
     decodedAudioFrames: 0,
     decodedVideoFrames: 0,
     encodedVideoFrames: 0,
-    encodedAudioFrames: 0
+    encodedAudioFrames: 0,
+    bytesWritten: 0,
+    millisecondsWritten: 0,
+    expectedOutputMilliseconds: null,
+    overallProgress: 0
+  };
+  const onMediaStateUpdate = (newState) => {
+    if (controller.signal.aborted) {
+      return;
+    }
+    onMediaStateDoNoCallDirectly?.(newState);
   };
-  const canUseWebFs = await canUseWebFsWriter();
-  const state = await MediaParserInternals.createMedia(canUseWebFs ? webFsWriter : bufferWriter);
+  const state = await MediaParserInternals2.createMedia({
+    writer: await autoSelectWriter(writer, logLevel),
+    onBytesProgress: (bytesWritten) => {
+      convertMediaState.bytesWritten = bytesWritten;
+      onMediaStateUpdate?.(convertMediaState);
+    },
+    onMillisecondsProgress: (millisecondsWritten) => {
+      if (millisecondsWritten > convertMediaState.millisecondsWritten) {
+        convertMediaState.millisecondsWritten = millisecondsWritten;
+        convertMediaState.overallProgress = calculateProgress({
+          millisecondsWritten: convertMediaState.millisecondsWritten,
+          expectedOutputMilliseconds: convertMediaState.expectedOutputMilliseconds
+        });
+        onMediaStateUpdate?.(convertMediaState);
+      }
+    }
+  });
   const onVideoTrack = makeVideoTrackHandler({
     state,
     onVideoFrame: onVideoFrame ?? null,
@@ -759,7 +924,8 @@ var convertMedia = async ({
     convertMediaState,
     controller,
     videoCodec,
-    onVideoTrack: userVideoResolver ?? defaultResolveVideoAction
+    onVideoTrack: userVideoResolver ?? defaultResolveVideoAction,
+    logLevel
   });
   const onAudioTrack = makeAudioTrackHandler({
     abortConversion,
@@ -769,23 +935,46 @@ var convertMedia = async ({
     onMediaStateUpdate: onMediaStateUpdate ?? null,
     state,
     onAudioTrack: userAudioResolver ?? defaultResolveAudioAction,
-    bitrate: 128000
+    bitrate: 128000,
+    logLevel
   });
   parseMedia({
     src,
     onVideoTrack,
     onAudioTrack,
-    signal: controller.signal
+    signal: controller.signal,
+    fields: {
+      ...fields,
+      durationInSeconds: true
+    },
+    reader,
+    ...more,
+    onDurationInSeconds: (durationInSeconds) => {
+      if (durationInSeconds === null) {
+        return null;
+      }
+      const casted = more;
+      if (casted.onDurationInSeconds) {
+        casted.onDurationInSeconds(durationInSeconds);
+      }
+      const expectedOutputMilliseconds = durationInSeconds * 1000;
+      convertMediaState.expectedOutputMilliseconds = expectedOutputMilliseconds;
+      convertMediaState.overallProgress = calculateProgress({
+        millisecondsWritten: convertMediaState.millisecondsWritten,
+        expectedOutputMilliseconds
+      });
+      onMediaStateUpdate(convertMediaState);
+    }
   }).then(() => {
     return state.waitForFinish();
   }).then(() => {
     resolve({ save: state.save, remove: state.remove });
   }).catch((err) => {
     reject(err);
-  }).finally(() => {
+  });
+  return getPromiseToImmediatelyReturn().finally(() => {
     userPassedAbortSignal?.removeEventListener("abort", onUserAbort);
   });
-  return promise;
 };
 export {
   createVideoEncoder,