Awesome
Media Preview plugin for FilePond (+PDF)
The Media Preview plugin will kick in automatically when the uploaded file is of type video or audio and render a preview player inside the file item. For pdf files it will use the PDF.js native renderer.
<img src="https://github.com/nielsboogaard/filepond-plugin-media-preview/blob/master/demo.gif?raw=true" width="508" alt=""/>Quick Start
Install using npm:
npm install ernestbrandi/filepond-plugin-media-preview
Then import in your project:
import * as FilePond from "filepond";
import FilePondPluginMediaPreview from "filepond-plugin-media-preview";
Register the plugin:
FilePond.registerPlugin(FilePondPluginMediaPreview);
Create a new FilePond instance as normal.
const pond = FilePond.create({
name: "filepond",
});
// Add it to the DOM
document.body.appendChild(pond.element);
The preview will become active when uploading an video or audio file.
Default styles
Be sure to include this lib's styles, by importing the minified css.
import "filepond-plugin-media-preview/dist/filepond-plugin-media-preview.min.css";