//This variable specifies whether or not the drop-down sub-menus are enabled
//This will be set to false for browsers that do not support layers
var enableSubMenus = false;

//The currently displayed drop-down sub-menu
var currentSubMenu = 0;

//This array holds the names of all section headings
//Note: These names must only use alpha-numeric characters and the space character
//Note: Non-alpha-numeric characters will be ignored
sectionNames = new Array('Home', 'About Us', 'Shows', 'Guestbook', 'Stage 1', 'Gallery', 'Calendar');

//This is the regular expression used to validate section names
var sectionNameRegExp = /[a-zA-Z0-9 ]/;

//This array holds the links for all section headings
sectionLinks = new Array('changePage("Home.php")', 'changePage("History.htm")', 'changePage("PastShows.htm")', 'changePage("Guestbook.php")', 'changePage("AboutStage1.htm")', 'changePage("Gallery_TheHiredMan.php")', 'loadNewWindow("Diary.php")');

//This is a 2-dimensional array holding the item names for each Section sub-menu
subMenuNames = new Array();
subMenuNames[0] = new Array();
subMenuNames[1] = new Array('History','Contacts', 'E-mail Us', 'Newsletter', 'Get Involved', 'Committee', 'Awards');
subMenuNames[2] = new Array('Past Shows', 'Booking Form');
subMenuNames[3] = new Array('Guestbook', 'Add Comment');
subMenuNames[4] = new Array('About Stage 1', 'Next production', 'Past Productions');
subMenuNames[5] = new Array('The Hired Man', 'Oliver', 'Wizard of Oz');
subMenuNames[6] = new Array();

//This is a 2-dimensional array holding the href links for each Section sub-menu
subMenuLinks = new Array();
subMenuLinks[0] = new Array();
subMenuLinks[1] = new Array('History.htm', 'Contacts.htm', 'EmailUs.php', 'Newsletter.htm', 'GetInvolved.htm', 'Committee.htm', 'Awards.htm');
subMenuLinks[2] = new Array('PastShows.htm', 'Booking.htm');
subMenuLinks[3] = new Array('Guestbook.php', 'AddComment.htm');
subMenuLinks[4] = new Array('AboutStage1.htm', 'Stage1NextShow.htm', 'Stage1PastShows.htm');
subMenuLinks[5] = new Array('Gallery_TheHiredMan.php', 'Gallery_Oliver.php', 'Gallery_Wizard.php');
subMenuLinks[6] = new Array();

//An array of boolean values representing whether each sub-menu can be closed.
//When a submenu is due to close, the corresponding boolean value is set to true
//and a short timer is then started.  When the timer expires, if the boolean value
//is still true then the submenu is closed, but, if whilst waiting for the timer, the
//submenu was opened again then the boolean is set to false and the submenu will
//not be closed.

var closesubmenu = new Array(sectionNames.length);
//Now initialise each array element to false
for(index=0; index < closesubmenu.length; index++)
{
   closesubmenu[index] = false;
}

//The width of each section table cell.
var sectionCellWidth = 75;

//Sub-menu dimensions (both drop-down and side menus)
var subMenuWidth = 100;
var menuItemHeight = 13;


function highlight(sectionNum)
{
   closesubmenu[sectionNum-1] = false;
   
   if (navigator.appName == "Netscape")
   {
      eval("document.arrow" + sectionNum + ".src= '" + menuImagePath + "arrow2.gif'");
   }
   else
      eval("arrow" + sectionNum + ".src = '" + menuImagePath + "arrow2.gif'");

   //Only show submenu if this section has one
   var subItems = subMenuLinks[sectionNum-1];
   if(subItems.length > 0)
      setTimeout("showDropMenu(" + sectionNum + ")", 50);
}

function unHighlight(sectionNum){

   closesubmenu[sectionNum-1] = true;
   setTimeout("unHighlight2(" + sectionNum + ")", 50);
}

function unHighlight2(sectionNum){

   if(closesubmenu[sectionNum-1])
   {
      if (navigator.appName == "Netscape")
      {
         eval("document.arrow" + sectionNum + ".src= '" + menuImagePath + "arrow1.gif'")
      }
      else
      {
         eval("arrow" + sectionNum + ".src = '" + menuImagePath + "arrow1.gif'");
      }

      //Only close submenu if this section has one
      var subItems = subMenuLinks[sectionNum-1];
      if(subItems.length > 0)
         hideDropMenu(sectionNum);
   }
}

function showDropMenu(sectionNum)
{
   if(sectionNum != currentSubMenu )
   {
      var currentWindowWidth = document.body.clientWidth;
      var offset = (sectionNum-1) - (sectionNames.length/2);
      offset = offset * sectionCellWidth;
      //alert(offset);
      var subMenuPosition = currentWindowWidth/2 + offset;
      //alert(subMenuPosition);

      if (navigator.appName == "Netscape")
      {
         document.getElementById("DropMenu" + sectionNum).style.left = subMenuPosition;
         document.getElementById("DropMenu" + sectionNum).style.display = "block";
      }
      else
      {
         eval("DropMenu" + sectionNum + ".style.left = subMenuPosition");
         eval("DropMenu" + sectionNum + ".style.display = 'block'");
      }
   }

   currentSubMenu = sectionNum;
}

function hideDropMenu(sectionNum)
{
   if (navigator.appName == "Netscape")
   {
      document.getElementById("DropMenu" + sectionNum).style.display = "none";
   }
   else
   {
      eval("DropMenu" + sectionNum + ".style.display = 'none'");
   }

   currentSubMenu = 0;
}

function loadNewWindow(url)
{
   var newWindow = window.open(url, "Calendar", "width=790, height=530"); 
   newWindow.focus();
   return false;
}

function changePage(url)
{
   document.location = url;
   return false;
}


document.write("   <table width='100%' background='Images/Menu/bg.jpg' cellspacing='0' cellpadding='0'>");
document.write("   <tr>");
document.write("      <td height='23' valign='middle'>");

document.write("<center>");
document.write("<table cellpadding='0' cellspacing='0' border='0'><tr>");
document.write("<td background='" + menuImagePath + "Left.jpg' width='16'>&nbsp;</td>");

   for(count=1; count <= sectionNames.length; count++)
   {
      var sectionName = sectionNames[count-1];
      var sectionLink = sectionLinks[count-1];

      var boxNum = 1;
      if(count == currentSection)
         boxNum = 2;

      document.write("   <td background='" + menuImagePath + "Center.jpg'>");
      document.write("   <table width='" + sectionCellWidth + "' cellpadding='0' cellspacing='0' border='0'>");
      document.write("      <tr><td align='center'>");
      document.write("         <table cellpadding='0' cellspacing='0' border='0'><tr>");
      document.write("            <td height='17' valign='center' align='center'><IMG name='arrow" + count + "' border='0' src='" + menuImagePath + "arrow1.gif'></td>");
      document.write("            <td valign='center' align='center'>");

      document.write("               <a href='' onclick='return " + sectionLink + "' onMouseOver='highlight(" + count + ")' onMouseOut='unHighlight(" + count + ")' class='secionTitle'>");
      document.write(sectionName);
      document.write("               </a>");

      document.write("            </td>");
      document.write("            <td><IMG border='0' src='" + menuImagePath + "arrow1.gif'></td>");
      document.write("         </tr></table>");
      document.write("      </td></tr>");
      document.write("   </table>");
      document.write("   </td>");
   }

document.write("<td background='" + menuImagePath + "Right.jpg' width='16'>&nbsp;</td>");
document.write("</tr></table>");
document.write("</center>");

document.write("      </td>");
document.write("   </tr>");
document.write("   <tr>");
document.write("      <td>");
document.write("         <table width='100%' cellspacing='0' cellpadding='0' border='0'>");
document.write("         <tr>");
document.write("            <td height='8' width='" + sideMenuWidth + "' background='Images/Menu/bgLeftShadow.jpg' class='tiny'>&nbsp;</td>");
document.write("            <td height='8' background='Images/Menu/bgShadow.jpg' class='tiny'>&nbsp;</td>");
document.write("         </tr>");
document.write("         </table>");
document.write("      </td>");
document.write("   </tr>");
document.write("   </table>");