$(document).ready(function(){
	initGallery("#gallery", true);
});

function initGallery(holder, _autoplay)
{
	var duration = 7000; // ms
	var gallery;
	var timer;
	var autoplay = _autoplay;
	var order = true;
	gallery = $(holder).find(".gallery li");
	var caption = $(holder).find(".captions li");
	gallery.number = $(gallery).length;
	
	// turn the remaining images on now the page load is complete
	$('#gallery .gallery ul li img').css('display', 'block');
	
	if(gallery.number > 1)
	{
		gallery.current = 0;
		gallery.thumbnails = $(holder).find(".list li a");
		
		$(gallery).css({"opacity": 0, "display": "none"});
		$(gallery).eq(0).css({"opacity": 1, "display": "block"});

		
		$(".btn-next").click(function()
			{
				temp = gallery.current;
				$(caption).eq(temp).toggleClass("active");
				$(gallery).eq(temp).animate({"opacity": 0}, 700, function() {  $(gallery).eq(temp).css({"display": "none"});  });
				if(++gallery.current >= gallery.number)
				gallery.current = 0;

				$(gallery.thumbnails).removeClass("active");
				$(gallery.thumbnails).eq(gallery.current).addClass("active");
		
				$(caption).eq(gallery.current).toggleClass("active");
				$(gallery).eq(gallery.current).css({"display": "block"}).animate({"opacity": 1}, 700);
		
				clearTimeout(timer);
				order = true;
				timer = setTimeout(function()
				{
					rotate();
				}
				, duration);
				return false;
				
			});
		$(".btn-prev").click(function()
			{
				temp = gallery.current;
				$(caption).eq(temp).toggleClass("active");
				$(gallery).eq(temp).animate({"opacity": 0}, 700, function() {  $(gallery).eq(temp).css({"display": "none"});  });
				if(--gallery.current < 0)
				gallery.current = gallery.number-1;

				$(gallery.thumbnails).removeClass("active");
				$(gallery.thumbnails).eq(gallery.current).addClass("active");
		
				$(caption).eq(gallery.current).toggleClass("active");
				$(gallery).eq(gallery.current).css({"display": "block"}).animate({"opacity": 1}, 700);
		
				clearTimeout(timer);
				order = false;
				timer = setTimeout(function()
				{
					rotate();
				}
				, duration);
				return false;
			});
		
		$(gallery.thumbnails).each(function(i, el)
		{
			$(el).click(function()
			{
    				if(gallery.current != i)
				{
					var temp = gallery.current;
					$(gallery.thumbnails).removeClass("active");
					$(el).addClass("active");
					
					$(caption).eq(temp).toggleClass("active");
					$(gallery).eq(temp).animate({"opacity": 0}, 700, function() {  $(gallery).eq(temp).css({"display": "none"});  });
					$(gallery).eq(i).css({"display": "block"}).animate({"opacity": 1}, 700);
					$(caption).eq(i).toggleClass("active");
					
					clearTimeout(timer);
					
					gallery.current = i;
					
					
					timer = setTimeout(function()
					{
						rotate();
					}
					, duration);
				}
				return false;
			});
		});
		
		if(autoplay)
		{
			timer = setTimeout(function()
			{
				rotate();
			}
			, duration);
		}
	}
	function play()
	{
			var temp = gallery.current;
			var caption = $(holder).find(".captions li");
			
			$(caption).eq(temp).toggleClass("active");
			$(gallery).eq(temp).animate({"opacity": 0}, 700, function() {  $(gallery).eq(temp).css({"display": "none"});  });
			if (order) 	{
				
				if(++gallery.current >= gallery.number)
					gallery.current = 0;
				} else {
					
					
					if(--gallery.current < 0)
						gallery.current = gallery.number-1;
				}
				$(gallery.thumbnails).removeClass("active");
					$(gallery.thumbnails).eq(gallery.current).addClass("active");
					
					$(caption).eq(gallery.current).toggleClass("active");
					$(gallery).eq(gallery.current).css({"display": "block"}).animate({"opacity": 1}, 700);
					
					clearTimeout(timer); 
	}
	function rotate()
	{
		if(autoplay)
		{
			play();
			timer = setTimeout(function()
			{
				rotate();
			}
			, duration);
		}
	}
}