// Drop down menu library


// global menu state

var menuReady = false;

// precahe menubar image pairs

if(document.images) {

	var imagesNormal = new Array();
	imagesNormal["pool"]= new Image(19,99);
	imagesNormal["pool"].src = "images/pool.jpg";
	imagesNormal["fitness"]= new Image(19,124);
	imagesNormal["fitness"].src = "images/fitness.jpg";
	imagesNormal["events"]= new Image(19,91);
	imagesNormal["events"].src = "images/events.jpg";
	imagesNormal["amusements"]= new Image(19,137);
	imagesNormal["amusements"].src = "images/amusements.jpg";
	imagesNormal["bodytreat"]= new Image(19,137);
	imagesNormal["bodytreat"].src = "images/menu2_05.jpg";


	var imagesHilite = new Array();
	imagesHilite["pool"]= new Image(19,99);
	imagesHilite["pool"].src = "images/poolOn.jpg";
	imagesHilite["fitness"]= new Image(19,124);
	imagesHilite["fitness"].src = "images/fitnessOn.jpg";
	imagesHilite["events"]= new Image(19,91);
	imagesHilite["events"].src = "images/eventsOn.jpg";
	imagesHilite["amusements"]= new Image(19,137);
	imagesHilite["amusements"].src = "images/amusementsOn.jpg";
	imagesHilite["bodytreat"]= new Image(19,137);
	imagesHilite["bodytreat"].src = "images/menu2_05On.jpg";

}

function getElementStyle(elem, IEStyleProp, CSSStyleProp) {

	if(elem.currentStyle){
		return elem.currentStyle[IEStyleProp];
	}else if (window.getComputedStyle){
		var compStyle = window.getComputedStyle(elem,"");
		return compStyle.getPropertyValue(CSSStyleProp);
	}
	return "";
	
}

// carry over some style sheet attribute values
var CSSRuleValues = {menuItemHeight:"19px",
			menuItemLineHeight:"1.1em",
			menuWrapperBorderWidth:"1px",
			menuWrapperPadding:"3px",
			defaultBodyFontSize:"12px"
		};


// specifications for menu contents and menubar image associations
var menus=new Array();
menus[0] = {mBarImgId:"menuImg_1",
	mBarImgNormal:imagesNormal["pool"],
	mBarImgHilite:imagesHilite["pool"],
	menuItems:[
	{text:"Facilities", href:"swimming.html"},
	{text:"Opening Times/ Prices", href:"poolTime.html"},
	{text:"Swimming Lessons", href:"poolLessons.html"},
	{text:"Aquafit", href:"poolaqua.html"},
	{text:"Group Bookings", href:"poolBooking.html"},
	{text:"Clubs", href:"poolClubs.html"}

	],
	elemId:""
	};


menus[1] = {mBarImgId:"menuImg_2",
	mBarImgNormal:imagesNormal["fitness"],
	mBarImgHilite:imagesHilite["fitness"],
	menuItems:[
	{text:"Facilities", href:"fitness.html"},
	{text:"Member Benefits", href:"fitBenefits.html"},
	{text:"Membership", href:"fitMember.html"},
	{text:"Classes & Schedules", href:"fitClasses.html"}
	],
	elemId:""
	};

			
			
			

	
menus[2] = {mBarImgId:"menuImg_3",
	mBarImgNormal:imagesNormal["events"],
	mBarImgHilite:imagesHilite["events"],
	menuItems:[
	{text:"Event Facilities", href:"events.html"},
	{text:"Technical Specifications", href:"eventtech.html"},
	{text:"Support Rooms", href:"eventRooms.html"}
	],
	elemId:""
	};

menus[3] = {mBarImgId:"menuImg_4",
	mBarImgNormal:imagesNormal["amusements"],
	mBarImgHilite:imagesHilite["amusements"],
	menuItems:[],
	elemId:""
	};

menus[4] = {mBarImgId:"menuImg_5",
	mBarImgNormal:imagesNormal["bodytreat"],
	mBarImgHilite:imagesHilite["bodytreat"],
	menuItems:[],
	elemId:""
	};


// create hash table-like lookup for menu objects with id string indexes
function makeHashes() {
	for(var i = 0; i < menus.length; i++) {
		menus[menus[i].elemId]=menus[i];
		menus[menus[i].mBarImgId]=menus[i];
	}
}

// assign menu label image event handlers
function assignLabelEvents()
{
	var elem;
	for( var i = 0; i < menus.length; i++){
		elem = document.getElementById(menus[i].mBarImgId);
		elem.onmouseover = swap;
		elem.onmouseout = swap;
	}
}

// invoked from initMenu(), generates the menu div elements and their contents
// this action is invisible to the user during construction
function makeMenus() {
	var menuDiv, menuItem, itemLink, mbarImg, textNode, offsetLeft, offsetTop;
	// determine key adjustment factors for the total height of menu divs
	var menuItemH = 0;
	var bodyFontSize = parseInt(getElementStyle(document.body, "fontSize", "font-size"));
	// test to see if browser's font size has been adjusted by the user
	// and that the new size registers as an applied style property
	if(bodyFontSize == parseInt(CSSRuleValues.defaultBodyFontSize)) {
		menuItemH = (parseFloat(CSSRuleValues.menuItemHeight));
	}else {
		// works nicely in Netscape 7
		menuItemH = parseInt(parseFloat(CSSRuleValues.menuItemLineHeight) * bodyFontSize);
	}
	var heightAdjust = parseInt(CSSRuleValues.menuWrapperPadding)+
	parseInt(CSSRuleValues.menuWrapperBorderWidth);
	if(navigator.appName == "Microsoft Internet Explorer" && 
	navigator.userAgent.indexOf("Win") != -1 && 
	(typeof document.compatMode == "undefined" || document.compatMode == "BackCompat"))
	{heightAdjust -= heightAdjust; menuItemH *= 1.1;}
	// use menus array to drive div creation loop
	menuItemH += 1;
	for(var i = 0; i < menus.length; i++){
		menuDiv = document.createElement("div");
		menuDiv.id = "popupmenu" + i;
		// preserve menu's ID as property of the menus array item
		menus[i].elemId = "popupmenu" + i;
		menuDiv.className = "menuWrapper";
		if (menus[i].menuItems.length > 0) {
			menuDiv.style.height = (menuItemH * menus[i].menuItems.length) - heightAdjust + "px";
		} else {
			// don't display any menu div lacking menu items
			menuDiv.style.display="none";
		}
		
		// define event handalers
		
		menuDiv.onmouseover = keepMenu;
		menuDiv.onmouseout = requestHide;
		
		// Set stacking order in case other layers are around the page
		menuDiv.style.zIndex= 1000;
		// assemble menu item elements for inside menu div
		for (var j = 0; j < menus[i].menuItems.length; j++) {
			
			menuItem = document.createElement("div");
			menuItem.id = "popupmenuItem_" + i + "_" + j;
			menuItem.className = "menuItem";
			menuItem.onmouseover = toggleHighlight;
			menuItem.onmouseout = toggleHighlight;
			menuItem.onclick = hideMenus;
			menuItem.style.top = menuItemH * j + "px";
			itemLink = document.createElement("a");
			itemLink.href = menus[i].menuItems[j].href;
			itemLink.className = "menuItem";
			itemLink.onmouseover = toggleHighlight;
			itemLink.onmouseout = toggleHighlight;
			
			textNode = document.createTextNode(menus[i].menuItems[j].text);
			itemLink.appendChild(textNode);
			menuItem.appendChild(itemLink);
			menuDiv.appendChild(menuItem);
		}
		// append each menu div to the body
		document.body.appendChild(menuDiv);
	}
	makeHashes();
	assignLabelEvents();
	// pre-position menu
	for(i = 0; i < menus.length; i++) {
		positionMenu(menus[i].elemId);
	}
	menuReady = true;
}

// initialise global that helps manage menu hiding
var timer;

// invoked from mouseovers inside menus to cancel hide
// request from mouseout of menu bar image
function keepMenu() {
	clearTimeout(timer);
}

function cancelAll(){
	keepMenu();
	menuReady = false;
}
// invoked from mouse outs to request hiding menus
// in 1/4 second, unless canceled
function requestHide() {
	timer = setTimeout("hideMenus()", 250);
}

// brute force - hiding of all menus and restoration of normal menu bar images
function hideMenus() {
	for (var i = 0; i<menus.length; i++) {
		document.getElementById(menus[i].mBarImgId).src = menus[i].mBarImgNormal.src;
		var menu = document.getElementById(menus[i].elemId);
		menu.style.visibility = "hidden";
	}
}

// set menu position just before displaying it
function positionMenu(menuId) {
	// use the menu bar image for position reference of related div
	var mBarImg = document.getElementById(menus[menuId].mBarImgId);
	var offsetTrail = mBarImg;
	var offsetLeft = 0;
	var offsetTop = 0;
	while(offsetTrail){
		offsetLeft += offsetTrail.offsetLeft;
		offsetTop += offsetTrail.offsetTop;
		offsetTrail = offsetTrail.offsetParent;
	}
	if (navigator.userAgent.indexOf("Mac") != -1 && typeof document.body.leftMargin != "undefined"){
		offsetLeft += document.body.leftMargin;
		offsetTop += document.body.topMargin;
	}
	var menuDiv = document.getElementById(menuId);
	menuDiv.style.left = offsetLeft + "px";
	menuDiv.style.top = offsetTop + mBarImg.height + "px";
}

// display a particular menu div
function showMenu(menuId) {
	if(menuReady) {
		keepMenu();
		hideMenus();
		positionMenu(menuId);
		var menu = document.getElementById(menuId);
		menu.style.visibility = "visible";
	}
}

// menu bar image swapping, invoked from mouse events in menu bar
// swap style sheets for menu items during rollovers

function toggleHighlight(evt) {
	evt = (evt) ? evt : ((event) ? event : null);
	if(typeof menuReady != "undefined") {
		if(menuReady && evt) {
			var elem = (evt.target) ? evt.target : evt.srcElement;
			if(elem.nodeType == 3){
				elem=elem.ParentNode;
			}
			if(evt.type == "mouseover") {
				keepMenu();
				elem.className = "menuItemOn";
			} else {
				elem.className = "menuItem";
				requestHide();
			}
			evt.cancelBubble = true;
		}
	}
}

function swap(evt){
	evt=(evt) ? evt : ((event) ? event : null);
	if(typeof menuReady != "undefined") {
		if(evt && (document.getElementById && document.styleSheets)&& menuReady) {
			var elem = (evt.target) ? evt.target : evt.srcElement;
			if(elem.className == "menuImg") {
				if(evt.type == "mouseover") {
					showMenu(menus[elem.id].elemId);
					elem.src = menus[elem.id].mBarImgHilite.src;
				} else if (evt.type == "mouseout") {
					requestHide();
				}
				evt.cancelBubble;
			}
		}
	}
}

// create menus only if key items are supported
function initMenus(){
	if(document.getElementById && document.styleSheets) {
		setTimeout("makeMenus()", 5);
		window.onunload=cancelAll;
	}
}