
var currentSection = "";

var whoMenuLabels = ["Welcome", "Beliefs and Practices", "Join Us!"];
var whoMenuUrls   = ["welcome.htm", "beliefs.htm", "join.htm"];

var worshipMenuLabels = ["Sunday Service", "Other Forms of Worship", "Our Minister", "Reflections"];
var worshipMenuUrls   = ["services.htm", "otherworship.htm", "parisa.htm", "reflections.htm"];

var educationLabels = ["Program Goals", "Teaching", "Children's Program", "Youth Programs", "Adult Programs",
	"Director"]; 
var educationUrls = ["goals.htm","teaching.htm", "children.htm", "youth.htm", "adult.htm", "robin.htm"];

var musicLabels = ["Choir", "Children's Choir", "Musical Instruments", "Director of Music"];
var musicUrls = ["choir.htm", "childchoir.htm", "instruments.htm", "emmajean.htm"];

var governanceLabels = ["Annual Meeting", "Parish Committee", "Trustees", "Committees"];
var governanceUrls = ["meeting.htm", "parish.htm", "trustees.htm", "committees.htm"];

var actionLabels = ["Overview", "Parish Funds"];
var actionUrls = ["action.htm", "funds.htm"];  // action.htm is temporary placeholder

var historyLabels = ["First Parish in Milton", "Sermon Archive"];
var historyUrls = [ "first.htm", "sermon.htm"];

var contactLabels = ["Office", "Assistance", "Facilities", "Directions"];
var contactUrls = ["office.htm", "assist.htm", "facilities.htm", "directions.htm"];


function highlightMenuItem(row) {
    row.className="menuHighlight";
}

function unhighlightMenuItem(row) {
	row.className="menuBasic";
}

function highlightNavItem(row, event) {
    hideMenu(event);

    var id = row.id;
	
    if (id == currentSection) {
	row.className = "navbarCurrentHighlight";
    } else {
	row.className = "navbarHighlight";
    }

}

function unhighlightNavItem(row,event) {
    if (window.church_menu) {
	return false;
    }
    var id = row.id;
    if (id == currentSection) {
	row.className = "navbarCurrent";
    } else {
	row.className="navbarBasic";
    }
}

function isOutsideClick(event) {
  var retVal = true;
  // Find out if we're inside the nav bar or
  // not.  Event source is browser-specific
  var target;
  if (event.target) {
    target = event.target;
  } else if (event.srcElement) {
    target = event.srcElement;
  }
  // work-around for Safari bug
  if (target.nodeType == 3) {
    target = target.parentNode;
  }

  while (target != null) {
    if (target.id == 'navTable') {
      retVal = false;
      break;
    }
    target = target.parentNode;
  }

  return retVal;
}

function hideMenu(event)
{
  if (!event) var event= window.event;
  if (event && event.type == 'click') {
      var clickOut = isOutsideClick(event);
	  if (!clickOut) {
        return;
      }
  }
  if (window.church_menu) {
     document.body.removeChild(window.church_menu);
     window.church_menu = null;
  }
  // clear the highlight row
  if (window.highlightedRow != null) {
	  unhighlightNavItem(window.highlightedRow);
	  window.highlightedRow = null;
  }

}

function createMenuHtml(labels, urls)
{

  var menuHtml = "<table class='menu' width = '200' cellpadding='5px' cellspacing='1px' class = 'menuBasic' onClick ='JavaScript:hideMenu();'>";

  for (i = 0; i < labels.length; i++) {
    menuHtml = menuHtml + "<tr class='menuBasic' onClick=goTo('" + urls[i] + "') onMouseOver='highlightMenuItem(this)' onMouseOut='unhighlightMenuItem(this)'>";
    menuHtml = menuHtml + "<td>" + labels[i] + "</td></tr>";
  }
  menuHtml = menuHtml + "<table>";

  return menuHtml;

}


function showMenu(row, menuLabels, menuUrls, irow, event) {

  // if there is already a menu up, hide it
  if (window.church_menu) hideMenu();

  // save the row to clean up later
  window.highlightedRow = row;

  if (!event) var event= window.event;

  var posx = 0;
  var posy = 0;
	
  // calculate menu x and y coordinates
  posx = parseInt(row.offsetLeft) + + 153;
  posy = parseInt(row.offsetTop) + 6;
  if (row.offsetTop == 0) 
      posy = posy + (irow * 36) - (irow-1) ;

  var parent = row.offsetParent;
  while (parent != null) {
      posx = posx + parseInt(parent.offsetLeft);
      posy = posy + parseInt(parent.offsetTop);
      parent = parent.offsetParent;
  } 
  
  // for safari
  posx = posx + "px";
  posy = posy + "px";
  
  window.church_menu = document.createElement("div");
  window.church_menu.style.position="absolute";
  window.church_menu.style.left = posx;  
  window.church_menu.style.top = posy;  

  var menuHtml = createMenuHtml(menuLabels, menuUrls);
  window.church_menu.innerHTML=menuHtml;
  document.body.appendChild(window.church_menu);

  return false;

}


function setCurrentSection(sectionId)
{
	var row = null;
	if (sectionId != null) {
		var row = document.getElementById(sectionId);
		currentSection = sectionId;
		row.className="navbarCurrent";
	}
}

function goTo(url)
{

	window.location=url;
}

function installHandler(object, event, handler) {
    if (object.attachEvent) {
        // MSIE special
        object.attachEvent('on'+event,handler);
    } else if ( object.addEventListener) {
        // firefox et al, do not replace original handler
        object.addEventListener(event,handler,false);
    } else {
        object['on'+event] = handler;
    }
}

function removeHandler(object, event, handler) {
    if (object.detachEvent) {
      // MSIE special
      object.detachEvent('on'+event, handler);
    } else if (object.removeEventListenter) {
      object.removeEventListener(event, handler, false);
    } else {
      object['on'+event] = null;
    }
}
function setClickHandler() {
  installHandler(document, 'click', hideMenu);
  installHandler(window, 'click', hideMenu);
}

function init() {
	setClickHandler();
	setCurrentSection(currentSection);
}
installHandler(window, 'load', init);
