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"}
Of course the media source can be also "m3u8" or "mpd" playlist URL and appropriate media type. Can be also a list of multiple mp4 media files, with different resolution, e.g.
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" }
You can include even more information for a media item, like poster image, subtitle tracks, chapters track, meta title and meta description, e.g.
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"
}
Single track can be defined as follow:
Code snippet
track:{ kind:"chapters",src:"//domain.com/chapters.vtt",srclang:"en" }