Loading new playlist (Pt.2)
Hi
My previous thread with a question is closed apparently so I cannot continue posting follow-up question there...
A user named Todd tried to help me.
https://support.jwplayer.com/customer/portal/questions/17021832-load-new-playlist
I did as he suggested and it works, but it also disables two other features I had.
So This example works:
----------------------------------
<a href="javascript:loadPlaylist(playlistOne)">Playlist One</a><br/>
<a href="javascript:loadPlaylist(playlistTwo)">Playlist Two</a><br/>
<div id="container"> </div>
<ol id="list"> </ol></div>
<script type="text/javascript">
var playlistOne = [{
title: "Orbs",
file: "https://youtu.be/l2ANM2vULoQ",
image: "https://i.ytimg.com/vi/l2ANM2vULoQ/hqdefault.jpg?custom=true&w=120&h=90&jpg444=true&jpgq=90&sp=68", description: "Video One",
},{
title: "Ring",
file: "https://youtu.be/2LCNnio6aYs",
image: "Img.jpg",
description: " Video Two",
},{
title: "Nature",
file: "https://youtu.be/4_JNxbgTCdE",
image: "Img.jpg",
description: "Video Three",
}];
var playlistTwo = [{
title: "Underwater",
file: "https://youtu.be/AW07GZ5UzJc",
image: "Img.jpg",
description: "Video Four",
},{
title: "Gold dust",
file: "https://youtu.be/ENy-eY_92ko",
image: "Img.jpg",
description: "Video Five",
}];
//Create a function to load a playlist var
function loadPlaylist(thePlaylist) {
jwplayer().load(thePlaylist)
}
var playerInstance = jwplayer("container");
playerInstance.setup({
playlist: playlistOne
});
var list = document.getElementById("list");
var html = list.innerHTML;
playerInstance.on('ready',function(){
var playlist = playerInstance.getPlaylist();
for (var index=0;index<playlist.length;index++){
var playindex = index +1;
html += "<li><a href='javascript:playThis("+index+")'><img alt='"+playlist[index].title+"'src='" + playlist[index].image + "'/>"+playlist[index].title+"</a><span>"+playlist[index].description+"</span><div style='clear:both'></div></li>"
list.innerHTML = html;
}
});
function playThis(index) {
playerInstance.playlistItem(index);
}
</script>
-------------------------
I can now click the link to load up a new playlist
BUT....
The Playlist bar beneath the player is not updating. It keeps the first loaded playlist listed.
It must be because of this:
-----------------------
var playerInstance = jwplayer("container");
playerInstance.setup({
playlist: playlistOne
});
-----------------------
PlaylistOne is selected. Perhaps there should be a variable instead... somehow?
SECOND
I can no longer use the window player specific setup.
-----------------------
displaytitle: true,
width: "100%",
aspectratio: "16:9",
-----------------------
This allowed me to set the width in either percent or fixed size and also let me chose an aspect ratio.
It breaks the video player wherever I put this code....
Thanks
