vtt-live-edit
v1.0.7
Published
Live edit VTT subtitles (delay, sync, position, style...) on html5 native player
Downloads
58
Maintainers
Readme
vtt-live-edit
Live edit VTT subtitles (delay, sync, position, style...) on html5 native player.
Demonstration
Installation
npm install vtt-live-edit --save
Documentation
The library modify the currently showing subtitle track of a video (selected by the video id)
addOffset
Add an offset to the currently showing subtitle track. Default is 500ms.
addOffset(<video id> [, offset in second]);
removeOffset
Remove an offset to the currently showing subtitle track. Default is 500ms.
removeOffset(<video id> [, offset in second]);
moveLeft
Move the subtitle to the left. Default is 5%.
moveLeft(<video id> [, percent to move]);
moveRight
Move the subtitle to the right. Default is 5%.
moveRight(<video id> [, percent to move]);
moveUp
Move the subtitle up (line by line).
moveUp(<video id>);
moveDown
Move the subtitle down (line by line).
moveDown(<video id>);
setFontSize
Set the subtitles font size
setFontSize(<font size in px>);
setFontColor
Set the subtitles font color
setFontColor(<font color value>);
Usage
<video id="video">
<source src="video.mp4" type="video/mp4"/>
<track kind="subtitles" label="default" src="subtitle.vtt" default>
</video>
const vtt = require('vtt-live-edit');
// or import vtt from 'vtt-live-edit';
vtt.addOffset('video', 0.5); // Add 500ms offset
vtt.removeOffset('video', 0.5); // Remove 500ms offset
vtt.moveLeft('video', 5); // Move subtitle 5% left
vtt.moveRight('video', 5); // Move subtitle 5% right
vtt.moveUp('video'); // Move subtitle one line up
vtt.moveDown('video'); // Move subtitle one line down
vtt.setFontSize(20); // Set subtitle size to 20px
vtt.setFontColor('#bbb'); // Set subtitle size to #BBB
License
MIT