var current = 0;
var Images = new Array();

var $popup;
var $overlay;
var $popup_header;
var $popup_next;
var $popup_prev;
var $popup_close;
var $popup_text;
var $popup_image;
var $popup_paging;

$(document).ready(function(){
	
	$popup = $("#popup-container");
	$overlay = $("#overlay");
	$popup_header = $("#popup-header span");
	$popup_next = $("#popup-next");
	$popup_prev = $("#popup-prev");
	$popup_close = $("#popup-header a");
	$popup_text = $("#popup-footer p");
	$popup_image = $("#popup-content img");
	$popup_paging = $("#popup-footer ul");
	
	$overlay.css({opacity:'0.8'});

	$(".gallery a")
		.click(function(){
			
			var $this = $(this);
			var Paging = '';
			
			$popup_text.text( jQuery( 'p', $this.next() ).text() );
			$popup_header.text( $this.attr("title") );
			jQuery( 'li img', $this.next() ).each(function(k,v){
				Images[k] = $(v).attr("src");
				Paging += '<li><a>'+(k+1)+'</a></li>';
			});
			$popup_paging.html( Paging );
			show( 0 );
			
			jQuery( 'li a', $popup_paging ).each(function(k,v){
				$(v).bind("click",function(){
					current = k; show(k);
				});
			});
			
			$popup.fadeIn();
			$overlay.fadeIn();
			return false;
		});
	
	$popup_close
		.click(function(){
			$popup.fadeOut();
			$overlay.fadeOut();
			return false;
		});
	
	$popup_next
		.click(function(){
			current = current+1;
			if( current > (Images.length-1) ) current = 0;
			show( current );
			return false;
		});
		
	$popup_prev
		.click(function(){
			current = current-1;
			if( current < 0 ) current = Images.length-1;
			show( current );
			return false;
		});
	
});

function show( id ) {
	
	// image
	$popup_image.fadeOut("fast",function(){
		$popup_image.attr("src",Images[id]);
		$popup_image.fadeIn();
	});
	
	// paging
	jQuery( 'li', $popup_paging ).removeClass('active').each(function(k,v){ if( k == current ) $(v).addClass('active'); });
	
}
