var curMenu;
var curTimer;

function popup(callingMenu, subMenu) {

	var myCallingMenuNodes = document.getElementsByName(callingMenu);
	if ( myCallingMenuNodes.length > 0 ) {
		var myCallingMenu = myCallingMenuNodes[0];
	}
	var myCallingMenuPos = getPosition(myCallingMenu);
	var myMenu = document.getElementById(subMenu);

	if ( curMenu != null && curMenu != "undefined" ) {
		if ( curMenu.getAttribute("Name")  == myMenu.getAttribute("Name") ) {
			clearTimeout(curTimer);
			changeOpac(100, myMenu);
		}
	}
	myMenu.style.position = "absolute";
	myMenu.style.left = myCallingMenuPos[0] + 18 + "px";
	myMenu.style.top = myCallingMenuPos[1] + myCallingMenu.offsetHeight + "px";
	myMenu.onmouseover = function() {
		popup(callingMenu, subMenu);
	};
	myMenu.style.visibility = "visible";
}

function popdown(subMenu) {

	var myMenu = document.getElementById(subMenu);
	doFade(myMenu, 100);

}

function doFade(target, myOpacity) {

	changeOpac(myOpacity, target);
	curMenu = target;

	myOpacity -= 10;
	if ( myOpacity >= 0 ) {
		curTimer = setTimeout(function() {
			doFade(target, myOpacity);
			}
		, 10);
	}
	else {
		target.style.visibility = "hidden";
		changeOpac(100, target);
	}
}

function changeOpac(opacity, id) {
    var object = id.style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
}


function getPosition(theElement) {
	var positionX = 0;
	var positionY = 0;

	while (theElement != null) {
		positionX += theElement.offsetLeft;
		positionY += theElement.offsetTop;
		theElement = theElement.offsetParent;
		}
	return [positionX, positionY];
}

function createSubmenu(subMenuName, linkArr, attachTo) {
	var attachToName;
	var attachMenu;
	var myFunction = new Array();

	var newSubmenu = document.createElement("div");
	newSubmenu.setAttribute("id", subMenuName);
	newSubmenu.setAttribute("name", subMenuName);
	newSubmenu.setAttribute("class", "pulldown");
	newSubmenu.setAttribute("className", "pulldown");
	attachEventListener(newSubmenu, 'mouseout', function () { popdown(subMenuName); }, false);
	for (var i=0; i < linkArr.length; i++) {
		var newDiv = document.createElement("div");
		newDiv.setAttribute("id", "submenuwrapper" + i);
		newDiv.setAttribute("class", "subitemwrapper");
		newDiv.setAttribute("className", "subitemwrapper");
		newSubmenu.appendChild(newDiv);
		var newSubDiv = document.createElement("div");
		newSubDiv.setAttribute("id", "submenu" + i);
		newSubDiv.setAttribute("class", "subitem");
		newSubDiv.setAttribute("className", "subitem");
		newSubDiv.innerHTML = "<a href=\""+ linkArr[i][1] +"\""+linkArr[i][2]+">" + linkArr[i][0] +"</a>";
		newDiv.appendChild(newSubDiv);
	}
	document.body.appendChild(newSubmenu);
	if (attachTo instanceof Array) {
		for (var j=0; j < attachTo.length; j++ ) {
			attachMenuNodes = document.getElementsByName(attachTo[j]);
			if ( attachMenuNodes.length > 0 ) {
				var attachMenu = attachMenuNodes[0];
			}
			attachToName = attachTo[j];
			setEvent(attachToName, attachMenu, subMenuName);
		}
	}
	else {
		attachMenuNodes = document.getElementsByName(attachTo);
		if ( attachMenuNodes.length > 0 ) {
			var attachMenu = attachMenuNodes[0];
		}
		attachEventListener(attachMenu, 'mouseover', function () { popup(attachTo, subMenuName); }, false);
		attachEventListener(attachMenu, 'mouseout', function () { popdown(subMenuName); }, false);
	}
}

function setEvent(attachMenuName, attachMenuObj, subMenu) {

	attachEventListener(attachMenuObj, 'mouseover',  function () { popup(attachMenuName, subMenu); }, false);
	attachEventListener(attachMenuObj, 'mouseout', function () { popdown(subMenu); }, false);

}

function attachEventListener(target, eventType, functionRef, capture) {
	if (typeof target.addEventListener != "undefined") {
		target.addEventListener(eventType, functionRef, capture);
	}
	else if (typeof target.attachEvent != "undefined") {
		target.attachEvent("on" + eventType, functionRef);
	}
	else 	{
		eventType = "on" + eventType;

		if (typeof target[eventType] == "function") {
			var oldListener = target[eventType];

			target[eventType] = function() {
				oldListener();

				return  functionRef();
			}
		}
		else {
			target[eventType] = functionRef;
		}
	}

	return true;
}

