var mouseOverColor = "#FC8200";
var bgColor = "#E3411F";

function changeColor(elem, on)
{
	if (on)	elem.style.backgroundColor = mouseOverColor;
	else elem.style.backgroundColor = bgColor;
}

function changeState(currTD, state)
{
	var textEl = document.getElementById("span" + currTD.id);
	var sqrEl = document.getElementById("square" + currTD.id);
	
	if (state)	
	{
		if (textEl) textEl.style.display = "inline";
		if (sqrEl) sqrEl.style.backgroundColor = mouseOverColor;
	}
	else 
	{
		if (textEl) textEl.style.display = "none";	
		if (sqrEl) sqrEl.style.backgroundColor = bgColor;		
	}
}

var menuArray = 
[
	["Home", 			"main.html", 		"Home page"],
	["News", 			"news.html", 		"Latest Bandwidth news"],
	["Forthcoming", 	"forthcoming.html", "Future Bandwidth events"],
	["Previous events", "previous.html", 	"Previous Bandwidth events"],
	["DJs",			 	"djs.html",			"Bandwidth's DJ pool"],
	["Contact", 		"contact.html",		"How to contact us"],
	["Links", 			"links.html",		"Other related links"],
	["Downloads", 		"download.html",	"Stuff for you"],
	["Photos", 			"photos.php",		"Photo's from the nights"],
	["Brighton",		"http://www.compsoc.man.ac.uk/~fluff/bandwidth/brightonmain.html","Bandwidth at Brighton"]
];

function showMenu(page)
{
	document.write("<table cellpadding=0 cellspacing=0 width=100%>\n");
	
	for (var l=0; l<menuArray.length; l++)
	{
		document.write("<tr><td>\n");

		document.write("<table id='" + (l + 1) + "'");
		if (l != page) document.write(" onmouseover='changeState(this, 1)' onmouseout='changeState(this, 0)' onclick='window.location=\"" + menuArray[l][1] + "\"'");
		document.write(" width=100% cellpadding=0 cellspacing=0>\n");
		document.write("<tr>\n");
		if (l != page) document.write("<td class='menuText'");
		else document.write("<td class='menuTextSelected'");
		if (l == menuArray.length-1) document.write(" style='border-bottom-width: 1px'");
		document.write(">" + menuArray[l][0] + "</td>\n");
		document.write("<td width=20 ");
		if (l != page) document.write("class='menuItem' ");
		else document.write("class='menuItemSelected' ");
		document.write("id='square" + (l + 1) + "' style='border-right-width: 1px;");
		if (l == menuArray.length-1) document.write(" border-bottom-width: 1px");
		document.write("'>&nbsp;</td>\n");
		document.write("</tr>\n");
		document.write("</table>\n");
		document.write("<td></tr>\n");
	}
	document.write("</table>\n");
}

function op_divs(page)
{
	for (var l=0; l<menuArray.length; l++)
	{
		document.write("<span class='info' id='span" + (l+1) + "'>&nbsp;&nbsp;" + menuArray[l][2] + "</span>\n");
	}
}

var visibleDiv = null;

function setDivState(currDiv, state)
{
	var el = document.getElementById(currDiv);
	if (document.all) var ev = window.event;
	else var ev = Event;
	
	if (state) 
	{
		el.style.top = ev.clientY + 20;
		el.style.left = ev.clientX - 190;
		el.style.display = 'block';
		if (visibleDiv != null && visibleDiv != el) visibleDiv.style.display = 'none';
		visibleDiv = el;
	}
	else 
	{
		el.style.display = 'none';
		visibleDiv = null;
	}
}

function op_box_divs()
{
	for (var l=0; l<boxDetails.length; l++)
	{
		document.write("<div style=\"width: " + boxDetails[l][3] + "px; height: " + boxDetails[l][4] + "px;\" class=\"float\" id=\"" + boxDetails[l][0] + "\">\n");
		document.write("<table width=100% height=100% cellpadding=0 cellspacing=0 valign=\"top\" border=0>\n");
		document.write("<tr>\n");
		document.write("<td class=\"titleBar\">" + boxDetails[l][1] + "</td>\n");
		document.write("<td class=\"titleBar\" valign=\"top\" style=\"text-align: right\">\n");
		document.write("<a href=\"javascript: setDivState('" + boxDetails[l][0] + "', 0)\">\n");
		document.write("<img alt=\"Close This Box\" src=\"images/close.gif\" width=16 height=16 border=0>\n");
		document.write("</a>\n");
		document.write("</td>\n");
		document.write("</tr>\n");
		document.write("<tr>\n");
		document.write("<td colspan=2 align=\"left\" class=\"divText\" valign=\"top\">\n");
		document.write("" + boxDetails[l][2] + "\n");
		document.write("</td>\n");
		document.write("</tr>\n");
		document.write("</table>\n");
		document.write("<div style=\"width: " + boxDetails[l][3] + "; height: " + (boxDetails[l][4]-16) + ";\" class=\"opaque\">\n");
		document.write("Hi\n");
		document.write("</div>\n");
		document.write("</div>\n");
	}
}

var inputInFocus = null;
function inputFocus(el, over)
{
	if (!over) inputInFocus = el;
	el.style.backgroundColor = mouseOverColor; 
	el.style.color = 'white';
}

function inputBlur(el)
{
	inputInFocus = null;
	el.style.backgroundColor = 'white'; 
	el.style.color = 'black';
}