//  c r 3 a t i v e . c o . u k
	//  js api player for youtube
	
	// Initialise set some global variables
	// The cause, and solution, to all problems!
	
	x = 0;
	debug = 0;
	c = 0;
	
	function onYouTubePlayerReady(playerId) {
		// The player itself calls this function.
		// Wait for both players to work before starting buffering.

		// x tells us how many players are ready. we want two ready before continuing.
		x++;
		ytplayer = document.getElementById("myytplayer");
		ytplayer2 = document.getElementById("myytplayer2");
		
		if (x == 1) {
			// Okay, the first player is initialised. give it the video to start buffering.
			ytplayer.loadVideoByUrl("http://www.youtube.com/v/7aHTNEQyKYA");
			// Don't actually play it yet though.
			ytplayer.pauseVideo();
		}
	   if (x == 2) {
			// As above
			ytplayer2.loadVideoByUrl("http://www.youtube.com/v/pnpy9gc1H9E");
			ytplayer2.pauseVideo();
			// But this time start the buffering function (which is just at timer)
			buffers();
			setTimeout("changeVolumeAndPlay()", 2500);
		}
	}
    
	function changeVolumeAndPlay() {
		// This is called when we've decided it's buffered enough.
		// This is 2.5 seconds, dictated by setTimeout in onYouTubePlayerReady().
		// Statuses can be: unstarted (-1), ended (0), playing (1), paused (2), buffering (3), video cued (5).
		
		status1 = ytplayer.getPlayerState();
		status2 = ytplayer2.getPlayerState();
		
		if (status1 == 2 && status2 == 2) {
			// Okay, both videos are paused, and ready to play.
			// Mute the foreground video.
			ytplayer.setVolume(0);
			// Make sure the background video is turned up.
			ytplayer2.setVolume(100);
			// Set both playing. Hopefully, in sync!
			ytplayer.playVideo(); 
			ytplayer2.playVideo();
			// Override the function that is changing the status text by simply setting the guessed status above 100%
			// This is a fallback to be honest -- modern browsers will render the % changing in time, but older computers
			// might struggle. This helps them out.
			c = 101;
			// Set the status bar to a play/pause toggle.
			ustatus("<a href=\"javascript:pause();void(0)\">pause</a>");
		} else {
			// Oops, something's not ready on the Youtube players. Try again in 500msec.
			ustatus("buffering...");
			setTimeout("changeVolumeAndPlay()", 500);
		}
	}
	
	function buffers() {
		c++;
		if (c < 100) {
			// The status text goes from 0 to 100.
			// function changeVolumeAndPlay stops this fakery shenanigans by setting c to 101
			ustatus("contacting youtube..." + c + "%");
			// Do all this again in 25msec
			setTimeout("buffers()", 25);
		}
	}
	
	function pause() {
		// Tell the JS API to pause both videos, swap out the status text.
		ytplayer.pauseVideo();
		ytplayer2.pauseVideo();
		ustatus("<a href=\"javascript:playit();void(0)\">play</a>");
	}
	 
	function playit() {
		// Tell the JS API to play both videos, swap out the status text.
		ytplayer.playVideo();
		ytplayer2.playVideo();
		ustatus("<a href=\"javascript:pause();void(0)\">pause</a>");
	}
	 
	function state2status(state) {
		// Convert the status number to text.
		// States can be: unstarted (-1), ended (0), playing (1), paused (2), buffering (3), video cued (5).
		switch(state) {
			case -1:
				return "unstarted";
			break;
			case 0:
				return "ended";
			break;
			case 1:
				return "playing";
			break;
			case 2:
				return "paused";
			break;
			case 3:
				return "buffering";
			break;
			case 5:
				return "cued";
			break;
			default:
			return "unknown";
			break;
		}
	}
	 
	function ustatus(statstr) {
		// Update the status. 
		// Debug will show an extra line about how the players are doing. Fancy, eh?
		pstatus = "debug: Player 1: " + state2status(ytplayer.getPlayerState()) + " &bull; Player 2: " + state2status(ytplayer2.getPlayerState());
		document.getElementById("status").innerHTML = "<h2>"+statstr+"</h2>";
		if (debug) {
			document.getElementById("status").innerHTML += "<h3>"+pstatus+"</h3>";
		}
	 }