// global vars are bad
var galleryData={};

$(function(){
	$(".showGallery").click(function(){
		var t=$(this).attr("href").split("/");
		var album=t[t.length-1];

		$.ajax({
			url: "/index.php",
			dataType: "json",
			data: {r: "photoalbum/show", photoalbum: album},
			success: onSuccessAjax,
			error: function(xhr){
				$("#gallery").hide();
				alert("Error! Status = " + xhr.status);
				return true;
			}
		});

		return false;
	});

	$("body").ajaxStart(function(){
		$("#gallery").show();
		return true;
	});
});

function onSuccessAjax(response) {
	galleryData.scrollBar=$("#gallery .smallImages ul").empty();

	for(i=0; i<response.length; i++) {
		galleryData.scrollBar.append('<li><div><a href="' + response[i].image + '"><img alt="" title="' + response[i].thumb + '"/></a></div></li>');
	}

	galleryData.thumbs=$("#gallery .smallImages li");
	galleryData.thumbsA=$("#gallery .smallImages a");
	galleryData.thumbsImg=$("#gallery .smallImages img");
	galleryData.bigImage=$("#gallery .bigImage img");

	selectThumb(0);
	updateThumbs();

	// click event on every A
	galleryData.thumbsA.click(function(){
		var index=galleryData.thumbsA.index(this);

		galleryData.activeThumb.removeClass("active");
		selectThumb(index);

		return false;
	});

	$("#gallery .close").click(function(){
		$("#gallery").hide();
		galleryData.thumbsA.unbind("click");
		$(this).unbind("click");
		$("#gallery .toPrevious a").unbind("click");
		$("#gallery .toNext a, #gallery .bigImage a").unbind("click");
		galleryData={};

		return false;
	});

	$("#gallery .toPrevious a").click(function(){
		galleryData.activeThumb.removeClass("active");
		selectThumb(galleryData.activeId-1);

		return false;
	});

	$("#gallery .toNext a, #gallery .bigImage a").click(function(){
		galleryData.activeThumb.removeClass("active");
		selectThumb(galleryData.activeId+1);

		return false;
	});

	// scroll event
	galleryData.scrollBar.scroll(function(){
		if(!galleryData.intervalId)
			galleryData.intervalId=setInterval(updateThumbs,200);
	});

	$(window).resize(function(){
		if(!galleryData.intervalId)
			galleryData.intervalId=setInterval(updateThumbs,200);
	});
}

function selectThumb(id) {
	if(id<0)
		id=galleryData.thumbs.length-1;
	else if(id>(galleryData.thumbs.length-1))
		id=0;

	galleryData.activeThumb=galleryData.thumbs.eq(id);
	galleryData.activeId=id;

	// load bigImage
	var newSrc=galleryData.thumbsA.eq(id).attr("href");
	galleryData.bigImage.attr("src",newSrc);

	galleryData.activeThumb.addClass("active");

	// scroll to place the thumb in the center
	galleryData.scrollBar.animate(
		{scrollLeft: parseInt(
			galleryData.activeThumb.offset().left
			-galleryData.scrollBar.outerWidth()/2
			+galleryData.scrollBar.scrollLeft()
			+galleryData.activeThumb.outerWidth()/2
			-galleryData.scrollBar.offset().left
		)}
	);
}

function updateThumbs() {
	galleryData.thumbsImg.each(function(){
		var thumb=$(this);
		if(thumb.offset().left < (galleryData.scrollBar.offset().left + galleryData.scrollBar.outerWidth())) {
			if(!thumb.data("done")) {
				thumb.attr("src",thumb.attr("title"));
				thumb.data("done",true);
			}
		}
	});

	clearInterval(galleryData.intervalId);
	galleryData.intervalId=false;
}