// JavaScript Document
// V1.1 

// boolean isDown : ist es eine horizontale navi?
// boolean isFirst : ist es die erste Ausklappebene?

var openedUL = new Object();
var params = {
		vpOffset: 5, /* Mindestabstand zum Viewport */
		lyPadding: 3, /* Padding des layers der geoeffnet wird; padding auf einer seite! */
		firstTop: 3, /* Vertikale Verschiebung der ersten Ebene */
		firstLeft: 3, /* Horizontale Verschiebung der ersten Ebene */
		secTop: 3, /* Vertikale Verschiebung ab der zweiten Ebene */
		secLeft: 3 /* Horizontale Verschiebung ab der zweiten Ebene */
	};
var isTimeout = false;

function initMenu(initParams) {
	myNavi = $('my_navi')
	myHeight = myNavi.getHeight();
	$('div_main_inner').style.position = "relative";
	myNavi.absolutize();
	$('navi_container').style.height = myHeight + "px";
	$('div_main_inner').insert(myNavi, {'content': 'after'});
	//myNavi.style.position = "relative";
	$('main_ul').style.position = "absolute";
	// Konfiguration ggf. mit lokalen params ueberschreiben/erweitern
	initParams = initParams || {};
	for(var p in initParams) params[p] = initParams[p];
}

function log (message) {
	if ($("t")) {
		if (typeof log.t == "undefined")
			log.t = $("t");
		log.t.value = log.t.value + message + "\n";
	}
}


function GetSubtree(event, id, isFirst, isDown) {
	isTimeout = false;
	myTree = $(id);
	myOpener = myTree.parentNode;
	event = event || window.event;
	var fromElement = event.relatedTarget || event.fromElement || false;
	if (fromElement) {
		if (!$(fromElement).descendantOf(myOpener)) {	
			//log("echter mouseover: ("+id+")");
			if(myTree.childElements() == '') {
				//myTree.insert("<li class='loader'><a href='#' class='menu_popup'>loading...</a></li>");
				openedUL[id] = true;
				LoadTree(id, isFirst, isDown);					
				//ShowTree(id, isFirst, isDown);				
			} else {
				ShowTree(id, isFirst, isDown);
			}
		}
	}
}

function SetTreePosition(id, isFirst, isDown) {
	var myTree = $(id);
	var myPar = myTree.parentNode;
	var myParAPos = myPar.viewportOffset();
	var myParRPos = myPar.positionedOffset();
	var myParDim = myPar.getDimensions();
	var myDim = myTree.getDimensions();
	var myVP = document.viewport.getDimensions();
	isFirst = isFirst || false;
	isDown = isDown || false;
	var myTopOffset = isFirst ? params.firstTop : params.secTop;
	var myLeftOffset = isFirst ? params.firstLeft : params.secLeft;
	
	myTree.style.position = "absolute";
	
	// nach unten klappen
	if (isDown) {
		/////////////////////////
		// left position	
		// 
		// wenn popup rechts passt normal anzeigen
		if (myParAPos.left + (myDim.width - (2 * params.lyPadding)) + myLeftOffset + params.vpOffset < myVP.width) {
			var newPos = myParRPos.left - params.lyPadding + myLeftOffset;
			myTree.style.left = newPos + "px";
		} 
		// sonst nach links verschieben
		else {
			var newPos = (myParRPos.left + myParDim.width) - (myDim.width - params.lyPadding);
			myTree.style.left = newPos + "px";
		}
		/////////////////////////
		// top position
		// hier keine abfrage, soll immer unterhalb des Items angezeigt werden
		var newPos = myParRPos.top + myParDim.height - params.lyPadding + myTopOffset;
		myTree.style.top = newPos + "px";

	}
	// sonst nach rechts/links klappen lassen
	else {	
		/////////////////////////
		// left position	
		// 
		// wenn popup rechts passt oder links auch nicht passen wuerde normal anzeigen
		if ((myParAPos.left + (myParDim.width - 0) + (myDim.width - (2 * params.lyPadding)) + myLeftOffset + params.vpOffset < myVP.width) || (myParAPos.left - (myDim.width - (2 * params.lyPadding)) - myLeftOffset < params.vpOffset)) {  // warum -0
			var newPos = myParRPos.left + (myParDim.width - 0) + myLeftOffset - params.lyPadding;
			myTree.style.left = newPos + "px";
		} 
		// sonst links anzeigen
		else {
			myTree.style.left = myParRPos.left - (myDim.width - params.lyPadding) - myLeftOffset + "px";
		}
		/////////////////////////
		// top position
		//
		// wenn popup passt normal anzeigen
		if (myParAPos.top + (myDim.height - (2 * params.lyPadding)) + myTopOffset + params.vpOffset < myVP.height) {
			var newPos = myParRPos.top - params.lyPadding + myTopOffset;
			myTree.style.top = newPos + "px";
		} 
		// sonst wenn popup nicht groesser als viewport nach oben verschieben
		else if (myDim.height - (2 * params.lyPadding) + (2 * params.vpOffset) > myVP.height) {
			var newPos = - ((myParAPos.top - myParRPos.top) - params.vpOffset) // fehlt hier nicht padding?
			myTree.style.top = newPos + "px";
		} 
		// sonst popup ganz nach oben schieben
		else {
			var newPos = (- (myDim.height - ((myVP.height - params.vpOffset) - myParAPos.top))) + myParRPos.top;	
			myTree.style.top = newPos + "px";
		}
	}
}

function CloseSubtree(event, id) {
	isTimeout = true;
	window.setTimeout("HideTrees()", 500);
	myOpener = $(id).parentNode;
	event = event || window.event;
	var toElement = event.relatedTarget || event.toElement || false;
	if (toElement) {
		if (!$(toElement).descendantOf(myOpener)) {
			//log("echter mouseout: ("+id+")");
			HideTree(id);	
		}
	}
}

function HideTrees() {
	if(isTimeout) {
		myArray = [];
		for ( i in openedUL) {
			if (openedUL[i]) {
				myArray.push(i);
			}
		}
		myArray.reverse().each(function(s) {
			HideTree(s);
		});
	}
	isTimeout = false;
}

function HideTree(id) {
	//log("HideTree: ("+id+")");
	openedUL[id] = false;
	myTree = $(id);
	myTree.style.display = "none";
	myA = myTree.previous();
	tempClass = myA.className.gsub('\s*m*s*over\\b', '');	
	myA.className = tempClass;		
	//log("Hided: ("+id+") - "+myTree.style.display);
}

function ShowTree(id, isFirst, isDown) {
	openedUL[id] = true;
	myTree = $(id);
	SetTreePosition(id, isFirst, isDown);
	myTree.style.display = "block";	
	myA = myTree.previous();
	if (myA.match('a.menu_popup')) {
		myA.className += " mover";	
	} else {
		myA.className += " sover";
	}	
	//log("Showed: ("+id+") - "+myTree.style.display);
}


function LoadTree(id, isFirst, isDown) {
	tempId = id.gsub('m', '');
	var url = '/website?action=get_sub_navi_for_id&page_id='+tempId;
	new Ajax.Request(url, {
	  method: 'post',
	  onSuccess: function(transport) {
		myTree = $(id);
		if (transport.responseText != "") {
			myTree.update(transport.responseText);
			if (openedUL[id]) {
				ShowTree(id, isFirst, isDown);
			}
		} else {
			myLI = myTree.parentNode;
			myLI.onmouseover = "";
			myLI.onmouseout = "";
			HideTree(id);
		}
	  },
	  onFailure: function(transport) {
	  	//alert(transport.status+": "+transport.statusText);
		$(id).update("<li><a href='#' class='menu_popup'>Fehler ("+transport.status+")</a></li>");
	  }
	});
}