$(document).ready(function() {
	initGal();
});

function initGal(){
	var current = 0;
	$('#slideShowNavBG').css('opacity', .8);
	
	var navs = $('#slideShowNav a');
	var imgs = $('#slideShowImages img');
	var descs = $('#slideShowDescs div');
	navs.each(function(i, el){
		var tab = $(el).find('img');
		if(i != 0){
			tab.css('opacity', 0); // hide all tabs that are not the first
			$(imgs[i]).css('display', 'none'); // hide all images that are not the first
			$(descs[i]).css('display', 'none'); // hide all descs that are not the first
		}
		
		$(el).click(function(){
			if(i == current) return false; // quit if current tab is already selected
			//animate the current tab down
			$(navs[current]).find('img').animate({
				'opacity': 0,
				'top': '10px'
			},200);
			//animate the current image down
			$(imgs[current]).fadeOut(500);
			//animate the current desc down
			$(descs[current]).fadeOut(500);
			//animate the images up
			$(imgs[i]).fadeIn(500);
			//animate the current desc up
			$(descs[i]).fadeIn(500);
			//animate the current tab up
			tab.animate({
				'opacity': 1,
				'top': '0px'
			},200);
			//set the current item and return false
			current = i;
			return false;
		});
	});
}