video-js v0.7.0

#Video

A lightweight library that allows you to easily play and control social network videos using the new HTML5 <video> tag. Videos can be played, stopped, paused, and more all with simple html markup or with javascript.

Supports Youtube videos currently. More players will be added soon.

This library aims to mimick the methods and properties of HTML5's new <video> tag to offer a simple, easy-to-use API which can be a lot easier when there are already so many video API's to deal with (i.e. Youtube, Facebook, Vine, Vimeo, etc).

Usage

You can quickly start using the Video class as a standalone package, by using one of the pre-built javascript files. Alternatively, you can also use the source files directly if you are running your own build processes.

Setup a Youtube Video

Suppose you have the following HTML in the DOM (A Youtube Video).

<video width="640" height="360">
    <source type="video/youtube" src="http://www.youtube.com/watch?v=ye82js0sL32" />
</video>

Load and play the video

To start controlling the video with javascript all you need is one of the video files and instantiate a new instance, passing it a <video> element. Once instantiated, the instance exposes the same methods that are available on the new HTML5 <video> element.

This example assumes you already have the Video class loaded as a dependency assigned to a YoutubeVideo variable.

// start a youtube video
var video = new YoutubeVideo({
    el: document.getElementsByTagName('video')[0]
})

video.load(function () {
    video.play();
    video.pause();
});

Listen to the video's events

You can also subscribe to MediaEvents just as you would with a <video> element.

video.addEventListener('play', function () {
    // video has started!
});

video.addEventListener('ended', function () {
    // video has finished!
});