// Element Positioning and Connecting Stuff - can be used by non "menuing" stuff
function getWindowDimensions() {
	return document.viewport.getDimensions();
}

function setMenuPosition(posWhat, relativeTo, orientation, offset){
	var relElem = $(relativeTo);
	var posElem = $(posWhat);
	if(relElem){
		var relCoords = relElem.cumulativeOffset();
		var top = relCoords.top; //default top to top of elem passed in
		var left = relCoords.left; //default left to left of elem passed in
		if(orientation.indexOf("h") > -1){
			// horizontal menu add height of element
			top = relCoords.top + relElem.offsetHeight;
			// if aligned right (r) then do that here for horizontal menu too
			if(orientation.indexOf("r") > -1){
				left = relCoords.left + relElem.offsetWidth - posElem.offsetWidth;
			}
		}else{
			//vertical (v) menus - top stays default
			if(orientation.indexOf("r") > -1){
				left = relCoords.left - 10 + relElem.offsetWidth;
			}else{
				left = relCoords.left - posElem.offsetWidth;
			}
		}
		if(offset){
			if(offset.hAdjust){
				left = left + offset.hAdjust;
			}
			if(offset.vAdjust){
				top = top + offset.vAdjust;
			}
		}
		if(((left + posElem.offsetWidth) > getWindowDimensions().width) && (orientation == "hl" || orientation == "vr")){
			// If menu will go off the right of the page, re-orient the menu
			if(orientation == "hl"){
				setMenuPosition(posWhat, relativeTo, "hr",offset);
			}
			if(orientation == "vr"){
				setMenuPosition(posWhat, relativeTo, "vl",offset);
			}
			return;
		}
		posElem.style.top = top + "px";
		posElem.style.left = left + "px";
	}
}

function connectPopupToElement(params){
	params = params || {};
	setMenuPosition(params.popupId, params.connectTo, params.orientation, params.offset);

	// For when menu is triggered
	$(params.connectTo).onmouseover = function() { 
		if(params.fadeIn) fadeInItem(params.fadeIn); 
		showMenus(params.menuFamily); 
	};
	$(params.connectTo).onmouseout = function() { hideMenus(params.menuFamily) };
	
	// For when menu is sustained while hovering over the menu itself
	$(params.popupId).onmouseover = function() { showMenus(params.menuFamily); };
	$(params.popupId).onmouseout = function() { hideMenus(params.menuFamily) };
}

// End Element Positioning and Connecting stuff

function fadeInItem(item){
	if(item){
		if($(item)){
			$(item).style.display = "none";
			$(item).style.visibility = "visible";
			Effect.Appear(item, {duration: .25});
		}
	}
}

function showMenus(menus){
	var i = 0;
	for(i; i < menus.length; i++){
		if($(menus[i])){
			$(menus[i]).style.visibility = "visible";
		}
	}
}

function hideMenus(menus){
	var i = 0;
	for(i; i < menus.length; i++){
		if($(menus[i])){
			$(menus[i]).style.visibility = "hidden";
		}
	}
}

var Menu = function(params, menuFamily){
	var menuId = params.menuId;
	var connectTo = params.connectTo;
	var orientation = params.orientation;
    var menuItems = [];
	var menuFamily = menuFamily || [];

	menuFamily.push(menuId);

	return{
		addMenuItem : function(menuItem){
			menuItems.push(menuItem);
		},
		addToDocument : function(){
			if(!$(params.menuId)){
				// If not already created - onresize may call this function over again, shouldn't rebuild, just reconnect
				var output = [];
				
				var tableElem = document.createElement("table");
				tableElem.setAttribute("cellspacing", "0");
				tableElem.style.position = "absolute"; 
				tableElem.style.display = "block";
				tableElem.style.visibility = "hidden";
				tableElem.className = params.className || "dropdown";
				tableElem.id = menuId;
				var bodyElem = document.createElement("tbody");
				tableElem.appendChild(bodyElem);
				
				var i = 0;
				for(i; i < menuItems.length; i++){
					var trElem = document.createElement("tr");
					var tdElem = document.createElement("td");
					tdElem.id = menuItems[i].getId();
					var useAnchor = menuItems[i].getAsAnchorElement();
					if(menuItems[i].getSubMenu()){
						var useClass = "hasSubMenu" + params.orientation;
						useAnchor.className = useAnchor.className ? useAnchor.className + " " + useClass : useClass;
					}
					tdElem.appendChild(useAnchor);
					trElem.appendChild(tdElem);
					bodyElem.appendChild(trElem);
					tableElem.appendChild(bodyElem);
				}

				document.body.appendChild(tableElem);
			}
			connectPopupToElement({fadeIn: menuId, popupId: menuId, menuFamily: menuFamily, connectTo: connectTo, orientation: orientation, offset: params.offset});
		}
	}
};

var MenuItem = function(id, text, link, subMenu){
	var id = id;
	var text = text;
	var link = link;
	var subMenu = subMenu;

	return {
		getAsAnchorElement : function(){
			var elem = document.createElement("a");
			elem.href = link;
			elem.innerHTML = text;
			elem.style.display = "block";
			return elem;
		},
		getSubMenu : function(){
			return subMenu;
		},
		getId : function(){
			return id;
		}
	}
};