var player = null;
var ready = false;
var seekReady = false;
var playheadInterval = 0;
var tooltip = null;

$(document).ready(function() {
	
	// embed chromless player
	var id = 'flash';
	//var src = 'pgfLv6-Qv0w'; 
	var params = {allowScriptAccess:"always"};
	var atts = {id:"my-player"};
	
	swfobject.embedSWF("http://www.youtube.com/apiplayer?video_id=" + src + "&version=3&enablejsapi=1", id, "100%", "100%", "9.0.0", "/flash/expressInstall.swf", null, params, atts);
	
	// player controls
	
	// play/pause button
	$('#play-pause-btn').click(function() {
		if(!ready) return;
		else playPause();
	});
	
	// seekbar
	$('#seekbar').click(function(e) {
		if(!seekReady) return;
		else {
			var localX = (e.pageX - $(this).offset().left) - 17;
			if(localX > $(this).innerWidth()) localX = $(this).innerWidth();
		
			var percent = localX / $('#seekbar').innerWidth();
			seekToPercent(percent);
		}
	});
	
	// mute button
	$('#mute-btn').click(function() {
		if(!ready) return;
		else toggleSound();
	});
	
	//////////// Video Gallery (Optional) ///////////
	// tooltip
	tooltip = document.createElement('div');
	
	with(tooltip.style) {
		id = 'tt';
		position = 'absolute';
		top = '0px';
		left = '0px';
		width = '118px';
		height = '73px';
		padding = '5px';
		background = 'url(data/images/tooltip-bg.png) top left no-repeat';
		zIndex = '45000';
		display = 'none';
	}
	
	document.body.appendChild(tooltip);
	
	$('#thumbnails li').mouseenter(function() {
		var o = $(this).offset();
		$(tooltip).html($(this).html()).css({'top':(o.top - 85) + 'px', 'left':((o.left - 64) + 22) + 'px'}).show();
	});
	
	$('#thumbnails li').mouseleave(function() {
		$(tooltip).hide();
	});
	////////////////////////////////////////////////
});

/************************************************ 
 * onYouTubePlayerReady:void                    *
 *                                              *
 * Called from the YouTube player API.          *
 * This player is ready for action!             *
 ************************************************
/                                              */
onYouTubePlayerReady = function() {
	player = document.getElementById('my-player');
	
	player.addEventListener("onStateChange", "onPlayerStateChange");
	ready = true;
}

/************************************************ 
 * onPlayerStateChange:void                     *
 *                                              *
 * Handle player state change.                  *
 ************************************************
/                                              */
onPlayerStateChange = function(s) {
	switch(s) {
		case -1: // unstarted
			return;
		case 0: // ended
			resetPlayer();
			return;
		case 1: // playing
			seekReady = true;
			$('#play-pause-btn').css('background-position', '0px -40px');
			playheadInterval = setInterval(updatePlayhead, 10);
			return;
		case 2: // paused
			$('#play-pause-btn').css('background-position', '0px 0px');
			clearInterval(playheadInterval);
			return;
		case 3: // buffering
			$('#play-pause-btn').css('background-position', '0px 0px');
			return;
		case 5: // video cued
			resetPlayer();
			ready = true;
			return;
	}
}

/************************************************ 
 * resetPlayer:void                             *
 *                                              *
 * Reset the player.                            *
 ************************************************
/                                              */
resetPlayer = function() {
	clearInterval(playheadInterval);
	$('#play-pause-btn').css('background-position', '0px 0px');
	$('#seekbar').css('background-position', '0px 0px');	
}

/************************************************ 
 * updatePlayhead:void                          *
 *                                              *
 * Update the seekbar.                          *
 ************************************************
/                                              */
updatePlayhead = function() {
	if(typeof(player.getCurrentTime) == 'undefined') {
		clearInterval(playheadInterval);
		return;
	}

	var percentage = player.getCurrentTime() / player.getDuration();
	$('#seekbar').css('background-position', Math.round(percentage * $('#seekbar').innerWidth()) + 'px 0px');
}

/************************************************ 
 * playPause:void                               *
 *                                              *
 * Toggle play/pause.                           *
 ************************************************
/                                              */
playPause = function() {
	switch(player.getPlayerState()) {
		case -1: // unstarted
		case 0: // ended
		case 2: // paused
			player.playVideo();
			return;
		case 1: // playing
			player.pauseVideo();
			return;
		default:
			return;
	}
}

/************************************************ 
 * seekToPercent:void                           *
 *                                              *
 * Seek to the passed percentage.               *
 *                                              *
 * percent:Number - percent to seek to.         *
 ************************************************
/                                              */
seekToPercent = function(percent) {
	var time = percent * player.getDuration();
	player.seekTo(time, true);
}

/************************************************ 
 * toggleSound:void                             *
 *                                              *
 * Toggle mute/unmute.                          *
 ************************************************
/                                              */
toggleSound = function() {
	if(player.isMuted()) {
		player.unMute();
		$('#mute-btn').css('background-position', '0px 0px');
	} else {
		player.mute();
		$('#mute-btn').css('background-position', '0px -40px');
	}
}

//////////// Video Gallery (Optional) ///////////

/************************************************ 
 * loadVideo:void                               *
 *                                              *
 * Load a new video into the player.            *
 *                                              *
 * id:String - video id to load.                *
 ************************************************
/                                              */
loadVideo = function(id) {
	if(!ready) return;
	
	ready = false;
	player.cueVideoById(id, 0, 'default');
}

/////////////////////////////////////////////////