A node wrapper for vtt.js
node-vtt is on
npm. To install run:
$ npm install node-vtt
You'll need to install
PhantomJS if you haven't already. You can download
it from its website or simply use npm:
$ npm install -g phantomjs
Or include it in your
node-vtt has a simple async API:
var NodeVTT = require"node-vtt"nodeVTT = ;nodeVTTinitnodeVTTparseFile"someVTTFile"if error// Do something with error.// Do something with the vtt we parsed.var vtt = nodeVTTvtt;nodeVTTprocessParsedDataif error// Do something with error.console.logdivs;;;;
node-vtt uses PhantomJS to run
vtt.js on a web
page. Therefore, you need to have a simple HTML file for
node-vtt to load. There
is a default one provided for you, so read no further if you're not interested in
customizing the page it uses.
If you provide your own page the page must have a few things.
It must have the
VTTRegion shims provided by
vtt.js. Doing this is most easily accomplished
by using the
vtt.js bower distributable and including it as a script on the
page. However, if you want more granularity in what is included on the page from
vtt.js you can also
npm install vtt.js and have access to the individual
source files through that.
The page must also have the
VTTRegion shims on the page.
If you'd like to run the processing model the page must have a
div element on it
id property of
overlay and a positioning of
this div as the container to display subtitles.
See the default page provided for you for more information.
Once you've created your own customized page check out how you can load it with the init function.
cues property contains an array of the aggregated
VTTCues that have been
parsed from a WebVTT file. Calling clear will empty the
var cues = nodeVTTcues;
regions property contains an array of the aggregated
VTTRegions that have been
parsed from a WebVTT file. Calling clear will empty the
var regions = nodeVTTregions;
vtt property contains an object that is the
This provides an easy way to get all the
VTTRegions data parsed
from a file.
var vtt = nodeVTTvttcues = vttcuesregions = vttregions;
var errors = nodeVTTerrors;
node-vtt object. It optionally takes an options object that
can contain two config properties—
uri points at a custom
page that you want
node-vtt to load and run on. The page must have the WebVTT
vtt.js included on the page as well as the shims for VTTCue
(extended) and VTTRegion (extended). If you don't want to pass a
uri a default
page will be provided for you. The
encoding property specifies the encoding of the
data that you want to parse.
node-vtt currently supports two types—
If you'd like to make a custom page for
node-vtt to work with then check out
more information on that here.
Using the default config of type
utf8 and the basic page provided for you.
nodeVTTinitif errorreturn console.logerrormessage;// Run some node-vtt code.;
Or with an options object:
nodeVTTinit uri: "my-web-page.html" encoding: "string"if errorreturn console.logerrormessage;// Run some node-vtt code;
node-vtt down. This is necessary as
node-vtt will keep a
instance alive until this method is called.
data as a chunk of WebVTT data.
data can either be a UTF8 Node ArrayBuffer
or a string. Make sure to call init or
setupParser with the appropriate encoding specified
before calling this function.
onParsed will return an error object that
message property if an error occured. The parsed VTTCues and VTTRegions are
aggregated on the
node-vtt object itself and can be accessed via the vtt,
cues, or regions properties.
var fs = require"fs"data = fsreadFileSync"vtt-file";nodeVTTparsedataif errorreturn console.logerrormessage;var vtt = nodeVTTvtt;;
nodeVTTparseFile"vtt-file"if error// Do somethingvar vtt = nodeVTTvtt;;
Flushes the parser. This indicates that no more data will be coming to the parser
and so it should parse any unparsed data it may have. This is necessary when parsing
stream data. See flush on
onFlush will return an error if something went
wrong, otherwise, it will return nothing.
nodeVTTparsedatanodeVTTparsemoreDatanodeVTTflushif errorconsole.logerrormessage;var vtt = nodeVTTvtt;;;;
Runs the processing level
steps of the WebVTT specification over the cues contained in
be an object with a
cues property on it that is an array
VTTCues that should be processed. This turns the cues and regions into a
div elements that have CSS and positioning applied to them and are ready
to be shown on a video. These divs will be returned through the
callback and will also be automatically added as child elements to the
overlay div is a div used as a container for the subtitles. This overlay
div comes from the page that
node-vtt loaded with the init
function. The div on the page must have an
id property set to 'overlay'.
var data =cuse: /* VTTCues go in here */;nodeVTTprocessParsedDatadataif errorreturn console.logerrormessage;// Do something with divs.;
Note: Processing regions isn't supported yet by
vtt.js. It will be in the
If you have just used the same instance of
node-vtt to parse some data you
can leave out the
data parameter. The default is for it to use the
regions that it has aggregated already.
nodeVTTparseFile"vtt-file"// Leave out that 'data' parameter as we just parsed some WebVTT and we can use// the VTTCues and VTTRegions aggregated by this nodeVTT instance in its cues// and regions properties.nodeVTTprocessParsedDataif errorreturn console.logerrormessage;// Do something with divs.;;
A version of processParsedData except that it will read and parse the WebVTT data contained within the file and process it for you in one go.
nodeVTTprocessFile"vtt-file"if errorreturn console.logerror;// Do something with divs;
This enables you to start parsing a new set of WebVTT data without creating a
node-vtt object which is epensive since it has to start
and establish a connection.
nodeVTTclearif errorconsole.logerrormessage;// Ready to do some more parsing.;
clear is only necessary if you want to parse a new set of
WebVTT data. You do not need to call it if you're just calling the processing
Clears the current state of
node-vtt, see clear, and sets up a
new parser that is configured to parse the
encoding specified. Only
utf8 are currently supported for encodings. If you don't pass
this function has the exact same behaviour as clear.
nodeVTTsetupParser"string"var data = "WEBVTT\n00:00.000 --> 00:01.000\nI'm a Cue!";nodeVTTparsedataconsole.lognodeVTTvtt;;;
The error objects returned by
node-vtt are simple JS objects with a
on them describing the error.
Apache v2.0. See LICENSE.