
function monitorPlayer( player ) {
//	console.log( "playerId: ", player.playerId );
	state = $f( player.playerId ).getState();		// Possible values are unloaded (-1), loaded(0), unstarted (1), buffering (2), playing (3), paused (4), ended (5) 
	switch( state )
	{
		case -1:	// unloaded
			clearTimeout( player.timer );
			player.timer = null;
			break;

		case 3:		// playing
			$("img.playBtn").css( { "display" : "none" } );
			$("img.loadingGIF").css( { "display" : "none" } );
			break;
	}
	
	if( state != -1 )
	{
		setTimer( player );
	}
}

function clickFunc( playerParams )
{
	$( "#" + playerParams.splash ).click( function() {
		
		if( !($f( playerParams.playerId ).isLoaded()) )
		{
			$f( playerParams.playerId ).load();
		}
		else
		{
			if( !$f( playerParams.playerId ).isPlaying() )
			{
				$f( playerParams.playerId ).play();
			}
			else
			{
				$f( playerParams.playerId ).pause();
			}
		}
	});
}

function setTimer( player )
{
	player.timer = setTimeout( function() {
		monitorPlayer( player );
	}, 500 );
	
//	console.log( "timer: ", player.timer );
}

function onExpressInstallCancelled() {
        // Express Install was cancelled
}

function initInsertFunc( responseText, textStatus, XMLHttpRequest )
{
	var requiredFlashVersion = "10.0";		// version 9.115 required by flowplayer but express install will ask for v. 10.0 no matter what is specified here
	var requiredFlashVersionInstalled = true;

	if( !swfobject.hasFlashPlayerVersion( requiredFlashVersion ) ) {
		requiredFlashVersionInstalled = false;
		$('<div id="flashRequired">' +
				'This content requires Adobe Flash Player version ' + requiredFlashVersion + ' or higher.<br>' +
				'You currently have version ' + swfobject.ua.pv[0] + '.' + swfobject.ua.pv[1] + '.' + swfobject.ua.pv[2] + ' installed.<br>' +
				'Please click <a href="http://www.adobe.com/go/getflash">here</a> to install the latest version of Adobe Flash Player.' +
			'</div>'
		).appendTo( "#overlayContent" );
		
		var onBeforeLoadCB;
		var onCloseCB;
		if (swfobject.hasFlashPlayerVersion( "6.0.65" )) {		// version 6.0.65 required for flash express install
			var idForExpressInstallEmbed = "flashRequired";
			onBeforeLoadCB = function(){
				var att = {
					data: "swf/expressInstall.swf",
					width: "310",
					height: "225"
				};
				var par = {
					menu: false,
					bgcolor: "000000",
					wmode: "window"
				};
				swfobject.showExpressInstall(att, par, idForExpressInstallEmbed, onExpressInstallCancelled );
			};
			
			onCloseCB = function(){
				swfobject.removeSWF(idForExpressInstallEmbed);
			}
		}
		
		$("a[rel]").overlay( {
			closeOnClick: false,
			onBeforeLoad: onBeforeLoadCB,
			onClose: onCloseCB
		});
		
		$("a[rel]").overlay().load();
	}
		
	/* 
	//	Based on home page on flowplayer.org as of 2/10/09
	*/
	
	var prevIndex = 0;
	$("#outerTabContainer").scrollable({
		items: '#innerTabContainer',
		size: 4,
		prev: '.prevTab',
		next: '.nextTab',
		onSeek: function()  { 
		        // 'this' variable is a pointer to the scrollable API
				
				/** BEGIN of IMAGE SUBST **/
				/* Substitute background image of current and previous left-and right-most tabs such that the lines (part of the tab images) continue to connect neatly */
				/* Note:	the difference in images is very subtle and as such the substituion is not likely to be noticed even without animating from one image to the other */
				curIndex = this.getIndex();
				$("div#innerTabContainer div a#" + ($($("#innerTabContainer a")[curIndex]).attr( "id" )) ).css( "background-image", "url('img/tab left.png')" );
				$("div#innerTabContainer div a#" + ($($("#innerTabContainer a")[curIndex + this.getConf().size - 1]).attr( "id" )) ).css( "background-image", "url('img/tab right.png')" );
									
				if( curIndex > prevIndex )
				{
					$("div#innerTabContainer div a#" + ($($("#innerTabContainer a")[prevIndex + this.getConf().size - 1]).attr( "id" )) ).css( "background-image", "url('img/tab middle.png')" );
				}
				else if( curIndex < prevIndex )
				{
					$("div#innerTabContainer div a#" + ($($("#innerTabContainer a")[prevIndex]).attr( "id" )) ).css( "background-image", "url('img/tab middle.png')" );
				}
				
				prevIndex = this.getIndex();
				/** END of IMAGE SUBST **/
		    }
	});
	

	/*
	//	tabbed navigation uses our jquery.scrollable tool, see http://flowplayer.org/tools/scrollable.html
	*/
	$("#tab_panes").scrollable({
		items: '#items',
		size: 1, 
		navi: '#innerTabContainer',
		onBeforeSeek: function() {
			if( requiredFlashVersionInstalled )
			{
				if( $f().isLoaded() )
				{
					$f().hide();
					$f().unload();
				}
				this.getItems().show();				
			}
		}
	});
	
	var playerConfigs =	[	{ playerId: 'player1', splash: 'player1Splash', source: 'MediaPlayer/TabbedPlayer/Audioblog/Heavenly Protection.mp3', timer: null },
							{ playerId: 'player2', splash: 'player2Splash', source: 'MediaPlayer/TabbedPlayer/Audioblog/BabyLove2.mp3', timer: null },
							{ playerId: 'player3', splash: 'player3Splash', source: 'MediaPlayer/TabbedPlayer/Audioblog/TwinPhoenixDragon Rev.mp3', timer: null },
							{ playerId: 'player4', splash: 'player4Splash', source: 'MediaPlayer/TabbedPlayer/Audioblog/Obama Birth Chart and Face Reading.mp3', timer: null },
							{ playerId: 'player5', splash: 'player5Splash', source: 'MediaPlayer/TabbedPlayer/Audioblog/On President Hu Jintao.mp3', timer: null },
							{ playerId: 'player6', splash: 'player6Splash', source: 'MediaPlayer/TabbedPlayer/Audioblog/On President Ma Ying-jeou.mp3', timer: null }						
						];
	

	for( i=0; i < playerConfigs.length; i++ )
	{
		if (requiredFlashVersionInstalled) {
			$f(playerConfigs[i].playerId, {
				src: v.core
			
			//					version: [9, 115],
			
			//					expressInstall: 'http://flowplayer.org/swf/expressinstall.swf',		// cannot use expressInstall since flash window is too small to display express install dialog
			
			
			//					onFail: function() {
			//					}
			
			}, {
				onFinish: function(){
					this.hide();
					this.unload();
//					console.log( "player - onFinish" );
				},
				
				onUnload: function(){
					$("img.playBtn").css({
						"display": "block"
					});
					$("img.loadingGIF").css({
						"display": "none"
					});
//					console.log( "player - onUnload" );
					
//					console.log( "unload timer: ", this.timer );
					if (this.timer != null) {
						clearTimeout(this.timer);
						this.timer = null;
					}
				},
				
				onLoad: function(){
					$("img.loadingGIF").css({
						"display": "block"
					});
//					console.log( "player - onLoad" );
					this.play(); // this fixes no play when clicking anywhere else on control bar but its play button, provided it hasn't been loaded yet (note: may set clip.auto-play: true instead!)
					setTimer(this);
				},
				
				onStart: function(){
					$("img.playBtn").css({
						"display": "none"
					});
					$("img.loadingGIF").css({
						"display": "none"
					});
//					console.log( "player - onStart" );
				},
				
				// fullscreen button not needed here 
				plugins: {
					controls: {
						fullscreen: false,
						height: 24
					},
					
					audio: {
						url: v.audio
					}
				},
				
				clip: {
				
					url: playerConfigs[i].source,
					
					autoPlay: false,
					
					onBeforeBegin: function(){
						this.close(); // hide canvas
//						console.log( "onBeforeBegin" );
					},
					
					onBegin: function(){
						$("img.loadingGIF").css({
							"display": "block"
						});
//						console.log( "onBegin" );
					},
					
					onPause: function(){
						$("img.playBtn").css({
							"display": "block"
						});
//						console.log( "onPause" );
					},
					
					onResume: function(){
						$("img.playBtn").css({
							"display": "none"
						});
//						console.log( "onResume" );
					}
				}
			});
			$f.extend($f(playerConfigs[i].playerId), playerConfigs[i]); // extend(): adds new properties to player instance
			clickFunc(playerConfigs[i]);
		}
		else
		{
			$( "#" + playerConfigs[i].playerId + ", #" +  playerConfigs[i].splash ).click( function() {
				$("a[rel]").overlay().load();
			});
		}	
	}
	
	
	// enable hover effect via jQuery so that it works in IE (and all other browsers) without having to specify the HREF attribute of the tab anchors
	$("div#innerTabContainer div a.tabLink").hover(
	  function () {
	    $(this).addClass("tabHover");
	  },
	  function () {
	    $(this).removeClass("tabHover");
	  }
	);
	
	// do similar as above for next/prevTab etc. anchors
	$("a.prevTab, a.nextTab, a.prevTabPage, a.nextTabPage").hover(
	  function () {
	    $(this).addClass("nextPrevHover");
	  },
	  function () {
	    $(this).removeClass("nextPrevHover");
	  }
	);	

	$("a.player").hover(function() {
		$("img", this).fadeTo(400, 1); 			
	}, function() {
		$("img", this).fadeTo(400, 0.5);
		
	}).find("img").css({opacity:0.7});
}
