// Menu item definitions - to be passed from HTML as DrawMenu() parameters
var Home        = 0;
var Services    = 1;
var Schedule    = 2;
var Events      = 3;
var Rates       = 4;
var Gallery     = 5;
var About       = 6;
var Location    = 7;
var Links       = 8;
var Contact     = 9;
var MailingList = 10;

var None        = 111;

var Groups   = 0;
var Lessons  = 1;
var Weddings = 2;
var Parties  = 3;

var Adults = 0;
var Kids  = 1;

function DrawMenu(id1, id2)
{
    // Menu background colors - to use for onmouseout event (OMO)
    var OMOMain = new Array(10);
    var ClassMain = new Array(10);
	for (var i = 0; i < 10; i ++) {
		OMOMain[i]="#000000";
		ClassMain[i]="upperdd";
	}
	OMOMain[10]="#000000";
	ClassMain[10]="underline";

	// Last item - process separately
	if (id1 == MailingList) {
		OMOMain[id1]="#660033";
		ClassMain[id1]="current";
	} else {
		OMOMain[id1]="#000000";
		ClassMain[id1]="upperdd";
		
		if (id1 != null) {
			OMOMain[id1]="#660033";
			ClassMain[id1]="upperddcurrent";
		}		
	} 
	
    var OMOServices = new Array(3);
    var ClassServices = new Array(3);
	for (var i = 0; i < 4; i ++) {
		OMOServices[i]="#000000";
		ClassServices[i]="underline";
	}
		
    var OMORates = new Array(1);
    var ClassRates = new Array(1);
	for (var i = 0; i < 4; i ++) {
		OMORates[i]="#000000";
		ClassRates[i]="underline";
	}
	
	if (id1 == Services) {
		if (id2 != null) {
			OMOServices[id2]="#660033";
			if (id2 == 3) {
				ClassServices[3]="notunderlinecurrent";
			} else {
				ClassServices[id2]="underlinecurrent";
			}
		}
	} else if (id1 == Rates) {
		if (id2 != null) {
			OMORates[id2]="#660033";
			if (id2 == 0) {
				ClassRates[0]="underlinecurrent";
			} else {
				ClassRates[1]="notunderlinecurrent";
			}
		}
	}

	// Draw the logo on the top of the page
	document.write('<div id="page">');
	document.write('	<div style="position: relative; top: 20px; height: 188px; z-index: 1">');
	document.write('		<div style="position: absolute; top: 0px; left: 0px; height: 129px; z-index: 1">');
	document.write('			<img src="Images/Logo.jpg" alt="Euroballroom Dancesport Studio" border="0"/>');
	document.write('		</div>');
	document.write('		<div style="position: absolute; left: 500px; width: 400px; top: 137px; z-index: 1; text-align: right; ">');
	document.write('			<span style="font-size: smaller;">255 Newtonville Avenue, Newton MA 02458 &nbsp;| &nbsp;617-641-6700</span>');
	document.write('		</div>');
	document.write('	</div>');

	// Draw the menu on the left
	document.write('	<div id="wrapper" style="z-index: 1">');
	document.write('		<div id="leftcolumn">');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="one-ddheader" class="' + ClassMain[Home] + '" onmouseover="this.style.color=\'#ffffcc\';" onmouseout="this.style.color=\'' + OMOMain[Home] + '\';" onclick="location.href=\'index.php\'">Home</dt>');
	document.write('			</dl>');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="two-ddheader" class="' + ClassMain[Services] + '" onmouseover="ddMenu(\'two\',1); this.style.color=\'#ffffcc\';" onmouseout="ddMenu(\'two\',-1); this.style.color=\'' + OMOMain[Services] + '\';">Services</dt>');
	document.write('					<dd id="two-ddcontent" onmouseover="cancelHide(\'two\')" onmouseout="ddMenu(\'two\',-1)">');
	document.write('						<ul>');
	document.write('							<li><a href="Groups.php" class="' + ClassServices[Groups] + '">Groups</a></li>');
	document.write('							<li><a href="Lessons.php" class="' + ClassServices[Lessons] + '">Private Lessons</a></li>');
	document.write('							<li><a href="Weddings.php" class="' + ClassServices[Weddings] + '">Wedding Dances</a></li>');
	document.write('							<li><a href="Parties.php" class="' + ClassServices[Parties] + '">Parties</a></li>');
	document.write('						</ul>');
	document.write('					</dd>');
	document.write('				</dt>');
	document.write('			</dl>');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="three-ddheader" class="' + ClassMain[Schedule] + '" onmouseover="this.style.color=\'#ffffcc\';" onmouseout="this.style.color=\'' + OMOMain[Schedule] + '\';" onclick="location.href=\'Schedule.php\'">Schedule</dt>');
	document.write('			</dl>');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="four-ddheader" class="' + ClassMain[Events] + '" onmouseover="this.style.color=\'#ffffcc\';" onmouseout="this.style.color=\'' + OMOMain[Events] + '\';" onclick="location.href=\'Events.php\'">Special Events</dt>');
	document.write('			</dl>');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="five-ddheader" class="' + ClassMain[Rates] + '" onmouseover="ddMenu(\'five\',1); this.style.color=\'#ffffcc\';" onmouseout="ddMenu(\'five\',-1); this.style.color=\'' + OMOMain[Rates] + '\';">Rates</dt>');
	document.write('					<dd id="five-ddcontent" onmouseover="cancelHide(\'five\')" onmouseout="ddMenu(\'five\',-1)">');
	document.write('						<ul>');
	document.write('							<li><a href="AdultRates.php" class="' + ClassRates[Adults] + '">Adults</a></li>');
	document.write('							<li><a href="KidsRates.php" class="' + ClassRates[Kids] + '">Kids and Teens</a></li>');
	document.write('						</ul>');
	document.write('					</dd>');
	document.write('				</dt>');
	document.write('			</dl>');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="six-ddheader" class="' + ClassMain[Gallery] + '" onmouseover="this.style.color=\'#ffffcc\';" onmouseout="this.style.color=\'' + OMOMain[Gallery] + '\';" onclick="location.href=\'Gallery.html\'">Gallery</dt>');
	document.write('			</dl>');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="seven-ddheader" class="' + ClassMain[About] + '" onmouseover="this.style.color=\'#ffffcc\';" onmouseout="this.style.color=\'' + OMOMain[About] + '\';" onclick="location.href=\'About.php\'">About</dt>');
	document.write('			</dl>');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="eight-ddheader" class="' + ClassMain[Location] + '" onmouseover="this.style.color=\'#ffffcc\';" onmouseout="this.style.color=\'' + OMOMain[Location] + '\';" onclick="location.href=\'Location.html\'">Location</dt>');
	document.write('			</dl>');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="nine-ddheader" class="' + ClassMain[Links] + '" onmouseover="this.style.color=\'#ffffcc\';" onmouseout="this.style.color=\'' + OMOMain[Links] + '\';" onclick="location.href=\'Links.php\'">Links</dt>');
	document.write('			</dl>');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="ten-ddheader" class="' + ClassMain[Contact] + '" onmouseover="this.style.color=\'#ffffcc\';" onmouseout="this.style.color=\'' + OMOMain[Contact] + '\';" onclick="location.href=\'Contact.html\'">Contact</dt>');
	document.write('			</dl>');
	document.write('			<dl class="dropdown">');
	document.write('				<dt id="eleven-ddheader" class="' + ClassMain[MailingList] + '" onmouseover="this.style.color=\'#ffffcc\';" onmouseout="this.style.color=\'' + OMOMain[MailingList] + '\';" onclick="location.href=\'MailingList.php\'">Mailing List</dt>');
	document.write('			</dl>');
	document.write('		</div>');	// Left column
	
	// Draw the right part of the screen
	document.write('		<div id="rightcolumnwrapper" style="z-index: 1; ">');
	if (id1 == Home) {
		document.write('		<div id="rightcolumntransparent" style="z-index: 1; ">');
	} else {
		document.write('		<div id="rightcolumn" style="z-index: 1; ">');
		document.write('		<div id="rightcolumntext" style="z-index: 1; ">');
	}
}