Nuevo playlist javascript functions
Control playlist programmatically
Playlist for video.js player developed and designed by Nuevodevel features several public functions that allows to manage playlist media items programmatically via javascript. You can navigate between media items (next or previous), start playback from first index or jump to last. You can append new media item to the end of the playlist, insert before or after existing item index, finally you can remove a playlist item or even replace existing entire playlist by new one.
Playlist functions available to use
We assume that videojs player, nuevo plugin and playlist are already defined and initialized. Variable name used to initialize video.js is "player" (can be any other name).Code snippet
player.playlist.next(); Play next item player.playlist.previous(); Play previous item player.playlist.first(); Play first item player.playlist.last(); Play last item player.playlist.currentItem(id); Play item by playlist id player.playlist.insert(mediaItem); Appen new media item to the end of the playlist player.playlist.insertBefore(mediaItem, id); Insert new media item before existing media item Id player.playlist.insertAfter(mediaItem, id); Insert new media item after existing media item Id player.playlist.remove(id); Remove playlist item by Id player.playlist.new(New_playlist); Load new playlist programmatically
Playlist media item definition
There are many ways to define playlist media The minimum required information is mthe edia source(s) url. However, you should also include the url of a playlist thumb image, media title and duration at minimum, e.g.Code snippet
var mediaItem = {src://www.domain.com/video.mp4, type:"video/mp4", thumb: //www.domain.com/thumb.jpg", title:"media title", duration: "03:20"}
Code snippet
var mediaItem={ sources:[ { src:"//www.domain.com/video_720.mp4",type:"video/mp4",label:"720p",res:"720"}, { src:"//www.domain.com/video_360.mp4",type:"video/mp4",label:"360p",res:"360",default:1}, { src:"//www.domain.com/video_240.mp4",type:"video/mp4",label:"240p",res:"240"} ], thumb:"www.domain.com/thumb.jpg",,title:'media title',duration:"03:20" }
Code snippet
var mediaItem = { src://www.domain.com/video.m3u8, type:"application/x-mpegURL", tracks:[ { kind:"captions",src:"//domain.com/en.vtt",srclang:"en",label:"English" }, { kind:"captions",src:"//domain.com/de.vtt",srclang:"de",label:"Deutsch" }, { kind:"chapters",src:"//domain.com/chapters.vtt",srclang:"en" } ], thumb: //www.domain.com/thumb.jpg", title:"media title", duration: "03:20", poster: "//domain.com/poster.jpg", metaDescription: "media description" }
Code snippet
track:{ kind:"chapters",src:"//domain.com/chapters.vtt",srclang:"en" }