ffmpeg-webworker

A WebWorker implementation that eases the use of ffmpeg library in the browser.

This builds upon an existing work geniusly done by the folks at
Ffmpeg.js and
videoconverter.js

Demo

See it here

Installation

``bash
npm install --save ffmpeg-webworker
`

or:

`bash
yarn add ffmpeg-webworker
`

Usage

`js
import workerClient from "ffmpeg-webworker";
import React from "react";

class FFMPEG extends React.Component {
constructor(props) {
super(props);
this.state = {
stdOutputText: "",
ffmpegReady: false
};

this.updateStdOutputText = this.updateStdOutputText.bind(this);
this.handleInputChange = this.handleInputChange.bind(this);
this.handleListCodecs = this.handleListCodecs.bind(this);
}

componentWillMount() {
workerClient.on("onReady", () => this.setState({ ffmpegReady: true }));
workerClient.on("onStdout", msg => this.updateStdOutputText(msg));
workerClient.on("onFileReceived", msg => this.updateStdOutputText(msg));
workerClient.on("onDone", data => {
this.updateStdOutputText("Command Completed, check the console");
console.log(data);
});
}

updateStdOutputText(text) {
this.setState({
stdOutputText: ${this.state.stdOutputText} \n\n ${text}
});
}

handleInputChange(e) {
this.setState({ stdOutputText: "" });

const file = e.currentTarget.files[0];
// Set the file for processing
workerClient.inputFile = file;
// Run a valid ffmpeg command
workerClient.runCommand("-ss 00:00:05 -c copy -t 12 sliced-output.mp4");
}

Input({ onChange }) {
return (
onChange(e)} />
);
}

StdOutput({ text, ffmpegReady }) {
return (


        {ffmpegReady ? "FFMPEG is ready" : "Loading FFMPEG"}
        {text}
      

;
`

Docs

The default export from the library is a standard NodeJS event emitter client
would listen to and dispatch events based on interactions with an already loaded
ffmpeg webworker Javascript library inside of a webworker.

It supports the following properties:

$3

Receives an event from the ffmpeg webworker. Below are the supported commands:

- _onReady_: The webworker has loaded ffmpeg successfully.
- _onStdout_: Listens to standard ffmpeg-js message outputs.
- _onStart_: Command has been received and started.
- _onDone_: Command has been completed. Receives the data from ffmpeg as the
first parameter.
- _onFileReceived_: Input file has been set on the client.

$3

The file that ffmpeg-webworker would be working with on issue of command.

$3

An instance of the web worker that has ffmpeg-js loaded in it.

$3

Converts the passed file to a file buffer array.

$3

Detects if the inputFile has been passed in correctly.

$3

Converts already set input file in the library to Buffer Array for processing

$3

Accepts a valid ffmpeg command to be run against the input file

$3

Logs messages to standard console.

This is the default exported property of the module. It ease the interaction
with the already initialized and loaded ffmpeg webworker Javascript library.

Other exported modules are:

$3

The official web worker implementation that makes easier the loading of
ffmpeg-js and running command in a worker.

$3

Official listener for FFMPEGWebworker.

`js static
import { FFMPEGWebworkerClient } from "ffmpeg-webworker";

const webworkerClient = new FFMPEGWebworkerClient();

// The above is same as
// import webworkerClient from "ffmpeg-webworker";

webworkerClient.on("ready", () => {
console.log("FFMPEG has been loaded, and can receive commands");
});
``

Release Notes

1.0.0

- Supports all ffmpeg codecs

Initial Release:

- Setup for the library
- Only supports lib H246

Contributions

Github issues can be used to log bug reports, suggestions and improvements

You can fork, then send a pull request.

Thank you...

License

MIT

Credits

This library has been made possible with the awesome work by folks at
Ffmpeg.js