var numImages = 0;
var currentImage;
var imageList = [];
var currentBox;

$(document).ready(function()
{
	$(window).resize(function()
	{
		renderGallery();
	});
	
	renderGallery();
	
	numImages = $('a[rel=gallery]').length;
	currentBox = $('#current-1');
	
	$('a[rel=gallery]').each(function()
	{
		imageList.push($(this));
		var curIndex = imageList.length - 1
		$(this).data('index',curIndex);
		$(this).click(function(e)
		{
			e.preventDefault();
			currentImage = $(this);
			var newSrc = this.href

			$('#gallery-bg,#gallery').fadeIn('',function()
			{
				var image = new Image();
				$(image).load(function()
				{
					var html = '<img src="' + this.src + '" alt=""/>';
					currentBox.html(html);
					currentBox.fadeIn();
				 	if(numImages > 1 && (curIndex + 1 < numImages)) $('#next').fadeIn();
					if(curIndex > 0) $('#prev').fadeIn();
				});
				image.src = newSrc;
			});
		});
	});
	
	$('#next a,#prev a').hover(function()
	{
		var im = $(this).find('img');
		var src = im.attr('src').replace('.png','-over.png');
		im.attr('src',src);
	},function()
	{
		var im = $(this).find('img');
		var src = im.attr('src').replace('-over.png','.png');
		im.attr('src',src);
	});
	
	$('#next a').click(function()
	{
		$('#prev').fadeIn();
		var currentIndex = currentImage.data('index');
		var nextIndex = currentIndex + 1;
		if((nextIndex + 1) <= imageList.length)
		{
			var nextImage = imageList[nextIndex];
			var newSrc = nextImage.attr('href');
			var c = this;
			var image = new Image();
			$(image).load(function()
			{
				var otherBox = currentBox.attr('id') == 'current-1' ? $('#current-2') : $('#current-1');
				var html = '<img src="' + this.src + '" alt=""/>';
				otherBox.html(html);
				currentBox.fadeOut(750);
				otherBox.fadeIn(750,function()
				{
					currentImage = nextImage;
					currentBox = $(this);
					if((nextIndex + 2) > imageList.length)
					{
						$('#next').fadeOut();
					}
				});
				
			});
			image.src = newSrc;
		}
	});
	
	$('#prev a').click(function()
	{
		$('#next').fadeIn();
		var currentIndex = currentImage.data('index');
		var nextIndex = currentIndex - 1;
		if((nextIndex) >= 0)
		{
			var nextImage = imageList[nextIndex];
			var newSrc = nextImage.attr('href');
			var c = this;
			var image = new Image();
			$(image).load(function()
			{
				var otherBox = currentBox.attr('id') == 'current-1' ? $('#current-2') : $('#current-1');
				var html = '<img src="' + this.src + '" alt=""/>';
				otherBox.html(html);
				currentBox.fadeOut(750);
				otherBox.fadeIn(750,function()
				{
					currentImage = nextImage;
					currentBox = $(this);
					if((nextIndex - 1) < 0)
					{
						$('#prev').fadeOut();
					}
				});
				
			});
			image.src = newSrc;
		}
	});

	$('#gallery-bg').click(function()
	{
		$('#gallery-bg,#gallery').fadeOut();
	});
});

var renderGallery = function()
{
	var t = ($(window).height()/2) - ($('#gallery').height() / 2);
	var l = ($(window).width()/2) - ($('#gallery').width() / 2);
	$('#gallery').css({
		'top':t+'px',
		'left':l+'px'
	});
}