@remotion/webcodecs 4.0.210

package/dist/video-decoder.js

@@ -0,0 +1,87 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createVideoDecoder = void 0;
+const createVideoDecoder = ({ onFrame, onError, signal, config, }) => {
+    let outputQueue = Promise.resolve();
+    let outputQueueSize = 0;
+    let dequeueResolver = () => { };
+    const videoDecoder = new VideoDecoder({
+        output(inputFrame) {
+            outputQueueSize++;
+            outputQueue = outputQueue
+                .then(() => onFrame(inputFrame))
+                .then(() => {
+                outputQueueSize--;
+                dequeueResolver();
+                return Promise.resolve();
+            });
+        },
+        error(error) {
+            onError(error);
+        },
+    });
+    const close = () => {
+        // eslint-disable-next-line @typescript-eslint/no-use-before-define
+        signal.removeEventListener('abort', onAbort);
+        if (videoDecoder.state === 'closed') {
+            return;
+        }
+        videoDecoder.close();
+    };
+    const onAbort = () => {
+        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();
+        }
+        // @ts-expect-error - can have changed in the meanwhile
+        if (videoDecoder.state === 'closed') {
+            return;
+        }
+        if (sample.type === 'key') {
+            await videoDecoder.flush();
+        }
+        videoDecoder.decode(new EncodedVideoChunk(sample));
+    };
+    let inputQueue = Promise.resolve();
+    return {
+        processSample: (sample) => {
+            inputQueue = inputQueue.then(() => processSample(sample));
+            return inputQueue;
+        },
+        waitForFinish: async () => {
+            await videoDecoder.flush();
+            await waitForFinish();
+            await outputQueue;
+            await inputQueue;
+        },
+        close,
+        getQueueSize,
+        flush: async () => {
+            await videoDecoder.flush();
+        },
+    };
+};
+exports.createVideoDecoder = createVideoDecoder;

package/dist/video-encoder-config.d.ts

@@ -0,0 +1 @@
+export declare const getVideoEncoderConfig: (config: VideoEncoderConfig) => Promise<VideoEncoderConfig | null>;

package/dist/video-encoder-config.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getVideoEncoderConfig = void 0;
+const getVideoEncoderConfig = async (config) => {
+    if (typeof VideoEncoder === 'undefined') {
+        return null;
+    }
+    const hardware = {
+        ...config,
+        hardwareAcceleration: 'prefer-hardware',
+    };
+    if ((await VideoEncoder.isConfigSupported(hardware)).supported) {
+        return hardware;
+    }
+    const software = {
+        ...config,
+        hardwareAcceleration: 'prefer-software',
+    };
+    if ((await VideoEncoder.isConfigSupported(software)).supported) {
+        return software;
+    }
+    return null;
+};
+exports.getVideoEncoderConfig = getVideoEncoderConfig;

package/dist/video-encoder.d.ts

@@ -0,0 +1,13 @@
+export type WebCodecsVideoEncoder = {
+    encodeFrame: (videoFrame: VideoFrame) => Promise<void>;
+    waitForFinish: () => Promise<void>;
+    close: () => void;
+    getQueueSize: () => number;
+    flush: () => Promise<void>;
+};
+export declare const createVideoEncoder: ({ onChunk, onError, signal, config, }: {
+    onChunk: (chunk: EncodedVideoChunk) => Promise<void>;
+    onError: (error: DOMException) => void;
+    signal: AbortSignal;
+    config: VideoEncoderConfig;
+}) => WebCodecsVideoEncoder;

package/dist/video-encoder.js

@@ -0,0 +1,90 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createVideoEncoder = void 0;
+const createVideoEncoder = ({ onChunk, onError, signal, config, }) => {
+    if (signal.aborted) {
+        throw new Error('Not creating video encoder, already aborted');
+    }
+    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();
+                return Promise.resolve();
+            });
+        },
+    });
+    const close = () => {
+        // eslint-disable-next-line @typescript-eslint/no-use-before-define
+        signal.removeEventListener('abort', onAbort);
+        if (encoder.state === 'closed') {
+            return;
+        }
+        encoder.close();
+    };
+    const onAbort = () => {
+        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();
+        }
+        // @ts-expect-error - can have changed in the meanwhile
+        if (encoder.state === 'closed') {
+            return;
+        }
+        encoder.encode(frame, {
+            keyFrame: framesProcessed % 40 === 0,
+        });
+        framesProcessed++;
+    };
+    let inputQueue = Promise.resolve();
+    return {
+        encodeFrame: (frame) => {
+            inputQueue = inputQueue.then(() => encodeFrame(frame));
+            return inputQueue;
+        },
+        waitForFinish: async () => {
+            await encoder.flush();
+            await outputQueue;
+            await waitForFinish();
+        },
+        close,
+        getQueueSize,
+        flush: async () => {
+            await encoder.flush();
+        },
+    };
+};
+exports.createVideoEncoder = createVideoEncoder;

package/dist/video-parser.d.ts

@@ -0,0 +1 @@
+export declare const parseVideo: (file: File) => Promise<void>;

package/dist/video-parser.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseVideo = void 0;
+const media_parser_1 = require("@remotion/media-parser");
+const web_file_1 = require("@remotion/media-parser/web-file");
+const parseVideo = async (file) => {
+    const videoDecoder = new VideoDecoder({
+        output(inputFrame) {
+            console.log('frame', inputFrame);
+            inputFrame.close();
+        },
+        error(error) {
+            console.error(error);
+        },
+    });
+    await (0, media_parser_1.parseMedia)({
+        src: file,
+        reader: web_file_1.webFileReader,
+        onVideoTrack: (track) => {
+            videoDecoder.configure({
+                ...track,
+                hardwareAcceleration: 'no-preference',
+            });
+            return (chunk) => {
+                videoDecoder.decode(new EncodedVideoChunk(chunk));
+            };
+        },
+        onAudioTrack: (track) => {
+            const audioDecoder = new AudioDecoder({
+                output(inputFrame) {
+                    console.log('audio frame', inputFrame);
+                    inputFrame.close();
+                },
+                error(error) {
+                    console.error(error);
+                },
+            });
+            audioDecoder.configure({
+                codec: track.codec,
+                sampleRate: track.sampleRate,
+                numberOfChannels: track.numberOfChannels,
+                description: track.description,
+            });
+            console.log('audio track', track);
+            return (audioSample) => {
+                audioDecoder.decode(new EncodedAudioChunk(audioSample));
+            };
+        },
+    });
+};
+exports.parseVideo = parseVideo;

package/dist/wait-for-dequeue.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="dom-webcodecs" />
+export declare const decoderWaitForDequeue: (videoDecoder: VideoDecoder | AudioDecoder) => Promise<void>;
+export declare const decoderWaitForFinish: (videoDecoder: VideoDecoder | AudioDecoder) => Promise<void>;
+export declare const encoderWaitForDequeue: (videoEncoder: VideoEncoder | AudioEncoder) => Promise<void>;
+export declare const encoderWaitForFinish: (videoEncoder: VideoEncoder | AudioEncoder) => Promise<void>;

package/dist/wait-for-dequeue.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.encoderWaitForFinish = exports.encoderWaitForDequeue = exports.decoderWaitForFinish = exports.decoderWaitForDequeue = void 0;
+const decoderWaitForDequeue = async (videoDecoder) => {
+    while (videoDecoder.decodeQueueSize > 10) {
+        await new Promise((r) => {
+            // @ts-expect-error exists
+            videoDecoder.addEventListener('dequeue', () => r(), {
+                once: true,
+            });
+        });
+    }
+};
+exports.decoderWaitForDequeue = decoderWaitForDequeue;
+const decoderWaitForFinish = async (videoDecoder) => {
+    while (videoDecoder.decodeQueueSize > 0) {
+        await new Promise((r) => {
+            // @ts-expect-error exists
+            videoDecoder.addEventListener('dequeue', () => r(), {
+                once: true,
+            });
+        });
+    }
+    await videoDecoder.flush();
+};
+exports.decoderWaitForFinish = decoderWaitForFinish;
+// Queue goes way higher but this will eat more memory right?
+// But if not done this way, quality is worse
+const encoderWaitForDequeue = async (videoEncoder) => {
+    while (videoEncoder.encodeQueueSize > 10) {
+        await new Promise((r) => {
+            // @ts-expect-error exists
+            videoEncoder.addEventListener('dequeue', () => r(), {
+                once: true,
+            });
+        });
+    }
+};
+exports.encoderWaitForDequeue = encoderWaitForDequeue;
+const encoderWaitForFinish = async (videoEncoder) => {
+    while (videoEncoder.encodeQueueSize > 0) {
+        await new Promise((r) => {
+            // @ts-expect-error exists
+            videoEncoder.addEventListener('dequeue', () => r(), {
+                once: true,
+            });
+        });
+    }
+    await videoEncoder.flush();
+};
+exports.encoderWaitForFinish = encoderWaitForFinish;

package/dist/with-resolvers.d.ts

@@ -0,0 +1,5 @@
+export declare const withResolvers: <T>() => {
+    promise: Promise<T>;
+    resolve: (value: T | PromiseLike<T>) => void;
+    reject: (reason?: any) => void;
+};

package/dist/with-resolvers.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withResolvers = void 0;
+const withResolvers = function () {
+    let resolve;
+    let reject;
+    const promise = new Promise((res, rej) => {
+        resolve = res;
+        reject = rej;
+    });
+    return { promise, resolve: resolve, reject: reject };
+};
+exports.withResolvers = withResolvers;

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@remotion/webcodecs",
+  "version": "4.0.210",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "module": "dist/esm/index.mjs",
+  "sideEffects": false,
+  "repository": {
+    "url": "https://github.com/remotion-dev/remotion/tree/main/packages/webcodecs"
+  },
+  "bugs": {
+    "url": "https://github.com/remotion-dev/remotion/issues"
+  },
+  "files": [
+    "dist"
+  ],
+  "author": "Jonny Burger <jonny@remotion.dev>",
+  "license": "SEE LICENSE IN LICENSE.md",
+  "dependencies": {
+    "@remotion/media-parser": "4.0.210"
+  },
+  "peerDependencies": {},
+  "devDependencies": {
+    "@types/dom-webcodecs": "0.1.11"
+  },
+  "keywords": [],
+  "publishConfig": {
+    "access": "public"
+  },
+  "description": "Media conversion in the browser",
+  "scripts": {
+    "formatting": "prettier src --check",
+    "lint": "eslint src --ext ts,tsx",
+    "build": "tsc -d && bun --env-file=../.env.bundle bundle.ts",
+    "watch": "tsc -w"
+  }
+}