// #dropdown
var slideDownSpeed = 300;
var slideUpSpeed = 200;

// jquery
$(document).ready(
	function() {
		// hide dropdown in js so when js is disabled the menu is visible by default
		$("*.dropdown").hide();

		// if no navigation item is selected by stacey select exhibition
		// NOTE: index templates need to define a div with navigation-selected class
		if($(".navigation-selected").length == 0) {
			$("#ausstellung > a").addClass("navigation-selected"); // DE
			$("#exhibition > a").addClass("navigation-selected"); // EN
		}

		// update language links
		$("#langde").attr("href", mapSlugs());
		$("#langen").attr("href", mapSlugs());

		// disable current language
		if($(".language").attr("lang") == "de") {
			$("#langde").before("D ");
			$("#langde").remove();
		} else {
			$("#langen").before(" E");
			$("#langen").remove();
		}
		
		// hide imageview selector if no more than one images is available
		if($(".image").length <= 1) {
			$(".imageselector").hide();
		} else { // create the links
			// set first image as viewed if no other image was selected
			$(".image").each(function (){
				$(this).hide();
				if($(".imagecontainer").attr("id") == "ic0" && $(".imageselector").attr("id") == "is0") {
					$(".imagecontainer").attr("id", $(this).attr("title"));
					$(".imageselector").attr("id","1");
				}
			});
			rebuildImageSelector(false);
			$(".imageselector").show();
		}

		// register to events
		registerEvents();
		
		//show grid
		var hash = null;
		var hashParts = String(window.location).split('#');
		if(hashParts.length == 2) {hash = String(hashParts[1]);}
		if(hash == "showgrid") {
			var root_path = $(".container").attr("id");
			$(".container").attr("style", "background-image:url("+root_path+"/public/images/grid_50x50.png);");
			$(".subtitle").attr("style", "background-image:url("+root_path+"/public/images/grid_subtitle.png);");
			$(".content").attr("style", "background-image:url("+root_path+"/public/images/grid_content.png);");
			$(".dropdown").attr("style", "background-image:url("+root_path+"/public/images/grid_content.png); background-position:0px 5px;");
			$("#navigation").attr("style", "background-image:url("+root_path+"/public/images/grid_navigation.png);");
			$(".language").attr("style", "background-image:url("+root_path+"/public/images/grid_navigation.png);");
		}
	}
);

function registerEvents() {
	// track .btn and .dropdown to manage the exhibition menu
	$(".btn").hover(
		function () {
			if($(this).children("*.dropdown").length > 0) {
				//$(".hover).removeClass("hover");
				$(this).addClass("hover");
				$(this).children("a").addClass("navigation-hover");
				$(".hover > *.dropdown").addClass("animationRunning");
				$(".hover > *.dropdown").slideDown(slideDownSpeed, function() {
					$(".hover > *.dropdown").removeClass("animationRunning");
				});
			}
		},
		function () {
			if(!$(".hover > div.dropdown").hasClass("animationRunning")) {
				$(".hover > div.dropdown").slideUp(slideUpSpeed, function() {
					$(".hover > *.dropdown").removeClass("animationRunning");
					$(this).removeClass("hover");
				});
			}
			$(this).children("a").removeClass("navigation-hover");
		}
	);
	$(".dropdown").hover(
		function () {},
		function () {
			if(!$(".hover > div.dropdown").hasClass("animationRunning")) {
				$(this).slideUp(slideUpSpeed);
				$(".hover").removeClass("hover");
			}
		}
	);

	// block clicks on exhibition menu main item
	$("#ausstellung > a, #exhibition > a").click(function (e) {
		e.preventDefault();
		return false;
	});
	
	// imageviewer
	$(".imgbtn").click(function (e) {
		
		if(!$(".imagecontainer").hasClass("animationRunning")) {
			$(".imagecontainer").addClass("animationRunning");
			selectNextImage(parseInt($(this).attr("alt")));
			
			$(".image:visible").addClass("hideme");
			rebuildImageSelector(true);
			$(".hideme").hide().removeClass("hideme");
		}
		
		e.preventDefault();
		return false;
	});
	$(".image").click(function () {
		if(!$(".imagecontainer").hasClass("animationRunning")) {
			// next or rewind
			if($(this).is(":visible")) {
				$(".imagecontainer").addClass("animationRunning");
				selectNextImage(-1);
				
				rebuildImageSelector(true);
				$(this).hide();
			}
		}
	});
}

function mapSlugs() {
	var slug = $(".language").attr("title");

	if($(".language").attr("lang") == "de") {
		// DE -> EN
		if(slug == "/") slug = slug.replace("/", "en/");
		if(slug == ".//") slug = slug.replace(".//", "en");
		if(slug == "../de/") slug = slug.replace("../de/", "../en");
		if(slug == "de/") slug = slug.replace("de/", "en/");
		slug = slug.replace("de/einleitung", "en/introduction");
		slug = slug.replace("de/ausstellung", "en/exhibition");
		slug = slug.replace("/strassen", "/streets");
		slug = slug.replace("/familien", "/families");
		slug = slug.replace("/museen", "/museums");
		slug = slug.replace("/betrachter", "/viewers");
		slug = slug.replace("/andachtsstaetten", "/sites-of-commemoration");
		slug = slug.replace("/paradies", "/paradise");
		slug = slug.replace("/neue-arbeiten", "/new-works");
		slug = slug.replace("de/thomas-struth", "en/thomas-struth");
		slug = slug.replace("de/kunstvermittlung", "en/art-education");
		slug = slug.replace("de/informationen", "en/information");
		slug = slug.replace("de/impressum", "en/colophon");
	}
	
	if($(".language").attr("lang") == "en") {
		// EN -> DE
		if(slug == "/") slug = slug.replace("/", "de/");
		if(slug == ".//") slug = slug.replace(".//", "de");
		if(slug == "../en/") slug = slug.replace("../en/", "../de");
		if(slug == "en/") slug = slug.replace("en/", "de/");
		slug = slug.replace("en/introduction", "de/einleitung");
		slug = slug.replace("en/exhibition", "de/ausstellung");
		slug = slug.replace("/streets", "/strassen");
		slug = slug.replace("/families", "/familien");
		slug = slug.replace("/museums", "/museen");
		slug = slug.replace("/viewers", "/betrachter");
		slug = slug.replace("/sites-of-commemoration", "/andachtsstaetten");
		slug = slug.replace("/paradise", "/paradies");
		slug = slug.replace("/new-works", "/neue-arbeiten");
		slug = slug.replace("en/thomas-struth", "de/thomas-struth");
		slug = slug.replace("en/art-education", "de/kunstvermittlung");
		slug = slug.replace("en/information", "de/informationen");
		slug = slug.replace("en/colophon", "de/impressum");
	}
	
	return slug;
}

function selectNextImage(selection) {
	var ic = $(".imageselector").attr("id");
	// get next
	if(selection < 0) {
		if(ic == "") ic = 0;
		ic++;
		if(ic > $(".image").length) {
			ic = 1;
		}
	} else { // or select directly
		ic = selection;
	}
	
	$(".imageselector").attr("id", ic);
	$(".imagecontainer").attr("id", $(".imgbtn[alt='"+ic+"']").attr("href"));
}

function rebuildImageSelector(docchange) {
	$(".imageselector").html("");
	var curr = $(".imageselector").attr("id");
	$(".imageselector").attr("id","0");
	
	// create links
	$(".image").each(function (){
		var ic = $(".imageselector").attr("id");
		ic++; // start counting/naming image-links
		$(".imageselector").attr("id", ic);
		// add space after first link
		var prespacer = "";
		var prostspacer = "";
		if(ic > 1) prespacer = "&nbsp;";
		if(ic < $(".image").length) postspacer = "&nbsp;";
		
		// create links
		if($(this).attr("title") == $(".imagecontainer").attr("id")) {
			// selected image
			$(".imageselector").append(prespacer+ic+postspacer);
			$(this).show(0, function() {
				$(".imagecontainer").removeClass("animationRunning");
			});
		} else { // not selected, make link and hide
			$(".imageselector").append("<a href=\""+$(this).attr("title")+"\" class=\"imgbtn\" alt=\""+ic+"\">"+prespacer+ic+postspacer+"</a>");
		}
	});

	// set id back to currently selected image
	$(".imageselector").attr("id",curr);
	if(docchange) registerEvents(); // since change doc, refresh events
}