Video title changing with playlist
Hi,
I'm trying to change the innerHTML of a div with the title of the playlistItem of file currently playing.
I try to integrate wit on('playlistItem'):
<!DOCTYPE HTML>
<html>
<head>
<meta charset="windows-1252">
<title>
TEST
</title>
<script type="text/javascript" src="./jwplayer724/jwplayer.js"></script>
<script type="text/javascript">jwplayer.key="MY KEY";</script>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function loadMe(playerInstance, whattoplay){
var setup = {file: 'temp_blank.mp4', height : 540, width : 960, autostart:true,preload : "auto",fallback : true,skin: {name: "stormtrooper", active: "#558000", inactive: "#fff"}};
playerInstance.setup (setup);
playerInstance.load(whattoplay);
playerInstance.on('ready', playerInstance.play());
}
</script>
</head>
<body>
<div id="title">Show me what's playing</div>
<div id="mediaspace">
</div>
<a href='#' onmouseup="loadMe(playerInstance, [{file:'video1.mp4', title:'VIDEO 1'},{file:'video2.mp4', title:'VIDEO 2'}])">This is a Playlist</a>
<br />
<a href='#' onmouseup="loadMe(playerInstance, {file:'video3.mp4', title:'VIDEO 3'})">This is a File</a>
<script type='text/javascript'>
var playerInstance=jwplayer("mediaspace");
playerInstance.on('playlistItem', document.getElementById('videotitle').innerHTML=playerInstance.getPlaylistItem()['title'])
</script>
</body>
</html>
I think that my .on('playlistItem') is not called on the right place, but I can't get it to be triggered on each playlist item changing. If it is set right after the on('ready') of my function, it's only triggered on the first item.
Thanks,
Francis
