var timeoutId = null;

function toggleCell()
{
	// Check we have the correct element, and not the A tag child.
	var srcCell;
	if (event.srcElement.tagName == "TD")
	{
		srcCell = event.srcElement;
	}
	else
	{
		srcCell = event.srcElement.parentElement;
	}
	
	// Now change the style of the button.
	if (event.type == "mouseover")
	{
		highlightCell(srcCell);
	}
	else
	{
		unhighlightCell(srcCell);
	}
}

function highlightCell(srcCell)
{
	if (timeoutId != null)
	{
		clearTimeout(timeoutId);
	}
	
	srcCell.className = srcCell.className.replace("Out","Over");
	//window.status = srcCell.className;
	//srCell.className = "menuCellOver";
	
	if (srcCell.id == "cat05" || srcCell.id == "cat04" || srcCell.id == "cat06")
	{
		var pos = findPos(srcCell.id);
		var category = srcCell.id;
		var cell = "sub" + category;
		var myCell = document.getElementById(cell);
	
		if (typeof(srcCell) != "object") { problem = true; strProblem += "-\tThe category '" + category + "' could not be found on the page.\n" };
		if (typeof(pos.x) != "number" || isNaN(pos.x)) { problem = true; strProblem += "-\tThe x position of the category '" + category + "' has not been found.\n" };
		if (typeof(pos.y) != "number" || isNaN(pos.y)) { problem = true; strProblem += "-\tThe y position of the category '" + category + "' has not been found.\n" };
		if (typeof(pos.width) != "number") { problem = true; strProblem += "-\tThe width of the category '" + category + "' has not been found.\n" };
		if (typeof(pos.height) != "number") { problem = true; strProblem += "-\tThe height of the category '" + category + "' has not been found.\n" };
	
		if (!errorAlert())
		{
			if (myCell != null) // Otherwise a sub menu doesn't seem to exist.
			{
				hideAll();
						
				var myLeft = pos.x - 1;
				var myCategoryHeight = stripPX(srcCell.currentStyle.height);
				var myTop = pos.y + myCategoryHeight;

				myCell.style.display = "block";
				myCell.style.top = myTop + "px";
				myCell.style.left = myLeft + "px";
				//doTimeout = true;
				//timeoutId = setTimeout("doTimeoutFunction()",1000);
			}
		}
	}
}

function doTimeoutFunction()
{
	if (timeoutId != null)
	{
		hideAll();
	}
	else
		return;
}

function hideAll()
{
	//document.getElementById("subcat01").style.display = "none";
	//document.getElementById("subcat02").style.display = "none";
	//document.getElementById("subcat03").style.display = "none";
	document.getElementById("subcat04").style.display = "none";
	document.getElementById("subcat05").style.display = "none";
	document.getElementById("subcat06").style.display = "none";
	clearTimeout(timeoutId);
}

function unhighlightCell(srcCell)
{
	doTimeout = true;
	srcCell.className = srcCell.className.replace("Over","Out");
	//srcCell.className = "menuCellOut";
	closeSubCategory();
}

function closeSubCategory()
{
	myToElement = window.event.toElement;
	myFromElement = window.event.fromElement;
	mySrcElement = window.event.srcElement;
  
	if (myToElement != null)
	{
		if(
			(myToElement.className == "subMenuTable") ||
			(myToElement.className == "menuTable") ||
			(myToElement.className == "menuCell") ||
			(myToElement.className == "menuCellOver") ||
			(myToElement.className == "menuCellOut") ||
			(myToElement.className == "subMenuCell") ||
			(myToElement.className == "subMenuCellOver") ||
			(myToElement.className == "subMenuCellOut")
			)
		{
			// Then we don't want to close it.
			clearTimeout(timeoutId);
			timeoutId = null;
		}
		else
		{
			timeoutId = setTimeout("doTimeoutFunction()",1000);
			//hideAll();
		}
	}
}

function hideSubCategories(subcategories)
{
	document.getElementById(subcategories).style.visibility = "hidden";
}