window.onload = function () {
	$(document).keyup(function(e)
	{
		var KeyID = (window.event) ? event.keyCode : e.keyCode;
		//	alert(KeyID);
		switch(KeyID)
		{
			// user presses the "left arrow" key
			case 37:	$('.backLink').click();
				break;		
			// user presses the "right arrow" key
			case 39:	$('.nextLink').click();
				break;
		}
	});

	// size contianer for first image and load it.
	var img = new Image(); 
	img.src = $('.thumbnails').children('div:first').children('a:first').attr('href');
	$(img).load(function () { 
		$('#largeLink').html(this);
		$('#captionBox').width($('#largeLink').children('img:first').width()-10);
		$('#captionBox').html($('.thumbnails').children('div:first').children('a:first').children('div.caption').html());
		$("#photocell").animate({ 
			width: $('#largeLink').children('img:first').width(),
			height: $('#largeLink').children('img:first').height()
			}, 500, 'linear', function(){$('#largeLink').children('img:first').fadeIn("slow");}
		);
	}).attr('src', $('.thumbnails').children('div:first').children('a:first').attr('href'));
	$('.thumbnails').children('div:first').children('a:first').addClass('currentImg');

	// click on thumbnail
	$('.thumbsWrapper .thumbnails div a').click(function(){
		var lgSrc = $(this).attr('href');
		if (lgSrc != $('#largeLink').children('img:first').attr('src'))
		{
			swapImg2(lgSrc, $(this).children('div.caption').html());
			$('.thumbsWrapper .thumbnails div a ').removeClass('currentImg');	
			$(this).addClass('currentImg');
//			$('#captionBox').html($(this).children('div.caption').html());
		}
			
	return false;
	});
		

	// large image mouseover
	$('#photocell').hover(
		function(){
			if ($('#captionBox').html() != '' && $('#largelink img').css("display") != 'none')
				$('#captionBox').fadeIn("fast");
		},
		function(){
			if ($('#captionBox').html() != '')
				$('#captionBox').fadeOut("fast");
		});


	// large image click
	$('#largeLink').click(function(){
//		if ($('#captionBox').css("display") != 'none')
//			$('#captionBox').fadeOut("fast");
		var thumbSrc = $('#largeLink').children('img:first').attr('src');
		var firstSrc = $('.thumbsWrapper div').children('div:first').children('a:first').attr('href');
		var lastSrc = $('.thumbsWrapper div').children('div:last').children('a:first').attr('href');
		// if not clicking the last image
		if (!(thumbSrc == lastSrc)){
		// find the matching thumb, get the src of the next image
			$('.thumbsWrapper div a').each(function(){
				var thisSrc = $(this).attr('href');
				if ((thisSrc == thumbSrc) && (!(thisSrc == lastSrc))){
					var nextImg = $(this).parents('div').next('div').children('a:first');
//					$('#captionBox').html(nextImg.children('div.caption').html());
					var nextSrc = $(nextImg).attr('href');
					$('.thumbsWrapper div a').removeClass('currentImg');	
					$(nextImg).addClass('currentImg');
					swapImg2(nextSrc, nextImg.children('div.caption').html());
				};						
			});		
		} else {
			// if clicking the last image
			swapImg2(firstSrc, $('.thumbnails').children('div:first').children('a:first').children('div.caption').html());
			$('.thumbnails div a').removeClass('currentImg');
			$('.thumbnails div:first a').addClass('currentImg');
			//$('#captionBox').html($('.thumbnails').children('div:first').children('a:first').children('div.caption').html());
		};
		return false;
	});

	// next link is same as clicking image
	$('.nextLink').click(function(){
	$('#largeLink').click();
			return false;
	});	

	// back link is another story
	$('.backLink').click(function(){
	var thumbSrc = $('#largeLink').children('img:first').attr('src');
	var firstSrc = $('.thumbsWrapper div').children('div:first').children('a:first').attr('href');
	var lastSrc = $('.thumbsWrapper div').children('div:last').children('a:first').attr('href');
		
		// if not clicking the first image
		if (!(thumbSrc == firstSrc)){
			// find the matching thumb, get the src of the next image
			$('.thumbsWrapper div a').each(function(){
			var thisSrc = $(this).attr('href');
			if ((thisSrc == thumbSrc) && (!(thisSrc == firstSrc))){
				var prevImg = $(this).parents('div').prev('div').children('a:first');
//				$('#captionBox').html(prevImg.children('div.caption').html());
				var prevSrc = $(prevImg).attr('href');
				$('.thumbsWrapper div a').removeClass('currentImg');	
				$(prevImg).addClass('currentImg');
				swapImg2(prevSrc, prevImg.children('div.caption').html());
			};						
			});
			} else {
			// if clicking the first image
			swapImg2(lastSrc, $('.thumbnails').children('div:last').children('a:first').children('div.caption').html());
				$('.thumbnails div a').removeClass('currentImg');
				$('.thumbnails div:last a').addClass('currentImg');
				//$('#captionBox').html($('.thumbnails').children('div:last').children('a:first').children('div.caption').html());
				};
		return false;
	});
}; 

function swapImg2(src, caption)
{
var img = new Image(); 
img.src = src;
$(img).load(function () { 
	$('#captionBox').hide();
	$('#captionBox').html(''); 
	$(img).fadeOut("slow", function(){
		$('#captionBox').width(img.width-10);
		$("#photocell").animate({ 
			width: img.width,
			height: img.height
			}, 500, 'linear', function(){
				$(img).fadeIn("slow", function(){$('#captionBox').html(caption);});
		});
	});
	$('#largeLink').html(this); 
	}).attr('src', src);  
}