$( document ).ready( function() 
{
	$( ".chapter-1, .chapter-2, .chapter-3, .chapter-4, .chapter-5" ).live( "click", function()
	{	
		GenericVideoLoader( "video-player", $( this ).attr( "class" ) + ".flv", "", 672, 390 );	
		
		var title = $( this ).find( "img" ).attr( "alt" );
		$( "h2.chapter-title" ).text( title );
	});
	
	$( ".full-video" ).live( "click", function()
	{	
		GenericVideoLoader( "video-player", $( this ).attr( "class" ) + ".flv", "", 672, 390 );	
		$( "h2.chapter-title" ).text( "The Domicile Story" );
	});
	
	$( ".360view" ).click( function()
	{
		RenderView( "saw360.flv" );
	});
	
	$( "#projects-nav > li" ).hover( 
		function() 
		{ 
			var position = $( "#projects-nav > li" ).index( this ); 
			showProjectIcon( position ); 
			showMapInfo( position ); 
		}, 
		function() 
		{ 
			var position = $( "#projects-nav > li" ).index( this ); 
			hideProjectIcon( position ); 
			hideMapInfo( position ); 
		}
	);
});

function showProjectIcon( position ) 
{ 
	$( "#projects-over > li:eq(" + position + ")" ).show(); 
} 
 
function hideProjectIcon( position ) 
{ 
	$( "#projects-over > li:eq(" + position + ")" ).hide(); 
} 

function showMapInfo( position ) 
{ 
	$( ".map-info > ul > li:eq(" + position + ")" ).show(); 
} 
 
function hideMapInfo( position ) 
{ 
	$( ".map-info > ul > li:eq(" + position + ")" ).hide(); 
} 

var flashVersionRequired = "9";
var flashMovie;

function VideoBox( videoFile )
{
	var inner = CreatePopup( "auto", "auto", "video-box" );
	
	var header = $( "<div />" );
	header.attr( "class", "video-header" );
	header.append( "<h3>A message from John Doran</h3>" );
	header.append( "<h2 class='chapter-title'>A passion for building</h2>" );
	header.append( "<h2 class='chapters'>Chapters</h2>" );
	
	var video = $( "<div />" );
	video.attr( "id", "video-container" );
	video.append( "<div id='video-player'></div>" );
	
	var playlist = $( "<div />" );
	playlist.attr( "class", "video-playlist" );
	playlist.append( "<div class='chapter-1'><img src='inc/images/chapters/chapter-1.gif' alt='A passion for building'>Passion</div>" );
	playlist.append( "<div class='chapter-2'><img src='inc/images/chapters/chapter-2.gif' alt='The right neighbourhoods'>Neighbourhoods</div>" );
	playlist.append( "<div class='chapter-3'><img src='inc/images/chapters/chapter-3.gif' alt='Inspired by great cities'>Inspiration</div>" );
	playlist.append( "<div class='chapter-4'><img src='inc/images/chapters/chapter-4.gif' alt='An award-winning team'>Care</div>" );
	playlist.append( "<div class='chapter-5'><img src='inc/images/chapters/chapter-5.gif' alt='An urban lifestyle'>Lifestyle</div>" );	
	playlist.append( "<div class='full-video'>Watch Full Video</div>" );
	
	inner.append( header );
	inner.append( video );
	inner.append( playlist );
	
	GenericVideoLoader( "video-player", videoFile, "", 672, 390 );
}

function RenderView( videoFile )
{
	var inner = CreatePopup( "auto", "auto", "render-box" );
	
	var header = $( "<div />" );
	header.attr( "class", "video-header" );
	header.append( "<h3>A 360º View of Second Avenue West</h3>" );
	
	var video = $( "<div />" );
	video.attr( "id", "render-container" );
	video.append( "<div id='video-player'></div>" );
	
	inner.append( header );
	inner.append( video );
	
	GenericVideoLoader( "video-player", videoFile, "..", 540, 360 );	
}

function GenericVideoLoader( id, videoFile, path, width, height )
{
	swf = LoadFlash(
		swfobject,
		id,
		path + "/inc/interactive/player.swf",
		path + "/inc/interactive/expressInstall.swf",
		width,
		height,
		{ 
			width: "672",
			height: "390",
			
			backcolor: "000000",
			frontcolor: "cccccc",
			
			file: "/inc/media/video/" + videoFile,
			volume: 50,
			autostart: "true",
			repeat: "false",
			fullscreen: "true"		
		}
	);	
}

//================================================================================
// Flash loading 
//================================================================================

function LoadFlash( swfobject, id, flashFile, xiFile, width, height, flashVars )
{
	var params = {};

	params.wmode				= "transparent";
	params.allowscriptaccess	= "always";
	params.allowfullscreen		= "true";
	params.scale				= "showAll";

	var attributes = {};

	attributes.id				= id;
	attributes.name				= id;

	

	swfobject.embedSWF( flashFile, id, width, height, flashVersionRequired, xiFile, flashVars, params, attributes );

	return( document.getElementById( id + "-jsswf" ) );
	
}