/*
  Ben Gold
  Copyright (C) 2008 by Systemantics, Bureau for Informatics

  Lutz Issler
  Mauerstr. 10-12
  52064 Aachen
  GERMANY

  Web:    www.systemantics.net
  Email:  mail@systemantics.net

  Permission granted to use the files associated with this
  website only on your webserver.
*/



var DURATION_LINE = 500;
var DURATION_FADE = 1500/2;

function getThumbnailsVisibility() {
	if ($("#thumbnails").length==0) {
		return false;
	}
	// Search for the thumbnails cookie
	cookies = document.cookie.split(/;/);
	for (var i=0; i<cookies.length; i++) {
		var cookie = $.trim(cookies[i]).split(/=/);
		if (cookie.length==2 && cookie[0]=="thumbnails") {
			return cookie[1]=="on";
		}
	}
	// We did not find a cookie
	return !$("#thumbnails").hasClass("hidden");
}

var menuTimeout = null;

function menuAnimateShow(menu) {
	window.clearTimeout(menuTimeout);
	$(menu).show();
	var menuOffset = menu.offset();
	$(".border", menu).each(function() {
		// Show menu borders
		var jImg = $(this).siblings("span").children("a");
		if (jImg.length==0) {
			return;
		}
		var jThis = $(this);
		var parentOffset = $(this.parentNode).offset();
		jThis.css("top", parentOffset.top-menuOffset.top+18);
		jThis.css("left", parentOffset.left-menuOffset.left);
		jThis.animate({width: jImg.width()}, DURATION_LINE);
		if ($.browser.msie) {
			jImg.show();
			menuVisible = true;
		} else {
			jImg.css("opacity", 0);
			//jImg.fadeIn(DURATION_FADE*2, function() {
			//	menuVisible = true;
			//});
			jImg.show().fadeTo(DURATION_FADE*2, 1, function() {
				menuVisible = true;
			});
		}
	});
}

function menuAnimateHide(menu) {
	menuVisible = false;
	var menuOffset = menu.offset();
	$(".border", menu).each(function() {
		// Show menu borders
		var jImg = $(this).siblings("span").children("a");
		if (jImg.length==0) {
			return;
		}
		jImg = jImg.add($("ul", $(this).parent()));
		var jThis = $(this);
		jThis.animate({width: 0}, DURATION_LINE);
		if ($.browser.msie) {
			jImg.hide();
		} else {
			jImg.fadeOut(DURATION_FADE);
		}
	});
	menuTimeout = window.setTimeout(function() {
		$(menu).hide();
	}, DURATION_FADE);
}

function menuHide() {
	if ($("#photo img").css("opacity")<1) {
		return;
	}
	overlayVisible = false;
	$(":animated").stop();
	overlayHide($("#photo"));
	menuAnimateHide($("#menu"));
	$("#thumbnails").fadeOut(DURATION_FADE);
}

function menuStaticShow(menu) {
	if (menu.length==0) {
		return;
	}
	var menuOffset = menu.offset();
	$(".border", menu).each(function() {
		// Show menu borders
		var jImg = $(this).siblings("span").children("a,span");
		if (jImg.length==0) {
			return;
		}
		var jThis = $(this);
		var parentOffset = $(this.parentNode).offset();
		jThis.css("top", parentOffset.top-menuOffset.top+18);
		jThis.css("left", parentOffset.left-menuOffset.left);
		jThis.width(jImg.width());
		jImg.show();
		if (!$.browser.msie) {
			jImg.css("opacity", 1);
		}
		menuVisible = true;
	});
}

function menuExtendDOM(menu) {
	menu.children("li,dd,dt")
		.append('<div class="border"></div>')
		.children("a,span").wrap('<span class="item"></span>');
}

function menuAddSubmenuHovering(menu) {
	// Submenu hovering
	$("ul", menu).parent().hover(
		function() {
			if (!menuVisible) return;
			$("ul", this).stop();
			$(".border", this).stop();
			$("ul", this).css("display", "none");
			if ($.browser.msie) {
				$("ul", this).show();
			} else {
				$("ul", this).css("opacity", 0);
				//$("ul", this).fadeIn(DURATION_LINE);
				$("ul", this).show().fadeTo(DURATION_LINE, 1);
			}
			$(".border", this).animate({width: $("span.item", this).width()+$("ul", this).width()}, DURATION_LINE);
		},
		function() {
			if (!menuVisible) return;
			$("ul", this).stop();
			$(".border", this).stop();
			if ($.browser.msie) {
				$("ul", this).hide();
			} else {
				$("ul", this).fadeOut(DURATION_LINE);
			}
			$(".border", this).animate({width: $("span.item", this).width()}, DURATION_LINE);
		}
	);
}

var overlayVisible = false;
var menuVisible = false;

function overlayShow(target) {
	$("#overlay").stop().fadeTo(DURATION_FADE, .6);
}

function overlayHide(target) {
	$("#overlay").stop().fadeTo(DURATION_FADE, 0);
}

$(function() {
	$("#logo img, #menu img").addClass("img");

	// Enhance menus
	menuExtendDOM($(".menu"));
	menuAddSubmenuHovering($("#menu"));

	menuExtendDOM($("#contact"));

	// Indicate the fullscreen image
	if ($("#fullscreen").length>0) {
		$("body").addClass("fullscreen");
	}

	$("body").css("overflow", "hidden");

	// Listen to click events
	$("a.category", ".menu").click(function() {
		this.blur();
		if ($(this).parents("li:first").find("li").length>0) {
			// Do nothing if we are at a heading
			return false;
		}
		if (getThumbnailsVisibility()) {
			// Load new thumbnails
			$("#thumbnails > ul").load(this.href.replace(/photos/, "thumbnails"));
			this.blur();
			return false;
		}
	});

	// Listen to page changes
	if ($("#photo, #fullscreen").length>0) {
		$(".menu a.category, #thumbnails a, #caption a").click(function() {
			this.blur();
			if ($(this).parents("li:first").find("li").length>0) {
				// Do nothing if we are at a heading
				return false;
			}
			if ($("#thumbnails img").length>0 && $(this).is("a.category") && getThumbnailsVisibility()) {
				return false;
			}
			var href = this.href;
			menuHide();
			var fadeOutElements = $("#photo img, #fullscreen img");
			if ($("#fullscreen").length>0) {
				fadeOutElements = fadeOutElements.add("#logo");
			}
			if ($.browser.msie) {
				window.location.href = href;
			} else {
				fadeOutElements.fadeOut(DURATION_FADE, function() {
					window.location.href = href;
				});
			}
			return false;
		});
	}

	// Enhance thumbnail buttons
	$("#thumbnails span.toggle.on").click(function() {
		$("#thumbnails").removeClass("hidden");
		document.cookie = "thumbnails=on; path=/";
	});
	$("#thumbnails span.toggle.off").click(function() {
		$("#thumbnails").addClass("hidden");
		document.cookie = "thumbnails=off; path=/";
	});

	// Restore the thumbnails state
	if (getThumbnailsVisibility()) {
		$("#thumbnails").removeClass("hidden");
	} else {
		$("#thumbnails").addClass("hidden");
	}

	// Listen to cursor keys
	$(document).keydown(function(e) {
		var a = false;
		switch (e.which) {
			case 37:
				a = $("#previous");
				break;
			case 39:
				a = $("#next");
				break;
		}
		if (a && a.length==1) {
			a.click();
		}
	});

	if ($.browser.msie) {
		// IE fix for opacity animations
		$("#overlay").css("filter", "alpha(opacity=0)");
	}

	if ($("#overlay").length>0) {
		// On image pages
		menuStaticShow($("#logo"));
	}
});

var imageRatio = false;

$(window).load(function() {
	var photo = $("#photo");
	if (photo.length>0) {
		imageRatio = photo.width()/photo.height();
	}
	var fullscreen = $("#fullscreen");
	if (fullscreen.length>0) {
		imageRatio = fullscreen.width()/fullscreen.height();
	}

	$(window).resize();
	$("#photo").css("visibility", "visible");

	$("body").css("overflow", "");

	var menu = $("#menu");

	// Text location and formatting
	$("#text > p:first").addClass("first");
	$("#text")
		.css("top", (menu.offset().top+menu.height()+60))
		.css("visibility", "visible");

	// Text location and formatting
	$("#contact")
		.css("top", (menu.offset().top+menu.height()))
		.css("visibility", "visible");

	if ($("#fullscreen").length>0) {
		// On homepage
		if ($.browser.msie) {
			$("#fullscreen img").css("visibility", "visible")
			window.setTimeout('menuAnimateShow($("#menu"))', DURATION_FADE*2);
			menuAnimateShow($("#logo"));
		} else {
			$("#fullscreen img")
				.css("visibility", "visible")
				.hide()
				.css("opacity", 1)
				.fadeIn(DURATION_FADE*2, function() {
					window.setTimeout('menuAnimateShow($("#menu"))', DURATION_FADE*2);
					menuAnimateShow($("#logo"));
				});
		}
	} else if ($("#overlay").length>0) {
		// On image pages
		if (!$.browser.msie) {
			$("#photo img")
				.hide()
				.css("opacity", 1)
				.fadeIn(DURATION_FADE);
		}
		$("#backlayer").mouseover(menuHide);
		$("#overlay").mouseover(function() {
			if ($("#photo img").css("opacity")<1) {
				return;
			}
			if (overlayVisible) {
				return;
			}
			overlayVisible = true;
			$(":animated").stop();
			overlayShow($("#photo"));
			menuAnimateShow($("#menu"));
			$("#thumbnails")
				.css("opacity", 1)
				.fadeIn(DURATION_FADE);
		});
	} else {
		// On text pages
		menuStaticShow($("#logo"));
		menuStaticShow($("#menu"));
		menuStaticShow($("#contact"));
		$("#contact").css("visibility", "visible");
	}

	var thumbnails = $("#thumbnails");
	if (thumbnails.length==1) {
		// Position thumbnails
		thumbnails.css("top", $("#menu").offset().top+$("#menu").height()+20);
	}

	$("a.external").click(function() {
		window.open(this.href);
		return false;
	});
});

var maxThumbnailCount = 35;

$(window).resize(function() {
	var BORDER = 10;
	var photo = $("#photo");
	if (photo.length==1) {
		// Position menus
		$("#logo, #menu, #thumbnails, #caption").css("left", $(window).width()*0.1753);
		// Scale and position photo
		var newH = Math.max(
			$(window).height()-photo.offset().top*2,
			$("#menu").height()+Math.ceil(maxThumbnailCount/8)*55-5
		);
		var newW = newH*imageRatio;
		if (newW>$(window).width()-$(window).width()*0.1753*2) {
			var maxW = $(window).width()-BORDER*2;
			if (newW>maxW) {
				newW = maxW;
				newH = newW/imageRatio;
			}
		}
		$("img", photo).css({
			width: newW,
			height: newH
		});
		photo.css({
			left: Math.min(($(window).width()-newW)/2, $("#logo").offset().left)
		});
		$("#overlay").css({
			left: photo.offset().left,
			top: photo.offset().top,
			width: newW,
			height: newH
		});
		$("#caption").css("top", Math.max(
			$("img", photo).offset().top+newH+11,
			$(window).height()-60
		));
	}

	// Resize backlayer
	$("#backlayer").css({
		width: $(window).width(),
		height: $(window).height()
	});

	// Resize fullscreen image on homepage
	var fullscreen = $("#fullscreen");
	if (fullscreen.length>0) {
		var newH = $(window).height()-fullscreen.offset().top*2;
		var newW = newH*imageRatio;
		if (newW<$(window).width()) {
			newW = $(window).width();
			newH = newW/imageRatio;
			if (newH<$(window).height()) {
				newH = $(window).height();
				newW = newH*imageRatio;
			}
		}
		$("img", fullscreen).css({
			width: newW,
			height: newH
		});
	}
});
