$(document).ready(function() {
	
	//-> Funktion, wenn auf ein Navigationsitem geklickt wird
	$("#navigation").children().click(function() {
		showContent($(this)[0].id.split("_")[2], true);
	});
	
	//-> Funktion, wenn auf den Header geklickt wird
	$("#area_hea").click(function() {
		document.location = "http://www.zeichenkraftwerk.de";
	});
	
	//-> Fancybox
	$("a.galleryImage").fancybox({
		'titlePosition'	: 'over'
	});
	
	//-> Wenn bereits ein anzuzeigender Inhalt per Hash übergeben  wurde, diesen auslesen
	if (window.location.hash) {
		$("#area_nav").show();
		showContent(window.location.hash.replace("#", ""), false);
	}
	//-> Ansonsten alles schön einblenden
	else {
		$("#area_nav").delay(1200).fadeIn(500);
		
		//-> Einige Berechnungen zur Größe des Start-Divs
		setTimeout(resizeHomeContent, 1800);
		$(window).resize(resizeHomeContent);
		
		$("#content_home").delay(2000).fadeIn(500);
	}
	
	
	
	function showContent(contentName, scrollIt) {
		found = false;
		
		//-> den richtigen Inhalte anzeigen
		$("#content").children().each(function() {
			if ($(this)[0].id == "content_" + contentName) {
				$(this).show();
				found = true;
			}
			else {
				$(this).hide();
			}
		});
		
		//-> wenn die Seite gefunden wurde
		if (found) {
			//-> den richtigen Navigationspunkt als Active kennzeichnen
			$("#navigation").children().each(function() {
				if ($(this)[0].id == "navigation_item_" + contentName) {
					$(this).addClass("active");
				}
				else {
					$(this).removeClass("active");
				}
			});
			
			//-> bei Bedarf die Seite scrollen
			if (scrollIt) {
				$('html,body').animate({scrollTop: $("#area_slo").offset().top}, 300, "swing");
			}
			
			//-> Hash setzen
			window.location.hash = contentName;
			
			//-> Footer anzeigen
			$("#area_foo").show();
		}
	}
	
	function resizeHomeContent() {
		$("#content_home").height($(window).height()-$("#area_con").offset().top);
	}
	
});