videojs-playlist-thumbs
Continous plays videos and display the list on a sidebar with thumbnail and title
Installation
npm install --save videojs-playlist-thumbs
Usage
To include videojs-playlist on your website or web application, use any of the following methods.
<script>
Tag
This is the simplest case. Get the script in whatever way you prefer and include the plugin after you include video.js, so that the videojs
global is available.
Documentation
videos
You should pass an array of objects with the following structure
var playlist = [
{
"src" : "https://www.youtube.com/watch?v=fk4BbF7B29w",
"type": "video/youtube",
"title": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
"thumbnail": "https://i.ytimg.com/vi/fk4BbF7B29w/hqdefault.jpg"
},
{
"src" : "http://vjs.zencdn.net/v/oceans.mp4",
"type": "video/mp4",
"title": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
"thumbnail": "https://i.ytimg.com/vi/nmcdLOjGVzw/hqdefault.jpg"
},
{
"src" : "https://www.youtube.com/watch?v=_gMq3hRLDD0",
"type": "video/youtube",
"title": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
"thumbnail": "https://i.ytimg.com/vi/_gMq3hRLDD0/hqdefault.jpg"
},
{
"src" : "https://www.youtube.com/watch?v=_wYtG7aQTHA",
"type": "video/youtube",
"title": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
"thumbnail": "https://i.ytimg.com/vi/_wYtG7aQTHA/hqdefault.jpg"
}
];
playlist options
hideSidebar
It just hides the side bar, but the playlist keeps working
upNext
Shows a legend on the first video of the list
hideIcons
Hides the buttons (next/prev) on the control bar
thumbnailSize
Size of the video thumbnail on the sidebar
items
Number of videos on the sidebar
License
MIT. Copyright (c) Emmanuel Alves / http://github.com/manelpb