$(document).ready(function(){

//function to set the caption and previous and next images once the main image is set
function setDisplay(){
//show the caption
$("#caption").html($("img.active").attr("title"));
//sort the thumbnails
$("#nextimage").attr("src",nextImage().attr("src")).removeClass().addClass("thumb_"+nextImage().attr("class"));
$("#previmage").attr("src",prevImage().attr("src")).removeClass().addClass("thumb_"+prevImage().attr("class"));
//change the copyright date
$(".copyright span").html($("img.active").attr("data-date"));
//change the document title just for kicks
document.title=$("img.active").attr("alt") +" | " + $title;
}

//functions to find the next and previous images from the active image
function nextImage(){
var $next = ($('img.active').next().length > 0) ? $('img.active').next() : $('#imageholder img:first');
return $next
}

function prevImage(){
var $prev = ($('img.active').prev('img').length > 0) ? $('img.active').prev() : $('#imageholder img:last');
return $prev
}

//function to vertically centre the slideshow if there's enough room
function verticalPosition(){
if ($(window).height() > 590)
	{$("#largeimage_container").css({marginTop : 0.5*($(window).height() - 590) + 'px'})}
else
	{$("#largeimage_container").css({marginTop : 0})}
}

//assign classes to the images based on aspect ratio
$("#imageholder img").each(function(i){
    if ($(this).width() > $(this).height())	{
		$(this).addClass("landscape")
	}
	else $(this).addClass("portrait");
})

//vertically centre the image container
verticalPosition();

//read the current document title for reuse later
$title = document.title;

//read the query string and show the correct large image on initial load
if (document.location.search.substring(1) != ""){
	$src = 'Gallery' + document.location.search.substring(1) +'.jpg';
	$("img.active").removeClass("active");
	$("#imageholder img[src*='"+$src+"']").addClass("active");
	setDisplay();
}

//actions for clicks
$("#nextimage,#image_rightcolumn .arrow img").click(function(){
//hide the current image and remove the active class
$nextImage = nextImage();
$("img.active").removeClass("active");
//show the next image and add the actve class
$nextImage.addClass("active");
//call the function to sort the images and caption
setDisplay();
return false;
})

$("#previmage,#image_leftcolumn .arrow img").click(function(){
//hide the current image and remove the active class
$prevImage = prevImage();
$("img.active").removeClass("active");
//show the next image and add the actve class
$prevImage.addClass("active");
//call the function to sort the images and caption
setDisplay();
return false;
})

//call the verticalPosition code if the window is resized
$(window).resize(function(){
verticalPosition();
})

})