var autoSlideInterval = 15; // autoslide interval [sec]

$(document).ready(function(){
	
	var __openNextSibling = function(nextSibling) {
		clearInterval(window.intID);
		$('#navgal a').css('background-position','');
		$('#gallery img.current').removeClass('current').fadeOut('fast', function(){
			var imageSrc = $(nextSibling).attr('src');
			$('#navgal a[@href=#'+ imageSrc +']').css('background-position','0px 12px');
			nextSibling.addClass('current').fadeIn('fast', function(){
				window.intID = setInterval(nextImage, autoSlideInterval * 1000);
			});
		});
	};

	var nextImage = function() {
		var nextSibling = $('#gallery img.current').next('img');
		if (false == nextSibling.is('img')) {nextSibling = $('#gallery img:first');}
		__openNextSibling(nextSibling);	
	};
	
	var prevImage = function() {
		var nextSibling = $('#gallery img.current').prev('img');
		if (false == nextSibling.is('img')) {nextSibling = $('#gallery img:last');}
		__openNextSibling(nextSibling);		
	};
	
	var openImage = function(link) {
		var imageName = $(link).attr('href');
		imageName = imageName.substr(1, imageName.length-1);

		var nextSibling = $('#gallery img[@src='+ imageName +']');
		__openNextSibling(nextSibling);	
	};
	
	$('.back').click(prevImage);	
	$('.next').click(nextImage);
	$('#navgal a').click(function(){openImage(this);});
	
	$('#gallery img:first').addClass('current').fadeIn('slow', function(){
		var imageSrc = $(this).attr('src');
		$('#navgal a[@href=#'+ imageSrc +']').css('background-position','0px 12px');
		window.intID = setInterval(nextImage, autoSlideInterval * 1000);
	});
  	
});