var slideIndex = 0;
var current_post_index = 0;
var slides = new Array( );

function nextSlide( )
{
	if ( slideIndex < slides[ current_post_index ].length - 1 )
		showSlide( slideIndex+1 );	
}
function prevSlide( )
{
	if ( slideIndex > 0 )
		showSlide( slideIndex-1 );	
}

function showSlide( index )
{
	var oldIndex = -1;
	if ( slideIndex != index )
	{
		oldIndex = slideIndex;
		slideIndex = index;
	}
	
	var my_slide = slides[ current_post_index ][ index ];
	
	$( "#image_" + oldIndex ).fadeOut( );
	
	$( "#caption" ).html( slides[ current_post_index ][ index ].caption );
	
	$( "#popupContainer" ).animate( {
		"left": ( parseInt( $( document ).width( ) - my_slide.width - 100 ) / 2 )
	}, 250 );

	if ( slides[ current_post_index ].length > 1 )
	{
		$( "#slideCounter" ).html( (index+1) + ' of ' + slides[ current_post_index ].length );
		$( "#slideCounter" ).css( "left",  my_slide.width - 70 );
		$( "#leftArrow" ).css( "left",  my_slide.width - 35 );
		$( "#rightArrow" ).css( "left",  my_slide.width - 10 );
		
		if ( index == 0 )
			$( "#leftArrow" ).hide( );
		else
		{
			$( "#leftArrow" ).show( );
			$( "#leftArrow" ).animate( { opacity: 1 }, 200 );
		}
	
		if ( index == slides[ current_post_index ].length - 1 )
			$( "#rightArrow" ).hide( );
		else
		{
			$( "#rightArrow" ).show( );
			$( "#rightArrow" ).css( "display", "block" );
		}
	}


	$( '#imageContainer' ).addClass( 'PopupImageLoader' );
	$( '#imageContainer' ).css( {
		'width':  my_slide.width,
		'height':  my_slide.height,
		'background-position': ( ( my_slide.width / 2 ) + 20 ) + 'px ' + ( ( my_slide.height / 2 ) - 10 ) + 'px'
	} );

	var img = new Image( );
	$( img )
	.one( 'load', function( )
	{
		$( '#imageContainer' ).removeClass( 'PopupImageLoader' );
		$( '#imageContainer' ).append( $( this ) );
		$( this ).animate( {opacity:1}, 350, function( ) { $( "#image_" + oldIndex ).remove( ); } );
	})
	.attr( {
		'id': 'image_' + index,
		'style': 'position:absolute; left:50px; top:50px; opacity:0.15; filter:alpha(opacity=15);',
		'src': slides[ current_post_index ][ index ].file 
	} );

	$( "#popup" ).animate( {
		"width": my_slide.width + 100,
		"height": my_slide.height + 100
	}, 250 );
	
	$( "#image_details" ).animate( { "top": my_slide.height + 55 }, 250 );
	
	setTimeout( function( ) {
		$( '#image_' + slideIndex ).each( function( ) 
		{
			if ( this.complete )
			{
				$( this ).trigger( 'load' );
			}
		} );
	}, 250 )
}

function showPopup( post_index, slideIndex )
{
	current_post_index = post_index; 
	
	if ( slideIndex == null ) 
		slideIndex = 0;
		
	var first_slide = slides[ current_post_index ][ 0 ];
	var popupWidth = first_slide.width + 100;
	var popupHeight = first_slide.height + 100;

	var docWidth, docHeight;
	docWidth = $(document).width( );	
	docHeight = $(document).height( );
	
	$( "#siteCover" ).css( "width", docWidth );
	$( "#siteCover" ).css( "height", $( window ).height( ) );
	$( "#siteCover" ).css( "display", "inline" );
	$( "#siteCover" ).animate( { opacity: 0.7 }, 400 );
	
	var newHTML = '<div id="popup" style="float:left; z-index:50; width:' + popupWidth + 'px; height:' + popupHeight + 'px; background-color:#ffffff;">';
	newHTML += '<div onclick="closePopup();" style="cursor:pointer; position:relative; top:25px; left:50px;">[X] CLOSE</div><br clear="all" />';
	newHTML += '<div id="popupContent">';
	newHTML += '<div id="imageContainer" class="PopupImageLoader" style="width:' + popupWidth + 'px; height:' + popupHeight + 'px; background-position:' + ( popupWidth/2 - 12 ) + 'px ' + ( popupHeight/2 - 62 ) + 'px; "></div>';
	newHTML += '<div id="image_details" style="position:absolute; left:50px; top:' + ( first_slide.height + 55 ) + 'px;">';
	newHTML += '<div id="caption" class="caption" style="position:relative; left:0px; top:0px; font-size:12px; width:300px;">' + first_slide.caption + '</div>';
	
	if ( slides[ current_post_index ].length > 1 )
	{
		newHTML += '<div id="slideCounter" style="font-size:12px; position:absolute; top:0px; left:' + ( first_slide.width - 70 ) + 'px; width:50px;">1 of ' + slides.length + '</div>';

		newHTML += '<div id="leftArrow" style="position:absolute; top:0px; left:' + ( first_slide.width - 35 ) + 'px;" onclick="prevSlide( );"><img style="cursor:pointer;" src="' + imagesPath + 'left_arrow.gif" /></div>';
	
		newHTML += '<div id="rightArrow" style="position:absolute; top:0px; left:' + ( first_slide.width - 10 ) + 'px;" onclick="nextSlide( );"><img style="cursor:pointer;" src="' + imagesPath + 'right_arrow.gif" /></div>';
	}
	newHTML += '<br clear="all" /></div></div></div>';
	
	$( "#popupContainer" ).css( "width", popupWidth + 'px' );
	$( "#popupContainer" ).css( "height", ( popupHeight+50 ) + 'px' );
	
	var scrollPos;
	if ( "pageYOffset" in self )
		scrollPos = self.pageYOffset;
	else if ( "scrollTop" in document.documentElement )
		scrollPos = document.documentElement.scrollTop;
	else
		scrollPos = document.body.scrollTop;

	$( "#popupContainer" ).css( "top", parseInt( scrollPos + 50) + 'px' );

	$( "#popupContainer" ).css( "left", ( parseInt( docWidth-popupWidth ) / 2 ) + 'px' );
	
	$( "#popupContainer" ).html( newHTML );
	$( "#popupContainer" ).fadeIn( 200, function ( ) { showSlide( slideIndex ); } );
	$( "#popupContainer" ).css( "z-index", 500 );
}


function closePopup ( )
{
	$( "#popupContainer" ).fadeOut( 200, function ( ) { $( "#popupContainer" ).html( '' ); } );	
	
	$( "#siteCover" ).animate( { opacity: 0.0 }, 400, function ( ) { $( "#siteCover" ).css( "display", "none" ); } );	
}

$( window ).scroll( function( )
{
	var scrollPos;
	if ( "pageYOffset" in self )
		scrollPos = self.pageYOffset;
	else if ( "scrollTop" in document.documentElement )
		scrollPos = document.documentElement.scrollTop;
	else
		scrollPos = document.body.scrollTop;

	$( "#siteCover" ).css( {
		"top": scrollPos,
		"height": $( window ).height( )
	} );	
} );

$( window ).resize( function( ) 
{
	var docWidth, docHeight;
	docWidth = $( "#black_top_bar" ).width( );	
	docHeight = $( document ).height( );
	
	$( "#siteCover" ).css( "width", docWidth );
	$( "#siteCover" ).css( "height", docHeight );
	
	var scrollPos;
	if ( "pageYOffset" in self )
		scrollPos = self.pageYOffset;
	else if ( "scrollTop" in document.documentElement )
		scrollPos = document.documentElement.scrollTop;
	else
		scrollPos = document.body.scrollTop;

	$( "#popupContainer" ).css( "top", parseInt( scrollPos + 50) + 'px' );

	var popupWidth;
	if ( slideIndex != 'text' )
	{
		if ( slides[ current_post_index ] != null )
			popupWidth = slides[ current_post_index ][ 0 ].width + 100;
	}
	else
	{
		popupWidth = 600;	
	}
	$( "#popupContainer" ).css( "left", ( parseInt( docWidth-popupWidth ) / 2 ) + 'px' );	
});