// Global menu state
var menuReady = false;

// prechache manubar image pairs
if (document.images) {
	var imagesNormal = new Array();
	imagesNormal["Home"] = new Image(30,145);
	imagesNormal["Home"].src = "hmigifs/btn_home_off.gif";
	imagesNormal["About Us"] = new Image(30,145);
	imagesNormal["About Us"].src = "hmigifs/btn_aboutus_off.gif";
	imagesNormal["Teaching Materials"] = new Image(30,145);
	imagesNormal["Teaching Materials"].src = "hmigifs/btn_teach_off.gif";
	imagesNormal["Ministry in Action"] = new Image(30,145);
	imagesNormal["Ministry in Action"].src = "hmigifs/btn_minaction_off.gif";
	imagesNormal["Partnership"] = new Image(30,145);
	imagesNormal["Partnership"].src = "hmigifs/btn_partner_off.gif";
	imagesNormal["Contact Us"] = new Image(30,145);
	imagesNormal["Contact Us"].src = "hmigifs/btn_contact_off.gif";
	imagesNormal["Ministry Links"] = new Image(30,145);
	imagesNormal["Ministry Links"].src = "hmigifs/btn_minlinks_off.gif";

	var imagesHilite = new Array();
	imagesHilite["Home"] = new Image(30,145);
	imagesHilite["Home"].src = "hmigifs/btn_home_on.gif";
	imagesHilite["About Us"] = new Image(30,145);
	imagesHilite["About Us"].src = "hmigifs/btn_aboutus_on.gif";
	imagesHilite["Teaching Materials"] = new Image(30,145);
	imagesHilite["Teaching Materials"].src = "hmigifs/btn_teach_on.gif";
	imagesHilite["Ministry in Action"] = new Image(30,145);
	imagesHilite["Ministry in Action"].src = "hmigifs/btn_minaction_on.gif";
	imagesHilite["Partnership"] = new Image(30,145);
	imagesHilite["Partnership"].src = "hmigifs/btn_partner_on.gif";
	imagesHilite["Contact Us"] = new Image(30,145);
	imagesHilite["Contact Us"].src = "hmigifs/btn_contact_on.gif";
	imagesHilite["Ministry Links"] = new Image(30,145);
	imagesHilite["Ministry Links"].src = "hmigifs/btn_minlinks_on.gif";
}

// Read effective style property
function getElementStyleProp(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 critical menu style sheet attribute values
var CSSRuleValues = {menuItemHeight:"19px",
                     menuItemLineHeight:"1.2em",
                     menuWrapperBorderWidth:"0px",
                     menuWrapperPadding:"5px",
                     defaultBodyFontSize:"1.1em"
                    };


// specifications for menu contents and menubar image associations
var menus = new Array();
menus[0] = {mBarImgId:"menuImg_1",
	    mBarImgNormal:imagesNormal["Home"],
	    mBarImgHilite:imagesHilite["Home"],
	    menuItems:[],
	    elemId:""
	   };
menus[1] = {mBarImgId:"menuImg_2",
	    mBarImgNormal:imagesNormal["About Us"],
	    mBarImgHilite:imagesHilite["About Us"],
	    menuItems:[{text:"Who We Are", href:"whoweare.htm"},
	    				{text:"Our Mission", href:"mission.htm"},
	    				{text:"What We Believe", href:"ourbelief.htm"},
	    				{text:"How We Are Funded", href:"funding.htm"}],
	    elemId:""
	   };
menus[2] = {mBarImgId:"menuImg_3",
	    mBarImgNormal:imagesNormal["Teaching Materials"],
	    mBarImgHilite:imagesHilite["Teaching Materials"],
	    menuItems:[{text:"Books", href:"books.htm"},
	    	         {text:"Articles", href:"articles.htm"},
	    	         {text:"CDs", href:"audiocds.htm"}],
	    elemId:""
	   };
menus[3] = {mBarImgId:"menuImg_4",
	    mBarImgNormal:imagesNormal["Ministry in Action"],
	    mBarImgHilite:imagesHilite["Ministry in Action"],
	    menuItems:[{text:"Photo Gallery", href:"gallery.htm"},
	    	         {text:"Testimonies", href:"testimonies.htm"},
	    	         {text:"Video Clip", href:"video.php"}],
	    elemId:""
	   };
menus[4] = {mBarImgId:"menuImg_5",
	    mBarImgNormal:imagesNormal["Partnership"],
	    mBarImgHilite:imagesHilite["Partnership"],
	    menuItems:[{text:"Partner With Us", href:"partner.htm"},
	    	         {text:"Recommend HMI", href:"recommend.htm"}],
	    elemId:""
	   };
menus[5] = {mBarImgId:"menuImg_6",
	    mBarImgNormal:imagesNormal["Contact Us"],
	    mBarImgHilite:imagesHilite["Contact Us"],
	    menuItems:[],
	    elemId:""
	   };
menus[6] = {mBarImgId:"menuImg_7",
	    mBarImgNormal:imagesNormal["Ministry Links"],
	    mBarImgHilite:imagesHilite["Ministry Links"],
	    menuItems:[],
	    elemId:""
	   };


// Create hash table-like lookup for menu objects with 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.mouseover = swap;
	     elem.onmouseout = swap;
	}
}

// invoked from initMenu(), generates the menu div elements and their contents.
// all this action is invisible to user during construction
function makeMenus() {
	var menuDiv, menuItem, itemlink, itemTrgt, mbarImg, textNode, offsetLeft, offsetTop;

	// determine key adjustlent factors or the total height of menu divs
	var menuItemH = 0;
	var bodyFontSize = parseInt(getElementStyleProp(document.body, "fontSize", "font-size"));
	// test to see if the 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 = parseInt(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;
	}

   // use menu array to drive div creation loop
   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 handlers
      menuDiv.onmouseover = keepMenu;
      menuDiv.onmouseout = requestHide;

      // set stacking order in caseother layers are around the page
      menuDiv.style.zIndex = 1000;

      // assemble menu item elements for inside menu div
      var menuSource = "";
      for (var j = 0; j < menus[i].menuItems.length; j++ ) {
      	menuSource = menus[i].menuItems[j].href;
      	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;
}

// initialize global that helps manage hiding
var timer;

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

function cancelAll() {
	keepMenu();
   menuReady = false;
}

// invoked from mouseouts to request hiding all menus
// in 1/4 second; unless cancelled
function requestHide() {
	timer = setTimeout("hideMenus()", 250);
}

// "brute force" hiding of all menus and restoration
// of formal 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 = true;
			}
      }
   }
}

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