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.

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

Playlist media item definition

There are many ways to define playlist media The minimum required information is media source(s) url. However, you should also include url of 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 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 follows:

Code snippet

   track:{ kind:"chapters",src:"//domain.com/chapters.vtt",srclang:"en" }