var imagesToLoad = 0;

function deleteMe () {
	$(this).remove ();
}

function showPhoto (id) {
	$.getJSON ("/backend.php?method=getAlbum&id="+id,
	           function (data) {
				   if (data.album == null) return;
				   showAlbum (data.album, id);
			   });
}

function addPhoto (i, item) {
	var liname = "photo"+item.id;

	var link = $("<a/>");
	link.attr ("href", item.preview);
	link.attr ("title", item.name);
	link.attr ("rel", "gallery");

	var image = $("<img/>");
	image.attr ("src", item.thumbnail);
	link.append (image);
	$("<br/>").appendTo (link);

	var savebutton = $("<img/>");
	savebutton.attr ("src", "/pixmaps/save.png");

	var savelink = $("<a/>");
	savelink.attr ("title", "Download the original version");
	savelink.attr ("href", item.original);
	savelink.append (savebutton);

	var li = $("<li/>");
	li.attr ("id", liname);
	li.addClass ("photoFrame");
	li.css ("display", "none");
	link.append (item.name);
	li.append (link);
	link.append (" ");
	li.append (savelink);
	li.appendTo ("#photoList");
	li.animate ({opacity:1.0}, "fast").fadeIn ("fast");
}

function showAlbum (id, photo) {
	$("li.photoFrame").fadeOut ("fast", deleteMe);
	$("#loadingPopup").fadeIn ("fast");
	$.getJSON ("/backend.php?method=getPhotos&album="+id,
		function (data) {
			imagesToLoad = data.photos.length;
			$.each (data.photos, addPhoto);
			$("li.photoFrame img").load ( function () { imagesToLoad --; if (imagesToLoad == 0) { $("#loadingPopup").fadeOut ("fast"); } } );
			ids = new Array ();
			$.each (data.photos, function (i, item) { ids.push (item.id); });
			$("li.photoFrame a[rel]").fancybox ( { zoomSpeedIn:300,
			                                  zoomSpeedOut:300,
											  itemArray: ids,
											  callbackOnShow: function () {  window.location.hash = "photo"+ids[this.itemCurrent]; },
			                                  callbackOnClose: function () { window.location.hash = "album"+id } } );
			if (photo != null) {
				$("#photo"+photo+" a:first").trigger ('click');
			}
		});
	$("#albumList li").removeClass ("active");
	$("#album"+id).addClass ("active");
}

// Adds an album to #albumList
function addAlbum (i, item) {
	var liname = "album"+item.id;

	var link = $("<a/>");
	link.click (function () { showAlbum (item.id) });
	link.attr ("href", "#album"+item.id);

	var li = $("<li/>");
	li.attr ("id", liname);
	li.addClass ("album");
	li.css ("display", "none");
	link.append (item.name);
	li.append (link);

	if (item.parent == '') {
		li.addClass ("album_with_icon");
		li.appendTo ("#albumList");
	} else {
		if ($("#album"+item.parent+" ul:first").length == 0) {
			var childrenList = $("<ul/>");
			childrenList.addClass ("album_children");
			childrenList.appendTo ("#album"+item.parent);
		}
		li.appendTo ("#album"+item.parent+" ul:first");
	}
	li.fadeIn ("slow");
}

function buildAlbumList () {
	$.getJSON ("/backend.php?method=getAllAlbums",
		function (data) {
			$.each (data.albums, addAlbum);
			dispatch ();
		});
}

function dispatch () {
	var albumRe = /^#album(\d+)/;
	var photoRe = /^#photo(\d+)/;
	
	var results = window.location.hash.match (albumRe);
	if (results != null) { // Display an album
		showAlbum (results[1]);
	}

	results = window.location.hash.match (photoRe);
	if (results != null) { // Display a photo
		showPhoto (results[1]);
	}
}

function buildLoadingPopup ()
{
	var popup = $("<div/>");
	popup.attr ("id", "loadingPopup");
	popup.append ("Loading...");
	popup.appendTo ("body");
}