/**
 * Onload
 **/

$( document ).ready( function( ) 
{	
	detectBrowser( );
	initializeTabs( );
	initializeScreenshots( );
	
	$("#install").click(function(event){
	    window.location.href = "http://go.microsoft.com/fwlink/?LinkID=124807";
	});
	
	$("#preorder").click(function(event){
        window.location.href = "#";
	});
});


function detectBrowser( )
{
	if ( navigator.appName == "Netscape" && !navigator.appVersion.match("WebKit") ) {
		$( "#container #header" ).css( "margin-left", -10 );
		$( "#container #content" ).css( "margin-left", 20 );
	}
}


/**
 * Tabs
 **/

function initializeTabs( ) 
{
	$( "#tabs ul li" ).each( function( ) {
		
		$( this ).click( function ( ) {
			
			var current = this;
			$( "#tabs ul li" ).each( function( ) {
				if ( this != current ) {
					$( this ).addClass( "passive" );
					$( getSectionDiv( this ) ).hide( );
				}
			} );
			
			$( this ).removeClass( "passive" );
			$( getSectionDiv( this ) ).show( );				
			$( "#overlay_container" ).hide( );	
		} );
	} );
}

function getSectionDiv( tab ) 
{
	var sectionId = tab.id.split( "_" )[ 0 ];
	return $( "#" + sectionId );
}

/**
 * Screenshots
 **/

var screenshotIndex;

function initializeScreenshots( ) 
{
	var container = $( "<div></div>" ).attr( "id", "overlay_container" ).css( "position", "absolute" ).css( "z-index", 10 );
	var overlay = $( "<div></div>" ).attr( "id", "screenshot" ).css( "width", "870px" ).css( "height", "507px" );
	var close = $( "<div><a href=\"javascript:void(0)\">Close</a></div>" ).attr( "id", "close" );
	var image = $( "<div></div>" ).attr( "id", "image" );
	var caption = $( "<div></div>" ).attr( "id", "caption" );
	var left_arrow = $( "<div></div>" ).attr( "id", "leftArrow" ).click( prevImage );
	var right_arrow = $( "<div></div>" ).attr( "id", "rightArrow" ).click( nextImage );;

	$( overlay ).append( close );
	$( overlay ).append( image );
	$( overlay ).append( caption );
	$( overlay ).append( left_arrow );
	$( overlay ).append( right_arrow );
	$( container ).append( overlay );
	$( "body" ).append( container );
	$( container ).hide( );
	
	$( close ).click( function( ) {
		$( container ).hide( );
	});

	$( "#screenshots .screenshot img" ).each( function( ) {
		$( this ).click( function ( ) { 	
			var offset = $( "#screenshots" ).offset( );							
			$( container ).css( "top", offset.top + 23 ).css( "left", offset.left + 30 ).show( );
			setImage( this );
			screenshotIndex = getIndex( this );		
		} );		
	} );
}


function setImage( thumbImg )
{
	var largeImage = $( "<img />" );
	var img = thumbImg.src.split( ".png" )[ 0 ] + "_large.png";
	$( largeImage ).attr( "src", img );	

	$( "#image" ).empty( ).append( largeImage );	
	$( "#caption" ).text( thumbImg.title );
}

function getIndex( image ) 
{
	var images = $( "#screenshots .screenshot img" );
	for ( var i = 0; i < images.length; i++ )
		if ( image == images[ i ] ) return i;
	return null;
}

function prevImage( )
{	
	screenshotIndex--;
	loadImage( );
}

function nextImage( )
{
	screenshotIndex++;
	loadImage( );
}

function loadImage( )
{
	if ( screenshotIndex == -1 )
		screenshotIndex = $( "#screenshots .screenshot img" ).length - 1;
		
	if ( screenshotIndex == $( "#screenshots .screenshot img" ).length )	
		screenshotIndex = 0;
	
	setImage( $( "#screenshots .screenshot img" )[ screenshotIndex ] );		
}