Nietzsche's Preposterous Moustache

npm

Ready to take your JavaScript development to the next level? Meet npm Enterprise - the ultimate in enterprise JavaScript.Learn more »

artplayer-tool-thumbnail

3.1.15 • Public • Published

artplayer-tool-thumbnail

thumbnail tool for ArtPlayer

Demo

Checkout the demo from Github Pages

Install

Install with npm

$ npm install artplayer-tool-thumbnail

Or install with yarn

$ yarn add artplayer-tool-thumbnail
import ArtplayerToolThumbnail from 'artplayer-tool-thumbnail';

Or umd builds are also available

<script src="artplayer-tool-thumbnail"></script>

Will expose the global variable to window.ArtplayerToolThumbnail.

Usage

<input class="file" type="file" />
var thumbnail = new ArtplayerToolThumbnail({
    fileInput: document.querySelector('.file'),
    delay: 300,
    number: 60,
    width: 160,
    height: 90,
    column: 10,
});
 
// Dynamic configuration parameters, return the instance itself
thumbnail.setup({
    delay: 500,
    number: 100,
    width: 200,
    height: 10,
    column: 10,
});
 
// Start creating a preview, return the promise when the task completed
thumbnail.start();
 
// Start download preview, return the instance itself
thumbnail.download();
 
// Events
thumbnail.on('file', file => {
    console.log('The video file has been read successfully');
});
 
thumbnail.on('video', video => {
    console.log('Building a video player successfully');
    console.log('Now you can call the thumbnail.start()');
});
 
thumbnail.on('canvas', canvas => {
    console.log('Building a canvas successfully');
});
 
thumbnail.on('update', (url, percentage) => {
    console.log('Generating preview image, returning preview url and percentage');
});
 
thumbnail.on('done', () => {
    console.log('One task processing completed');
});
 
thumbnail.on('download', name => {
    console.log('Download the preview');
});

Example

<input class="file" type="file" />
var thumbnail = new ArtplayerToolThumbnail({
    fileInput: document.querySelector('.file'),
});
 
thumbnail.on('video', () => {
    thumbnail
        .setup({
            delay: 500,
            number: 100,
            width: 200,
            height: 10,
            column: 10,
        })
        .start()
        .then(() => {
            thumbnail.download();
        });
});

License

MIT © Harvey Zack

Keywords

install

npm i artplayer-tool-thumbnail

Downloadsweekly downloads

41

version

3.1.15

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability