// on load...
$(function() {

	$("div.gallery-thumbs ul li a").click(function(e)
	{
		// get the child images of the clicked 'a' element
		var childImages = $(this).children('img');
		
		// check we only have the 1 thumbnail image
		if (childImages.length != 1)
		{
			return;
		}
		
		// get the single thumbnail image source
		var currentImage = (childImages[0]).src;
		var currentImageAlt = (childImages[0]).alt;
		
		// get the regular image path from the thumbnail path
		var regularImage = getRegularImageFromThumbPath(currentImage);
		
		// find the large image element
		var largeImages = $("div#gallery-large img");
		
		// check there is only the single large image present
		if (largeImages.length != 1)
		{
			return;
		}
		
		// get the only image in the largeImages array...
		var largeImage = largeImages[0];
		
		// switch its source for the new large image
		largeImage.src = regularImage;
		largeImage.alt = currentImageAlt;
		
	});	
});

function getRegularImageFromThumbPath(thumbPath)
{
	// find the index of the 's.', used to define the thumbnail image
	var extensionIndex = thumbPath.lastIndexOf('s.');
	
	// get the regular version of the current image
	var newImage = thumbPath.substring(0, extensionIndex) + thumbPath.substring(extensionIndex + 1);
	
	return newImage;
}
