I am creating a custom html5 player for youtube videos. I based it on the samples in the YouTube iframe API (https://developers.google.com/youtube/iframe_api_reference). As long as I am viewing it on a webserver, all of the javascript controls for pause/play/stop work fine in Chrome/FF/IE9, but the previous video in playlist/next video in playlist controls only work in Chrome and FF. in IE, I get a “This video is currently unavailable” (the first video in the playlist still plays just fine). This also happens if I try to switch to a specific video using its ID (loadVideoById).
I can see in the info bar at the top of the video that after I click “next video in playlist” it cycles through all the videos’ names – I assume it attempts to play each one and fails.
If I try to play any one of the videos in the playlist individually, it works fine.
When I return an array of all the videos in the playlist via the console/alert/whatever, everything expected is there. Code below:
<!doctype html>
<html>
<head>
<title>custom youtube player</title>
</head>
<body>
<div id="player"></div>
<br/>
<a onclick="player.playVideo();" href="#">play</a>
<br/>
<a onclick="player.pauseVideo();" href="#">pause</a>
<br/>
<a onclick="player.stopVideo();" href="#">stop</a>
<br/>
<a id="playPrev" onclick="player.previousVideo();" href="#">previous video in playlist</a>
<br/>
<a id="playNext" onclick="player.nextVideo();" href="#">next video in playlist</a>
<script type="text/javascript">
var tag = document.createElement('script');
tag.src = "//www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
playerVars: { 'showinfo': 1, 'controls': 1},
videoId: 'ZrG0WsDuriM',
events: {
'onReady': onPlayerReady
}
});
}
function onPlayerReady(event) {
event.target.playVideo();
event.target.loadPlaylist({listType: 'playlist', list: 'PL8D3EFFBB747B9769', suggestedQuality: 'small'});
}
</script>
</body>
</html>
For anyone who found this question, this issue was apparently a bug on the YouTube side and appears to have since been resolved.