Ik heb een pagina met php/javascript die eerst altijd op mijn website staat en werkte altijd perfect.
Speelt ieder YouTube filmpje af die je wilt.
Nu heb ik de pagina op mijn xampp server gezet omdat mijn webhost binnen kort verloopt.
Alleen op mijn xampp server speelt ie maar de helft van de filmpjes af.
Bij de filmpjes die ie niet afspeelt krijg ik van uit YouTube api error code 0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>YouTube Player API Sample</title>
<style type="text/css">
#videoDiv {
margin-right: 3px;
}
#videoInfo {
margin-left: 3px;
}
</style>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load("swfobject", "2.1");
</script>
<script type="text/javascript">
/*
* Chromeless player has no controls.
*/
// Update a particular HTML element with a new value
function updateHTML(elmId, value) {
document.getElementById(elmId).innerHTML = value;
}
// This function is called when an error is thrown by the player
function onPlayerError(errorCode) {
alert("An error occured of type:" + errorCode);
}
// This function is called when the player changes state
function onPlayerStateChange(newState) {
updateHTML("playerState", newState);
}
// Display information about the current state of the player
function updatePlayerInfo() {
// Also check that at least one function exists since when IE unloads the
// page, it will destroy the SWF before clearing the interval.
if(ytplayer && ytplayer.getDuration()==0){
playVideo();
//alert("play");
}else if(ytplayer && ytplayer.getDuration) {
updateHTML("videoDuration", ytplayer.getDuration());
updateHTML("videoCurrentTime", ytplayer.getCurrentTime());
updateHTML("bytesTotal", ytplayer.getVideoBytesTotal());
updateHTML("startBytes", ytplayer.getVideoStartBytes());
updateHTML("bytesLoaded", ytplayer.getVideoBytesLoaded());
updateHTML("volume", ytplayer.getVolume());
}
}
// Allow the user to set the volume from 0-100
function setVideoVolume() {
var volume = parseInt(document.getElementById("volumeSetting").value);
if(isNaN(volume) || volume < 0 || volume > 100) {
//alert("Please enter a valid volume between 0 and 100.");
}
else if(ytplayer){
ytplayer.setVolume(volume);
}
}
function setVideoVolume2(volume) {
if(isNaN(volume) || volume < 0 || volume > 100) {
//alert("Please enter a valid volume between 0 and 100.");
}
else if(ytplayer){
ytplayer.setVolume(volume);
}
}
function playVideo() {
if (ytplayer) {
ytplayer.playVideo();
}
}
function pauseVideo() {
if (ytplayer) {
ytplayer.pauseVideo();
}
}
function muteVideo() {
if(ytplayer) {
ytplayer.mute();
}
}
function unMuteVideo() {
if(ytplayer) {
ytplayer.unMute();
}
}
// This function is automatically called by the player once it loads
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById("ytPlayer");
// This causes the updatePlayerInfo function to be called every 250ms to
// get fresh data from the player
setInterval(updatePlayerInfo, 250);
updatePlayerInfo();
ytplayer.addEventListener("onStateChange", "onPlayerStateChange");
ytplayer.addEventListener("onError", "onPlayerError");
//Load an initial video into the player
ytplayer.cueVideoById(<?php if(isset($_GET['id'])){echo '"'.$_GET['id'].'"';}else{ echo '"2zNSgSzhBfM"'; } ?>);
}
// The "main method" of this sample. Called when someone clicks "Run".
function loadPlayer() {
// Lets Flash from another domain call JavaScript
var params = { allowScriptAccess: "always",autoplay: "1" };
// The element id of the Flash embed
var atts = { id: "ytPlayer" };
// All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
swfobject.embedSWF("http://www.youtube.com/apiplayer?" +
"version=3&enablejsapi=1&playerapiid=player1",
"videoDiv", (window.screen.availWidth - 20), (window.screen.availHeight - 20), "9", null, null, params, atts);
}
function _run() {
loadPlayer();
}
google.setOnLoadCallback(_run);
</script>
<style>
p{
color:yellow;
}
a{
color:yellow;
}
</style>
</head>
<body style="font-family: Arial;border: 0 none; background-color:black;">
<table>
<tr>
<td><div id="videoDiv" height="100%">Loading...</div></td>
<td valign="top">
<div id="videoInfo">
<p>Player state: <span id="playerState">--</span></p>
<p>Current Time: <span id="videoCurrentTime">--:--</span> | Duration: <span id="videoDuration">--:--</span></p>
<p>Bytes Total: <span id="bytesTotal">--</span> | Start Bytes: <span id="startBytes">--</span> | Bytes Loaded: <span id="bytesLoaded">--</span></p>
<p>Controls: <a href="javascript:void(0);" id="play" onclick="playVideo();">Play</a> | <a href="javascript:void(0);" onclick="pauseVideo();">Pause</a> | <a href="javascript:void(0);" onclick="muteVideo();">Mute</a> | <a href="javascript:void(0);" onclick="unMuteVideo();">Unmute</a></p>
<p><input id="volumeSetting" type="text" size="3" /> <a href="javascript:void(0)" onclick="setVideoVolume();"><- Set Volume</a> | Volume: <span id="volume">--</span></p><br/><a href="javascript:void(0);" onclick="updatePlayerInfo();">updatePlayerInfo</a>
</div>
</td></tr>
</table>
</html>
Alvast bedankt,
Pascal