Nuevo playlist javascript functions

Control the playlist programmatically

Playlist developed and designed by Nuevodevel.com features several public functions that allow you to manage playlist media items programmatically via javascript. You can navigate between media items (next or previous), start playback from the first index, or jump to the last. You can append a new media item to the end of the playlist, insert it before or after the existing item index, remove a playlist item, or even replace the existing playlist with a new one.

Playlist functions available to use

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 the media source(s) url. However, you should also include the thumb image, media title, and duration at a 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 the poster image, subtitle tracks, chapters track, media title, and 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" }