utube

Youtube video player class.

Install:

$ npm i utube

Usage:

Using data attribute for options.

<div class="player" data-utube-options='{"id": "oBbXxfZYTAA"}'></div>

var UTube = require('utube');
var player = new UTube(document.querySelector('.player'));

Options as a parameter.

<div class="player"></div>

var UTube = require('utube');
var player = new UTube(document.querySelector('.player'), {'id': 'oBbXxfZYTAA'});

Options:

Options are mainly passed directly to the YouTube API, we have set some defaults but you can override them.

id

Type: String
Default: null

YouTube video ID.

dispatch:

Type: Array of Number
Default: [25, 50, 75, 100]

Percentage points at which to dispatch utube events. PLAYING, PAUSE and ENDED events are also automatically dispatched.

window.addEventListener('utube', function (e) {
	console.log(e.detail);
});

wmode:

Type: String
Default: opaque

WMode for flash version of the player.

autohide:

Type: Number
Default: 1

See YouTube API - autohide.

autoplay:

Type: Number
Default: 1

See YouTube API - autoplay.

cc_load_policy:

Type: Number
Default: 0

See YouTube API - cc_load_policy.

color:

Type: String
Default: white

See YouTube API - color.

controls:

Type: Number
Default: 1

See YouTube API - controls.

disablekb:

Type: Number
Default: 0

See YouTube API - disablekb.

enablejsapi:

Type: Number
Default: 1

See YouTube API - enablejsapi.

end:

Type: Number
Default: null

See YouTube API - end.

fs:

Type: Number
Default: 1

See YouTube API - fs.

iv_load_policy:

Type: Number
Default: 3

See YouTube API - fs.

loop:

Type: Number
Default: 0

See YouTube API - fs.

modestbranding:

Type: Number
Default: 1

See YouTube API - modestbranding.

origin:

Type: String
Default: document.domain

See YouTube API - origin.

playsinline:

Type: Number
Default: 0

See YouTube API - playsinline.

rel:

Type: Number
Default: 0

See YouTube API - rel.

showinfo:

Type: Number
Default: 0

See YouTube API - showinfo.

start:

Type: Number
Default: null

See YouTube API - start.

theme:

Type: String
Default: dark

See YouTube API - theme.