// JavaScript Document
// V2.0 rc (v10)

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

(function(window, undefined) {

var M = { Version: "2.1.08" };

var openedUL = new Object();
var treesToHide = new Array();
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 */
	isDown: false /* boolean isDown : ist es eine horizontale navi? */
};

M.onLastMenuClosed = function() {};
M.onFirstMenuOpened = function() {};
M.onShowMenu = function() {};
M.onMenuLoaded = function(tree) {};

M.init = function(initParams) {
	var myNavi = $j("#my_navi"); // wird verschoben, beinhaltet alle Ebenen ab 1 + Ebene 0, ggf. + parents
	var globalUL = $j("#main_ul"); // enthaelt nur alle Ebenen ab 1
	var myTarget = $j("#div_main_inner"); // hier soll die Navi hinverschoben werden
	var myPlaceholder = $j("#navi_container"); // Platzhalter fuer die verschobene Navi
	
	if (!myNavi.length) return; // es gibt keine Navi!
	
	// wenn die li im ul floaten
	if (globalUL.height() == 0) {
		globalUL.css("position", "absolute");
		globalUL.css("height", globalUL.height());
		globalUL.css("width", globalUL.width());
		globalUL.css("position", "");
	}

	myTarget.css("position", "relative");	
	var myOffsets = myNavi.position();
	var myWidth = myNavi.width();
	var myHeight = myNavi.height();
	myNavi.css("position", "absolute");
	myNavi.css("top", myOffsets.top + 'px');
    myNavi.css("left", myOffsets.left + 'px');
    myNavi.css("width", myWidth + 'px');
    myNavi.css("height", myHeight + 'px');
	
	myPlaceholder.css("height", myHeight + "px");
	myTarget.append(myNavi);
	
	// Konfiguration ggf. mit lokalen params ueberschreiben/erweitern
	initParams = initParams || {};
	for(var p in initParams) params[p] = initParams[p];
	
	globalUL.mouseover(function() { 
		hideTrees();
	});
	$j("li.submenu", globalUL).mouseenter(function(event, isFirst, isDown) {
		var myUL = $j("> ul", this);
		var id = myUL.attr("id");
		//log("--> mouseenter (" + id + ")");		
		if (id == "") {
			$j(this).unbind("mouseenter").unbind("mouseleave");
			return;
		}
		var idx = $j.inArray(id, treesToHide);
		if (idx != -1) treesToHide.splice(idx, 1);
		window.clearTimeout(myUL.data("timeout"));
		if (openedUL[id])
			return;
		else if ($j("> li.empty", myUL).length > 0)
			loadTree(id, true, params.isDown);
		else
			showTree(id, true, params.isDown);
	}).mouseleave(function(event) {
		var myUL = $j("> ul", this);
		var id = myUL.attr("id");
		if (id == "") return;
		//log("--> mouseleave (" + id + ")");
		var idx = $j.inArray(id, treesToHide);
		if (idx == -1) treesToHide.push(id);
		myUL.data("timeout", window.setTimeout("EcicsMenu.hideTree('" + id + "')", 400));
	});
};


function log (message) {
	if (typeof console != "undefined") {
		console.log(message);
	}
}

function setTreePosition(id, isFirst, isDown) {
	var myTree = $j("ul#"+id);
	var myPar = myTree.parent();
	var myParAPos = myPar.offset();
	var myParRPos = myPar.position();
	var myParDim = { width: myPar.width(), height: myPar.height() };
	var myDim = { width: myTree.width(), height: myTree.height() };
	var myVP = { width: $j(window).width(), height: $j(window).height() };
	var scrollPos = { top: $j(window).scrollTop(), left: $j(window).scrollLeft() };
	isFirst = isFirst || false;
	isDown = isDown || false;
	var myTopOffset = isFirst ? params.firstTop : params.secTop;
	var myLeftOffset = isFirst ? params.firstLeft : params.secLeft;
	var newPos = { top: 0, left: 0 };
	
	myTree.css("position", "absolute");
	
	// nach unten klappen
	if (isDown) {
		//myParDim = myPar.getDimensions();  // erneut setzen da es problem in baden gab
		//myParRPos = myPar.positionedOffset(); // erneut setzen da es problem in baden gab
		/////////////////////////
		// left position	
		// 
		// wenn popup rechts passt normal anzeigen		
		//log(myParRPos.left + " : " + myParDim.width + " : " + params.lyPadding + " : " + myLeftOffset);		
		if (myParAPos.left + (myDim.width - (2 * params.lyPadding)) + myLeftOffset + params.vpOffset < myVP.width) {
			newPos.left = myParRPos.left - params.lyPadding + myLeftOffset;
		} 
		// sonst nach links verschieben
		else {
			newPos.left = (myParRPos.left + myParDim.width) - (myDim.width - params.lyPadding);
		}
		/////////////////////////
		// top position
		// hier keine abfrage, soll immer unterhalb des Items angezeigt werden
		newPos.top = myParRPos.top + myParDim.height - params.lyPadding + myTopOffset;
		
	}
	// 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 + (myDim.width - (2 * params.lyPadding)) + myLeftOffset + params.vpOffset < myVP.width) || (myParAPos.left - (myDim.width - (2 * params.lyPadding)) - myLeftOffset < params.vpOffset)) {  // warum -0
			newPos.left = myParRPos.left + myParDim.width + myLeftOffset - params.lyPadding;
		} 
		// sonst links anzeigen
		else {
			newPos.left = myParRPos.left - (myDim.width - params.lyPadding) - myLeftOffset;
		}
		/////////////////////////
		// top position
		//
		// wenn popup passt normal anzeigen
		if (myParAPos.top + (myDim.height - (2 * params.lyPadding)) + myTopOffset + params.vpOffset < myVP.height + scrollPos.top) {
			newPos.top = myParRPos.top - params.lyPadding + myTopOffset;
		} 
		// sonst wenn popup nicht groesser als viewport nach oben verschieben
		else if (myDim.height - (2 * params.lyPadding) + (2 * params.vpOffset) > myVP.height) {
			newPos.top = scrollPos.top -((myParAPos.top - myParRPos.top)); // fehlt hier nicht padding?
		} 
		// sonst popup ganz nach oben schieben
		else {
			newPos.top = myParRPos.top - (myDim.height - (((myVP.height + scrollPos.top) - params.vpOffset) - myParAPos.top)) ;
		}
		
	}
	// Element positionieren
	myTree.css("left", newPos.left).css("top", newPos.top);
	//log(scrollPos);
}

function hideTrees() {
	//log(treesToHide);
	treesToHide = $j.grep(treesToHide, function(v, i) {
		return M.hideTree(v);
	}, true);
}

M.hideTree = function(id) {
	var no = getNumberOpendedUL();
	openedUL[id] = false;
	var myTree = $j("ul#"+id);
	myTree.hide();
	myTree.siblings("a").removeClass("sover mover");
	//log("Hided: ("+id+")");
	if (getNumberOpendedUL() == 0 && no > 0)
		M.onLastMenuClosed();
	return true;
};

function showTree(id, isFirst, isDown) {
	//log("-----showTree");
	openedUL[id] = true;
	var myTree = $j("ul#"+id);
	setTreePosition(id, isFirst, isDown);
	myTree.show();	
	var myA = myTree.siblings("a");
	if (myA.hasClass("menu_popup")) myA.addClass("mover");	
	else myA.addClass("sover");
	if (getNumberOpendedUL() == 1)
		M.onFirstMenuOpened();
	M.onShowMenu();
	//log("Showed: ("+id+")");
}

function getNumberOpendedUL() {
	var size = 0;
	for (key in openedUL) {
		if (openedUL[key] == true) size++;
	}
	return size;
}


function loadTree(id, isFirst, isDown) {
	var tempId = id.replace('m', '');
	openedUL[id] = true;
	$j.ajax({
		url: "/website",
		data: { action: "get_sub_navi_for_id", page_id: tempId },
		dataType: "text",
		type: "POST",
		success: function(data, textStatus, jqXHR) {
			var myTree = $j("ul#" + id);
			if (data != "") {
				var newData = $j("<div>").html(data);
				newData.find("li.submenu").mouseenter(function(event) {
					var myUL = $j("> ul", this);
					var id = myUL.attr("id");
					//log("--> mouseenter (" + id + ")");		
					if (id == "") {
						$j(this).unbind("mouseenter").unbind("mouseleave");
						return;
					}
					var idx = $j.inArray(id, treesToHide);
					if (idx != -1) treesToHide.splice(idx, 1);
					window.clearTimeout(myUL.data("timeout"));
					if (openedUL[id])
						return;
					else if ($j("> li.empty", myUL).length > 0)
						loadTree(id, false, false);
					else
						showTree(id, false, false);
				}).mouseleave(function(event) {
					var myUL = $j("> ul", this);
					var id = myUL.attr("id");
					if (id == "") return;
					//log("--> mouseleave (" + id + ")");
					var idx = $j.inArray(id, treesToHide);
					if (idx == -1) treesToHide.push(id);
					myUL.data("timeout", window.setTimeout("EcicsMenu.hideTree('" + id + "')", 400));
				});
				myTree.html(newData.find("> li"));
				M.onMenuLoaded(myTree);
				if (openedUL[id])
					showTree(id, isFirst, isDown);
			} else {
				myTree.parent().unbind("mouseenter").unbind("mouseleave");
				openedUL[id] = false;
				myTree.remove();
			}
		},
		error: function(jqXHR, textStatus, errorThrown) {
			var myTree = $j("ul#" + id);
			myTree.parent().unbind("mouseenter").unbind("mouseleave");
			openedUL[id] = false;
			myTree.remove();
		}
	});
}

window.EcicsMenu = M;

})(window);

// alt fur V1
function initMenu(pramams) { EcicsMenu.init(params); }
function GetSubtree(e, id){}
function CloseSubtree(e, id){}