function PopupMenu(menuID, width, backgroundColor, borderColor)
{
	this.menuID = menuID;
	this.width = width;
	this.backgroundColor = backgroundColor;
	this.borderColor = borderColor;

	this.menuEntries = new Array();

	popupMenus.push(this);
}

PopupMenu.prototype.addEntry = addEntry;
PopupMenu.prototype.generatePopupMenu = generatePopupMenu;
PopupMenu.prototype.display = display;
PopupMenu.prototype.keepAlive = keepAlive;
PopupMenu.prototype.triggerHiding = triggerHiding;

function addEntry(menuEntry)
{
	this.menuEntries.push(menuEntry);
}

function generatePopupMenu()
{
	document.write("<div id='" + this.menuID + "' style='position:absolute; width:?px; height:?px; visibility:hidden;z-index:100;'>");

	document.write("<table border='0' cellpadding='0' cellspacing='0' width='" + this.width + "' onmouseover='" + this.menuID + ".keepAlive()' onmouseout='" + this.menuID + ".triggerHiding()'>");

	document.write("<tr>");
	document.write("<td colspan='7' bgcolor='" + this.borderColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
	document.write("</tr>");

	var i = 0;

	for (i = 0; i < this.menuEntries.length; i++)
	{
		document.write("<tr>");
		document.write("<td rowspan='2' bgcolor='" + this.borderColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
		document.write("<td colspan='5' bgcolor='" + this.backgroundColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='7'></td>");
		document.write("<td rowspan='2' bgcolor='" + this.borderColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
		document.write("</tr>");

		document.write("<tr>");
		document.write("<td bgcolor='" + this.backgroundColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='5' height='1'></td>");
		document.write("<td bgcolor='" + this.backgroundColor + "'><img src='" + this.menuEntries[i].icon + "' width='16' height='16'></td>");
		document.write("<td bgcolor='" + this.backgroundColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='5' height='1'></td>");
		document.write("<td bgcolor='" + this.backgroundColor + "' width='100%' nowrap='nowrap'><a href='" + this.menuEntries[i].linkURL + "' target='" +
			this.menuEntries[i].linkTarget + "' class='" + this.menuEntries[i].className + "' onmouseover='this.className=\"" + this.menuEntries[i].activeClassName + "\"' onmouseout='this.className=\"" + this.menuEntries[i].className + "\"'>" +
			this.menuEntries[i].name + "</a></td>");
		document.write("<td bgcolor='" + this.backgroundColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='5' height='1'></td>");
		document.write("</tr>");

		document.write("<tr>");
		document.write("<td bgcolor='" + this.borderColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
		document.write("<td colspan='5' bgcolor='" + this.backgroundColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='5'></td>");
		document.write("<td bgcolor='" + this.borderColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
		document.write("</tr>");

		var j = 0;

		for (j = 0; j < this.menuEntries[i].seperations.length; j++)
		{
			document.write("<tr>");
			document.write("<td bgcolor='" + this.borderColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
			document.write("<td bgcolor='" + this.backgroundColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
			document.write("<td colspan='3' bgcolor='" + this.menuEntries[i].seperations[j] + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
			document.write("<td bgcolor='" + this.backgroundColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
			document.write("<td bgcolor='" + this.borderColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
			document.write("</tr>");
		}
	}

	document.write("<tr>");
	document.write("<td colspan='7' bgcolor='" + this.borderColor + "'><img src='" + modulePaths['XoomK']['Design'] + "images/pix.gif' width='1' height='1'></td>");
	document.write("</tr>");

	document.write("</table>");
	document.write("</div>");
}

function display()
{
	if (activeMenuID != this.menuID)
	{
		showMenuPopup(this);
	}
	else
	{
		hidePopupMenu();
	}
}

function keepAlive()
{
	activeMenuLockedTime = 0;
}

function triggerHiding()
{
	if (activeMenuLockedTime == 0)
	{
		activeMenuLockedTime = menuLockTimeMillis;
	}
}


// -----

function PopupMenuEntry(icon, name, linkURL, linkTarget, className, activeClassName, seperations)
{
	this.icon = icon;
	this.name = name;
	this.linkURL = linkURL;
	this.linkTarget = linkTarget;
	this.className = className;
	this.activeClassName = activeClassName;
	this.seperations = seperations;
}


// -----

var popupMenus = new Array();
var activeMenuID = "";
var activeMenuLockedTime = 0;
var menuLockTimeMillis = 500;
var decreaseLockTimeMillis = 10;

window.setTimeout("decreaseLockTime(" + decreaseLockTimeMillis + ")", decreaseLockTimeMillis);

function showMenuPopup(popupMenu)
{
	activeMenuID = popupMenu.menuID;
	activeMenuLockedTime = 0;
	refreshMenuVisibility();
}

function hidePopupMenu()
{
	activeMenuID = "";
	activeMenuLockedTime = 0;
	refreshMenuVisibility();
}

function decreaseLockTime(decreaseLockTimeMillis)
{
	window.setTimeout("decreaseLockTime(" + decreaseLockTimeMillis + ")", decreaseLockTimeMillis);

	if (activeMenuLockedTime <= 0)
	{
		activeMenuLockedTime = 0;
		return;
	}

	activeMenuLockedTime = activeMenuLockedTime - decreaseLockTimeMillis;

	if (activeMenuLockedTime <= 0)
	{
		activeMenuID = "";
		activeMenuLockedTime = 0;

		refreshMenuVisibility();
	}
}

function refreshMenuVisibility()
{
	for (i = 0; i < popupMenus.length; i++)
	{
		var popupMenu = popupMenus[i];

		if (popupMenu.menuID == activeMenuID)
		{
			document.getElementById(popupMenu.menuID).style.left = mousePositionX;
			document.getElementById(popupMenu.menuID).style.top = mousePositionY + 10;
			document.getElementById(popupMenu.menuID).style.visibility = "visible";
		}
		else
		{
			document.getElementById(popupMenu.menuID).style.visibility = "hidden";
		}
	}
}
