videojs-playlist's Introduction

videojs-playlist

A plugin to enable playlists in video.js

Maintenance Status: Stable

Installation
Inclusion
Basic Usage
License

Installation

Install videojs-playlist via npm (preferred):

$ npm install videojs-playlist

Or Bower:

$ bower install videojs-playlist

Inclusion

Include videojs-playlist on your website using the tool(s) of your choice.

The simplest method of inclusion is a <script> tag after the video.js <script> tag:

<script src="path/to/video.js/dist/video.js"></script>
<script src="path/to/videojs-playlist/dist/videojs-playlist.js"></script>

When installed via npm, videojs-playlist supports Browserify-based workflows out of the box.

Basic Usage

For full details on how to use the playlist plugin can be found in the API documentation.

var player = videojs('video');

player.playlist([{
  sources: [{
    src: 'http://media.w3.org/2010/05/sintel/trailer.mp4',
    type: 'video/mp4'
  }],
  poster: 'http://media.w3.org/2010/05/sintel/poster.png'
}, {
  sources: [{
    src: 'http://media.w3.org/2010/05/bunny/trailer.mp4',
    type: 'video/mp4'
  }],
  poster: 'http://media.w3.org/2010/05/bunny/poster.png'
}, {
  sources: [{
    src: 'http://vjs.zencdn.net/v/oceans.mp4',
    type: 'video/mp4'
  }],
  poster: 'http://www.videojs.com/img/poster.jpg'
}, {
  sources: [{
    src: 'http://media.w3.org/2010/05/bunny/movie.mp4',
    type: 'video/mp4'
  }],
  poster: 'http://media.w3.org/2010/05/bunny/poster.png'
}, {
  sources: [{
    src: 'http://media.w3.org/2010/05/video/movie_300.mp4',
    type: 'video/mp4'
  }],
  poster: 'http://media.w3.org/2010/05/video/poster.png'
}]);

// Play through the playlist automatically.
player.playlist.autoadvance(0);