var curArea=""; //current area
var expandTime=100; //x ms per menuitem to fade
var areaFadeTime=400;
var rotateDeg=[];  //id=incrementing, here is the current rotation stored
var rotateTOPtr=[];//timeout id, same as rotateDeg
var rotateDegPerStep=8; //how many degrees to rotate in each step (the lower, the more fluent; the more, the better to keep up with short fades)
var expandSubmenu=""; //if this is not-empty, after fading submenu in again this submenu will be expanded
var loadingTimerPtr;

//change the document hash according to target
function navigateTo(area,section) {
	if(area=="all") //all = contact,agb,imprint... these should not change the left menu
		area=window.location.hash.substr(1).split(",")[0];
	window.location.hash="#"+area+","+section;
	$(window).trigger('hashchange');
}

//expand/collapse a submenu
function expand(submenu,area,section) {
	var arrowAnimTime=($("."+submenu).length)*expandTime;
	var rdIdx=rotateDeg.length;
	if($("."+submenu).first().is(":hidden")) {//expand
		rotateDeg[rdIdx]=-90;
		rotateTOPtr[rdIdx]=setInterval("rotateImg("+rdIdx+",'"+submenu+"',1,0);",arrowAnimTime/(90/rotateDegPerStep));
		$("."+submenu).each(function(index) { $(this).delay(expandTime*index).slideToggle(expandTime); });
	} else {//collapse
		rotateDeg[rdIdx]=0;
		rotateTOPtr[rdIdx]=setInterval("rotateImg("+rdIdx+",'"+submenu+"',-1,-90);",arrowAnimTime/(90/rotateDegPerStep));
		jQuery.fn.reverse = [].reverse;
		$("."+submenu).reverse().each(function(index) { $(this).delay(expandTime*index).slideToggle(expandTime); });
	}
//	navigateTo(area,section);
}

//rotate a submenu master's arrow img
//interval function!
function rotateImg(idx,id,delta,target) {
	rotateDeg[idx]+=delta*rotateDegPerStep;
	$(".master-"+id+" img.mainmenu-arrow").rotateTo(rotateDeg[idx]);
	if((delta>0 && rotateDeg[idx]>=0)||(delta<0 && rotateDeg[idx]<=-90)) {
		$(".master-"+id+" img.mainmenu-arrow").rotateTo(target); //in case x in x*delta=target is not a int but a float, which means deg cant reach target
		clearInterval(rotateTOPtr[idx]);
	}
}

//empty hash=>user just opened site.
//called at document.load() event
function checkHash() {
	if(window.location.hash=="")
		navigateTo("vmdg","vmdg-index");
	else
		updateSite();
}

//given the hash with area and section, load content and main menu and adjust visuals
function updateSite() {
	var hash=window.location.hash.substr(1).split(",");var area=hash[0];var section=hash[1];
	
	//topmenu visual adjust
	$("#topmenu-ul li").removeClass("topmenu-active");
	if(section=="imprint" && area=="vmdg") //imprint as special case
		$("#tab-imprint").addClass("topmenu-active");
	else
		$("#tab-"+area).addClass("topmenu-active");

	$("#topmenu-status").html("Lade...");
	
	if(area!=curArea) { //we changed area => fade the sidebar
		$("#mainmenu-ul").fadeOut(areaFadeTime,
			function() { //upon completion of fadeOut
				$(".mainmenu-master img.mainmenu-arrow").rotateTo(-90); //rotate all the arrows back
				$("#mainmenu-ul li").css("display",""); //reset display style which got messed up by fade animation
				$("#mainmenu-ul li").removeClass("mainmenu-visible"); //remove the only thing that still says display: foo for all the menu items
				$(".mainmenu-t1.area-"+area).addClass("mainmenu-visible"); //and now make only those visible that should be!
				showSelectedMMEntry(section); //mark the selected entry bold and show the appropriate collapsed menu if applicable
				$("#mainmenu-ul").fadeIn(areaFadeTime); //finally, fade in the new menu
				if(expandSubmenu!="") {
					expand(expandSubmenu,area,section);
					expandSubmenu="";
				}
			});
	} else {
		showSelectedMMEntry(section);
	}
	$('#content-content').load('render-ajax.php?action=show&section='+section, function(responseText, textStatus, XMLHttpRequest) {
		$("#topmenu-status").html("");
	});
	curArea=area;
	if(curArea=="vmevent" || curArea=="vmsoft")
		$('#logo').attr("src","images/logo-"+area+".png");
	else
		$('#logo').attr("src","images/logo-vmdg.png");
//	alert($('#logo').attr("src"));
}

//if the selected section is inside a submenu, we must show it.
function showSelectedMMEntry(section) {
	$("#mainmenu-ul li").removeClass("mainmenu-selected");
	if($("#mainmenu-"+section).length!=0) {
		$("#mainmenu-"+section).addClass("mainmenu-selected");
		if($("#mainmenu-"+section).hasClass("mainmenu-t2")) {
			var submenu=$("#mainmenu-"+section).attr("class").match(/(sm\d+)/)[1];
			$("."+submenu).show();
			$(".master-"+submenu+" img.mainmenu-arrow").rotateTo(0); //we expanded a menu, so we must rotate the img
		}
	}
}

//rotate a jquery element deg degrees
$.fn.rotateTo=function(deg) {
	$(this).css({"-moz-transform":"rotate("+deg+"deg)","-o-transform":"rotate("+deg+"deg)","-webkit-transform":"rotate("+deg+"deg)","transform":"rotate("+deg+"deg)"});
}

//register the hash-change listener
$(window).load(function () {
	$(window).bind('hashchange',updateSite);
	checkHash();
});