
<!-- // Hide

// *** COMMON CROSS-BROWSER COMPATIBILITY CODE ***

var isDOM = document.getElementById?1:0;
var isIE = document.all?1:0;
var isNS4 = (navigator.appName=='Netscape' && !isDOM)?1:0;
var isIE4 = (isIE && !isDOM)?1:0;
var isDyn = (isDOM||isIE||isNS4);



function getRef(id, par)
{
 par = !par ? document : (par.navigator?par.document:par);
 return (isIE ? par.all[id] :
  (isDOM ? (par.getElementById?par:par.ownerDocument).getElementById(id) :
  par.layers[id]));
}

function getSty(id, par)
{
 return (isNS4 ? getRef(id, par) : getRef(id, par).style)
}

if (!window.LayerObj) var LayerObj = new Function('id', 'par',
 'this.ref=getRef(id, par); this.sty=getSty(id, par); return this');
function getLyr(id, par) { return new LayerObj(id, par) }

function LyrFn(fn, fc)
{
 LayerObj.prototype[fn] = new Function('var a=arguments,p=a[0]; with (this) { '+fc+' }');
}
LyrFn('x','if (!isNaN(p)) sty.left=p; else return parseInt(sty.left)');
LyrFn('y','if (!isNaN(p)) sty.top=p; else return parseInt(sty.top)');
LyrFn('vis','sty.visibility=p');
LyrFn('bgColor','if (isNS4) sty.bgColor=(p?p:null); ' +
 'else sty.background=p?p:"transparent"');
LyrFn('bgImage','if (isNS4) sty.background.src=(p?p:null); ' + 
 'else sty.background=(p?"url("+p+")":"") ');
LyrFn('clip','if (isNS4) with(sty.clip) { left=a[0]; top=a[1]; right=a[2]; bottom=a[3] } ' +
 'else sty.clip="rect("+a[1]+"px "+a[2]+"px "+a[3]+"px "+a[0]+"px)" ');
LyrFn('write','if (isNS4) with (ref.document) {write(p);close()} else ref.innerHTML=p');
LyrFn('alpha','var f=ref.filters; if (f) {' +
 'if (sty.filter.indexOf("alpha")==-1) sty.filter+="alpha()"; ' +
 'if (f.length&&f.alpha) f.alpha.opacity=p } else if (isDOM) sty.MozOpacity=(p/100)');


function setLyr(lVis, docW, par)
{
 if (!setLyr.seq) setLyr.seq=0;
 if (!docW) docW=0;
 var obj = (!par ? (isNS4 ? window : document.body) :
  (!isNS4 && par.navigator ? par.document.body : par));
 var newID='_js_layer_'+setLyr.seq++;

 if (isIE&&!window.opera) obj.insertAdjacentHTML('beforeEnd', '<div id="'+newID+
  '" style="position:absolute"></div>');
 else if (isDOM)
 {
  var newL=document.createElement('div');
  obj.appendChild(newL);
  newL.id=newID; newL.style.position='absolute';
 }
 else if (isNS4)
 {
  var newL=new Layer(docW, obj);
  newID=newL.id;
 }

 var lObj=getLyr(newID, par);
 with (lObj.sty) { visibility=lVis; left=0; top=0; width=docW }
 return lObj;
}


if (!window.page) var page = { win: window, minW: 0, minH: 0, MS: isIE&&!window.opera }

page.winW=function()
 { with (this) return Math.max(minW, MS?win.document.body.clientWidth:win.innerWidth) }
page.winH=function()
 { with (this) return Math.max(minH, MS?win.document.body.clientHeight:win.innerHeight) }

page.scrollX=function()
 { with (this) return MS?win.document.body.scrollLeft:win.pageXOffset }
page.scrollY=function()
 { with (this) return MS?win.document.body.scrollTop:win.pageYOffset }



// *** MOUSE EVENT CONTROL FUNCTIONS ***


// Most of these are passed the relevant 'menu Name' and 'item Number'.
// The 'with (this)' means it uses the properties and functions of the current menu object.
function popOver(mN, iN) { with (this)
{
 // Cancel any pending menu hides from a previous mouseout.
 clearTimeout(hideTimer);
 // Set the 'over' variables to point to this item.
 overM = mN;
 overI = iN;
 // A quick reference to this item.
 var thisI = menu[mN][iN];

 // Call the 'onMouseOver' event if it exists, and the item number is 1 or more.
 if (iN && this.onmouseover) this.onmouseover();


 // Remember what was lit last time, and compute a new hierarchy.
 litOld = litNow;
 litNow = new Array();
 var litM = mN, litI = iN;
 while(1)
 {
  litNow[litM] = litI;
  // If we've reached the top of the hierarchy, exit loop.
  if (litM == 'root') break;
  // Otherwise repeat with this menu's parent.
  litI = menu[litM][0].parentItem;
  litM = menu[litM][0].parentMenu;
 }

 // If the two arrays are the same, return... no use hiding/lighting otherwise.
 var same = true;
 for (var z in menu) if (litNow[z] != litOld[z]) same = false;
 if (same) return;



 // Cycle through menu array, lighting and hiding menus as necessary.
 for (thisM in menu) with (menu[thisM][0])
 {
  // Doesn't exist yet? Keep rollin'...
  if (!lyr) continue;

  // The number of this menu's item that is to be lit, undefined if none.
  litI = litNow[thisM];
  oldI = litOld[thisM];

  // If it's lit now and wasn't before, highlight...
  if (litI && (litI != oldI)) changeCol(thisM, litI, true);

  // If this item was lit but another is now, dim the old item.
  if (oldI && (oldI != litI)) changeCol(thisM, oldI, false);

  // Make sure if it's lit, it's shown, and set the visNow flag.
  if (litI && !visNow && (thisM != 'root'))
  {
   showMenu(thisM);
   visNow = true;
  }

  // If this menu has no items from the current hierarchy in it, and is currently
  // onscreen, call the hide function.
  if (isNaN(litI) && visNow)
  {
   hideMenu(thisM);
   visNow = false;
  }
 }


 // Get target menu to show - if we've got one, position & show it.
 clearTimeout(showTimer);
 nextMenu = '';
 if (thisI.type == 'sm:')
 {
  // The target menu and the layer object of the current menu itself (not this item).
  var targ = thisI.href, lyrM = menu[mN][0].lyr;

  // Add current menu/item positions to the target's offset to set its position, show it.
  with (menu[targ][0])
  {
   // If the target menu has not been created yet, return as we can't do anything.
   if (!lyr || !lyr.ref) return;

   // If the offset is a number add this item's position else just calculate position.
   lyr.x(eval(offX) + (typeof(offX)=='number' ? lyrM.x() + thisI.lyr.x() : 0));
   lyr.y(eval(offY) + (typeof(offY)=='number' ? lyrM.y() + thisI.lyr.y() : 0));

   // Either show immediately or after a delay if set. Set nextMenu to the impending show.
   showStr = myName + '.showMenu("' + targ + '"); ' +
    myName + '.menu.' + targ + '[0].visNow = true';
   nextMenu = targ;
   if (showDelay) showTimer = setTimeout(showStr, showDelay);
   else eval(showStr);
  }
 }
}}


function popChangeCol(mN, iN, isOver) { with (this.menu[mN][iN])
{
 // Swap the background colour/image depending on highlight state.
 // If it's got a period in it, call it an image, otherwise it must be a colour.
 var col = isOver ? overCol : outCol;
 if (col.indexOf('.') == -1) lyr.bgColor(col);
 else lyr.bgImage(col);

 // Test for other style changes, we can skip them if not needed.
 var doFX = ((overClass != outClass) || (outBorder != overBorder));

 // In Netscape 4, rewrite layer contents (causes a little flickering)...
 if (doFX && isNS4) lyr.write(this.getHTML(mN, iN, isOver));

 // ...otherwise manipulate the DOM tree for IE/NS6+ (faster than rewriting contents).
 else if (doFX) with (lyr)
 {
  ref.className = (isOver ? overBorder : outBorder);
  var chl = (isDOM ? ref.childNodes : ref.children)
  if (chl) for (var i = 0; i < chl.length; i++)
   chl[i].className = (isOver ? overClass : outClass);
 }

 // Alpha filtering activated? Might as well set that then too...
 // Weirdly it has to be done after the border change, another random Mozilla bug...
 if (typeof(outAlpha)=='number') lyr.alpha(isOver ? overAlpha : outAlpha);
}}


function popOut(mN, iN) { with (this)
{
 // Sometimes, across frames, overs and outs can get confused. If this is called before
 // the relevant over command, return...
 if ((mN != overM) || (iN != overI)) return;
 // Evaluate the onmouseout event, if any.
 if (this.onmouseout) this.onmouseout();

 var thisI = menu[mN][iN];

 // Stop showing another menu if this item isn't pointing to the same one.
 if (thisI.href != nextMenu) clearTimeout(showTimer);

 // Hide all menus rapidly (if it's a root menu item without a popout) or as specified.
 // Remember that the timeout is cancelled by another instance of the over function.
 // Calling 'over("root", 0)' hides all menus but the root menu, and highlights no items.
 // If hideDelay equals zero the menus are never hidden.
 if (hideDelay)
 {
  var delay = ((mN == 'root') && (thisI.type != 'sm:')) ? 50 : hideDelay;
  hideTimer = setTimeout(myName + '.over("root", 0)', delay);
 }

 // Clear the 'over' variables.
 overM = 'root';
 overI = 0;
}}


function popClick(evt) { with (this)
{
 // If the moused over item number isn't 0, activate it!
 if (overI)
 {
  // Evaluate the onclick event, if any.
  if (this.onclick) this.onclick();

  var thisI = menu[overM][overI];

  with (thisI) switch (type)
  {
   // Targeting another popout? Clicking will get you nowhere...
   case 'sm:':
   {
   eval('window.location.href = "' + href + '.html"');
   return;
   }
   // A JavaScript function? Eval() it and break out of switch.
   case 'js:': { eval(href); break }
   // Otherwise, point to the window if nothing else and navigate.
   //DAVE to get the link to also link somewhere you have to spoof it.  You do so by naming the page the same thing as the subnav
   case '': type = 'window';
   default: if (href) eval(type + '.location.href = "' + href + '"');
  }
 }

 // Whatever happens, hide the menus when clicked.
 over('root', 0);
}}


function popClearLyr(wN) { with (this)
{
 // Pass a window name on unload. Any menus in that window have their layer objects
 // deleted, for re-creation later.
 for (mN in menu) with (menu[mN][0]) if (par == wN) lyr = null;
}}



// *** MENU OBJECT CONSTRUCTION FUNCTIONS ***

// This takes arrays of data and names and assigns the values to a specified object.
function addProps(obj, data, names, addNull)
{
 for (var i = 0; i < names.length; i++) if(i < data.length || addNull) obj[names[i]] = data[i];
}

function ItemStyle()
{
 // Like the other constructors, this passes a list of property names that correspond to the list
 // of arguments. Feel free to add more than the first 4 to the addItem() command if you want.
 var names = ['len', 'spacing', 'popInd', 'popPos', 'pad', 'outCol', 'overCol', 'outClass',
  'overClass', 'outBorder', 'overBorder', 'outAlpha', 'overAlpha'];
 addProps(this, arguments, names, true);
}

function popStartMenu(mName) { with (this)
{
 // Create a new array within the menu object if none exists already, and a new menu object within.
 if (!menu[mName]) { menu[mName] = new Array(); menu[mName][0] = new Object(); }

 // Set this as the active menu to which new items are added, and clean out existing items.
 actMenu = mName;
 menu[mName].length = 1;
 nextItem = 1;
 // A quick reference to the current menu descriptor -- array index 0, 1+ are items.
 var aM = menu[mName][0];

 // Not all of these are actually passed to the constructor -- the last few are null.
 // N.B: I pass 'isVert' twice so the first parameter (the menu name) is overwritten & ignored.
 var names = ['isVert', 'isVert', 'offX','offY', 'width', 'itemSty', 'par', 'parentMenu',
  'parentItem', 'visNow', 'menuW', 'menuH'];
 addProps(aM, arguments, names, true);

 // Reuse old layers if we can, no use creating new ones every time the menus refresh.
 if (!aM.lyr) aM.lyr = null;
}}

function popAddItem() { with (this)
{
 // Add these properties onto a new 'active Item' at the end of the active menu.
 var aI = menu[actMenu][nextItem++] = new Object();

 // Add function parameters to object. Again, the last three are undefined, set later.
 var names = ['text', 'href', 'type', 'itemSty', 'len', 'spacing', 'popInd', 'popPos',
  'pad', 'outCol', 'overCol', 'outClass', 'overClass', 'outBorder', 'overBorder',
  'outAlpha', 'overAlpha', 'iW', 'iH', 'lyr'];
 addProps(aI, arguments, names, true);

 // Find an applicable itemSty -- either passed to this item or the menu[0] object.
 var iSty = (arguments[3] ? arguments[3] : menu[actMenu][0].itemSty);
 // Loop through its properties, add them if they don't already exist (overridden e.g. length).
 for (prop in iSty) if (aI[prop] == window.UnDeFiNeD) aI[prop] = iSty[prop];

 // In NS4, since borders are assigned to the contents rather than the layer, increase padding.
 if (aI.outBorder)
 {
  if (isNS4) aI.pad++;
 }
}}



// *** MAIN MENU CREATION/UPDATE FUNCTIONS ***

// Returns the inner HTML of an item, used for menu generation, and highlights in NS4.
function popGetHTML(mN, iN, isOver) { with (this)
{
 var itemStr = '';
 with (menu[mN][iN])
 {
  var textClass = (isOver ? overClass : outClass);

  // If we're supposed to add a popout indicator, add it before text so it appears below in NS4.
  // Note the (iW - 15): the position is hardcoded at 15px from the item's right edge.
  if ((type == 'sm:') && popInd)
  {
   if (isNS4) itemStr += '<layer class="' + textClass + '" left="'+ ((popPos+iW) % iW) +
    '" top="' + pad + '">' + popInd + '</layer>';
   else itemStr += '<div class="' + textClass + '" style="position: absolute; left: ' +
    ((popPos+iW) % iW) + '; top: ' + pad + '">' + popInd + '</div>';
  }

  // For NS4, if a border is assigned, add a spacer to push border out to layer edges.
  // The text layer must completely overlay this table as well for proper click capturing.
  // Add a link both to generate an onClick event and to stop the ugly I-beam text cursor appearing.
  if (isNS4) itemStr += (outBorder ? '<span class="' + (isOver ? overBorder : outBorder) +
   '"><spacer type="block" width="' + (iW - 8) + '" height="' + (iH - 8) + '"></span>' : '') +
   '<layer left="' + pad + '" top="' + pad + '" width="' + (iW - (2 * pad)) + '" height="' +
   (iH - (2 * pad)) + '"><a class="' + textClass + '" href="#" ' +
   'onClick="return false" onMouseOver="status=\'\'; ' + myName + '.over(\'' + mN + '\',' +
   iN + '); return true">' + text + '</a></layer>';

  // IE4+/NS6 is an awful lot easier to work with sometimes.
  // DAVE-- the pad in the top controls where the text is but not the background//
  else itemStr += '<div class="' + textClass + '" style="position: absolute; left: ' + pad +
   '; top: ' + pad + '; width: ' + (iW - (2 * pad)) + '; height: ' + (iH - (2 * pad)) +
   '">' + text + '</div>';
 }
 return itemStr;
}}


// The main menu creation/update routine. The first parameter is 'true' if you want the script
// to use document.write() to create the menus. Second parameter is optionally the name of one
// menu only to update rather then create al menus.
function popUpdate(docWrite, upMN) { with (this)
{
 // 'isDyn' (set at the very top of the script) signifies a DHTML-capable browser.
 if (!isDyn) return;

 // Loop through menus, using properties of menu description object (array index 0)...
 for (mN in menu) with (menu[mN][0])
 {
  // If we're updating one specific menu, only run the code for that.
  if (upMN && (upMN != mN)) continue;

  // Variable for holding HTML for items and positions of next item.
  //DAVE --this one will move the works up but overlap the second div....
  var str = '', iX = 0, iY = 0;

  // Remember, items start from 1 in the array (0 is menu object itself, above).
  // Also use properties of each item nested in the other with() for construction.
  for (var iN = 1; iN < menu[mN].length; iN++) with (menu[mN][iN])
  {
   // An ID for divs/layers contained within the menu.
   var itemID = myName + '_' + mN + '_' + iN;

   // Now is a good time to assign another menu's parent to this if we've got a popout item.
   var targM = menu[href];
   if (targM && (type == 'sm:'))
   {
    targM[0].parentMenu = mN;
    targM[0].parentItem = iN;
   }

   // NS6 and Opera disagree with IE and NS4 as to whether borders increase div widths, so we
   // subtract some pixels here to go with the old 'loose' specification. Swap this around if you
   // want your documents to conform with the new specs.
   var shrink = (outBorder && ((isDOM && !isIE) || window.opera) ? 2 : 0)
   // The actual dimensions of the items, store as item properties so they can be accessed later.
   iW = (isVert ? width : len) - shrink;
   iH = (isVert ? len : width) - shrink;

   // Have we been given a background image? It'll have a period in its name if so...
   var isImg = (outCol.indexOf('.') != -1) ? true : false;

   // Create a div or layer text string with appropriate styles/properties.
   // OK, OK, I know this is a little obtuse in syntax, but it's small...
   // At the end we set the alpha transparency (if specified) and cursor to be a hand
   // if it's not a 'sm:' item or blank -- those items get a regular cursor
   if (isDOM || isIE4)
   {
    str += '<div id="' + itemID + '" ' + (outBorder ? 'class="' + outBorder + '" ' : '') +
     'style="position: absolute; left: ' + iX + '; top: ' + iY + '; width: ' + iW + '; height: ' +
     iH + '; background: ' + (isImg ? 'url('+outCol+')' : outCol) +
     ((typeof(outAlpha)=='number') ? '; filter: alpha(opacity='+ outAlpha + '); -moz-opacity: ' +
      (outAlpha/100) : '') +
     '; cursor: ' + ((type!='sm:' && href) ? (isIE ? 'hand' : 'pointer') : 'default') + '" ';
   }
   else if (isNS4)
   {
    // NS4's borders must be assigned within the layer so they stay when content is replaced.
    str += '<layer id="' + itemID + '" left="' + iX + '" top="' + iY + '" width="' +
     iW + '" height="' + iH + '" ' + (outCol ? (isImg ? 'background="' : 'bgcolor="') +
     outCol + '" ' : '');
   }

   // Add mouseover and click handlers, contents, and finish div/layer.
   str += 'onMouseOver="' + myName + '.over(\'' + mN + '\',' + iN + ')" ' +
     'onMouseOut="' + myName + '.out(\'' + mN + '\',' + iN + ')">' +
     getHTML(mN, iN, false) + (isNS4 ? '</layer>' : '</div>');

   // Move next item position down or across by this item's length and additional spacing.
   // Subtract 1 so borders overlap slightly.
   var spc = (outBorder ? 1 : 0)
   if (isVert) iY += len + spacing - spc;
   else iX += len + spacing - spc;

  // End loop through items and with(menu[mN][iN]).
  }


  // Record the last item position as the dimensions of this menu.
  // N.B: Still using properties of menu[mN][0]...
  menuW = isVert ? width : iX;
  menuH = isVert ? iY : width;



  // The parent frame for this menu, if any.
  var eP = eval(par);


  // Do not ask me why Opera makes me set a timeout now rather than later, or in fact have
  // to set a timeout at all to get references to the divs we are about to create.
  // But, it makes the cross-frame version of the script actually work, so there's a benefit.
  setTimeout(myName + '.setupRef("' + mN + '")', 50);
  
  // For Fast creation mode (default for IE, NS6, Opera), write the menus to the document now.
  if (docWrite)
  {
   // Find the right target frame.
   var targFr = (eP && eP.navigator ? eP : window);
   targFr.document.write('<div id="' + myName + '_' + mN + '_Div" style="position: absolute; ' +
    'visibility: hidden; width: ' + menuW + '; height: ' + menuH + '; z-index: 1000">' +
    str + '</div>');
  }
  else
  {
   // Create a new layer/div object dynamically using my setLyr() function above.
   // If we've got a layer created already, there's no use creating another!.
   // In IE4, we must shrink the menus to stop them sizing to the full body size -- thanks
   // to Jeff Blum and Paul Maden for debugging this for me :). If the layer has been created,
   // we've got to set a timeout to fix up IE4 again for some obscure reason.
   if (!lyr) lyr = setLyr('hidden', menuW, eP);
   else if (isIE4) setTimeout(myName + '.menu.' + mN + '[0].lyr.sty.width=' + (menuW+2), 50);

   // Give it a high Z-index, and write its content.
   with (lyr) { sty.zIndex = 1000; write(str) }
  }

 // End loop through menus and with (menu[mN][0]).
 }
}}


function popSetupRef(mN) { with (this) with (menu[mN][0])
{
 // Get a reference to a div, only needed for Fast creation mode.
 if (!lyr || !lyr.ref) lyr = getLyr(myName + '_' + mN + '_Div', eval(par));

 // Loop through menu items again to set up individual references.
 for (var i = 1; i < menu[mN].length; i++)
  menu[mN][i].lyr = getLyr(myName + '_' + mN + '_' + i, lyr.ref);

 // Position and show the root menu once written. Phew!
 if (mN == 'root')
 {
  position();
  lyr.vis('visible');
 }
}}


function popPosition(wN) { with (this)
{
 // Pass this a window name to position the absolute menus in that window, otherwise all are.
 for (mN in menu) if (!wN || menu[mN][0].par == wN) with (menu[mN][0])
 {
  // If the menu hasn't been created, and there's no layer reference, loop.
  if (!lyr || !lyr.ref) continue;

  // If either of the offsets is a string or its the root menu, position it.
  if (typeof(offX)!='number' || mN=='root') lyr.x(eval(offX));
  if (typeof(offY)!='number' || mN=='root') lyr.y(eval(offY));
 }
}}


// *** POPUP MENU MAIN OBJECT CONSTRUCTOR ***

function PopupMenu(myName)
{
 // These are the properties of any PopupMenu objects you create.
 this.myName = myName;

 // Manage what gets lit and shown when.
 this.showTimer = 0;
 this.hideTimer = 0;
 this.showDelay = 0;
 this.hideDelay = 500;
 this.showMenu = '';

 // 'menu': the main data store, contains subarrays for each menu e.g. pMenu.menu['root'][];
 this.menu =  new Array();
 // litNow and litOld arrays control what items get lit in the hierarchy.
 this.litNow = new Array();
 this.litOld = new Array();

 // The item the mouse is currently over. Used by click processor to help NS4.
 this.overM = 'root';
 this.overI = 0;

 // The active menu and next item to which addItem() will assign its results. startMenu() sets
 // these automatically, set them manually if you want to call addItem() yourself, e.g.:
 // actMenu = 'root'; nextItem = 5; addItem('Another root menu item'...);
 this.actMenu = '';
 this.nextItem = 1;

 // Functions to create and manage the menu.
 this.over = popOver;
 this.changeCol = popChangeCol;
 this.out = popOut;
 this.click = popClick;
 this.clearLyr = popClearLyr;
 this.startMenu = popStartMenu;
 this.addItem = popAddItem;
 this.getHTML = popGetHTML;
 this.update = popUpdate;
 this.setupRef = popSetupRef;
 this.position = popPosition;
 
 // Default show and hide functions, overridden in the example script by the clipping routine.
 this.showMenu = function(mName) { this.menu[mName][0].lyr.vis('visible') }
 this.hideMenu = function(mName) { this.menu[mName][0].lyr.vis('hidden') }
}













// *** START EDITING HERE, READ THIS SECTION CAREFULLY! ***
//
//
// This menu script is split up into several sections. They are:
//
// (1) ITEMSTYLES - These define the colour and size of menu items. Compulsory.
// (2) MENU DATA - These specify the text and links in the menu. Compulsory.
// (3) EVENTS - Activate the menu(s), and choose creation mode (Dynamic / Fast) etc. I recommend
//     you read it, but you only really need to change it if you want multiple menus on one page,
//     or are trying to combine this with other JavaScripts.
// (4) ANIMATION - Change or remove menu animation here. Multiple menu users need to edit this.
// (5) FRAMESETS - Read this if you're using the menu across frames. Otherwise delete it.
// (6) OPTIONAL CODE - Extra features like adding clicking to 'sm:' items or status messages etc.
//     on mouseover. You can skip or delete this section.



// *** (1) ITEMSTYLES ***
//
// First of all we must create ItemStyles to use in the menu. ItemStyles are a collection of
// dimensions, colours, and font/border stylesheet class names used to control the appearance
// of items in the menu. The (somewhat lengthy) syntax is:
//
// styleName = new ItemStyle(length of items, spacing after items, 'popout indicator HTML',
//  popout indicator position, padding of text within item, 'out background colour or image
//  filename', 'hover background colour or image', 'out text stylesheet class', 'hover text class',
//  'out border stylesheet class', 'hover border class', out translucency percentage or null
//  for no translucency, hover translucency percentage or null);
//
// One thing that needs explaining is the popout indicator position -- you pass a positive
// integer to position it from the left of the item, and a negative integer to position it from
// the right edge of the item -- see the example code below if that doesn't make much sense.
// Pass an empty string '' as the over or out background for no background colours/image.
//
// Here are some examples used in this menu demo, read through and see how they're formatted:


// 'horizontal Bar' style: menu items that use this ItemStyle are 40px wide, have 10px spacing
// between them, no popout indicator (the ">" in some menus) or popout indicator position,
// 0px padding of the text within items, #006666 background colour, a hover colour of #669999,
// 'itemText' is the stylesheet class used for the menu text both normally and when highlighted,
// and no border classes. The last two nulls turn off translucency, set them to numbers
// between 0 and 100 to enable it. See the '<style>' tag for the classes used...
//DAVE  (height, spacing, delimiter for subnav, 
var hBar = new ItemStyle(26,6, '', 30, 2, '#666666', '#333333', 'itemText', 'itemText', 'itemBorder', 'itemBorder',
 null, null);


// The 'sub Menu' items: 22px long, 0px spacing, a 'greater than' sign for a popout indicator
// (you may wish to use an image tag?), the popout indicator is positioned 15px from the right
// edge of the item, items have 3px padding, some colours, it uses 'itemText' as the dimmed text
// class but 'itemHover' when it is moused over, and 'itemBorder' as the border stylesheet class.

//DAVE-- the two colors in this code represent the background color of the drop down and the bg color when rolled over.  The first num is height, second is spacing  between items 
var subM = new ItemStyle(35,0, '&gt;', -15, 3, '#cccccc', '#999999', 'subText', 'subHover',
 'subBorder', 'subBorder', null, null);

var subM2 = new ItemStyle(22,0, '&gt;', -15, 3, '#cccccc', '#999999', 'subText', 'subHover',
 'subBorder', 'subBorder', null, null);


// The purplish 'crazy' style, same length but extra 1px spacing (to show up the fancy border) and
// different colours/text and less padding. They also have translucency set -- these items
// are 80% opaque when dim and 90% when highlighted.
var crazy = new ItemStyle(22, 1, '&gt;', -15, 2, '#999999', '#000000', 'crazyText', 'crazyHover',
 'crazyBorder', 'crazyBorderOver', 80, 90);




// *** (2) MENU DATA ***
//
// To use this script you must create one or more PopupMenu() objects, that will contain all
// the menu data and functions used. This demo contains one, named 'pMenu', although you can
// have as many separate menus as you want on one page.
//    Next we add menus and items to the object, using the startMenu() and addItem()
// commands. Each menu object MUST contain one menu named 'root', which is the first, always
// visible menu. All menus have the orientation, position, dimension, and default ItemStyle
// to use passed to them. If you specify them as numbers, the Left and Top positions are
// measured from the upper-left corner of the trigger item used to pop it out on the fly.
// Otherwise, if you specify them as strings (which may include formulae), they are measured
// from the top-left corner of the page. The first, 'root' menu is always positioned from the
// page corner as it has no parent menu. The syntax for this command is:
//
// startMenu('menu name', Vertical menu? (true/false), left, top, width, default ItemStyle
//  for items in this menu, optional parent frame/window or layer in which this menu resides);
//
// Something that needs explaining - the Vertical Menu setup, which is a 'true' or 'false' without
// quotes passed as the second parameter to startMenu(). Pass 'true' is you want that menu to
// be vertical, or 'false' to have a horizontal bar (like the root menu in this example).
//    The 'width' depends on the orientation of the menu -- for vertical menus it's the width,
// for horizontal menus it is the height. Basically, it's the constant dimension for all the items.
//    The parent window or layer parameter is optional, if not specified the current window is
// used -- this example does not use frames. See the FRAMESET README below if you're using them.
//
//
// Once you have defined a menu, you add items to that menu using the addItem() command.
// Items themselves must be passed 3 compulsory parameters -- the text to display in the
// item, the action or URL the item has when clicked, and the type of the action/target frame.
// All other parameters are optional -- you can override the menu's default ItemStyle with the
// item's own, and optionally override that was well by specifying a list of parameters in the
// same order as an ItemStyle. See the 'Reopen' menu below for an example of these extras...
//
// addItem('Text', 'URL', 'action type', optional ItemStyle, length, spacing, 'popout indicator',
//  popout indicator position....... in the same order as ItemStyles, see above);
//
// The 'action type' needs explaining. This tells the script what to do with the URL. You
// leave this a blank string '' to open the URL in the current window -- the default action.
// Or, you can set this to 'js:' to specify that the URL is a JavaScript function that gets
// executed when the item is clicked. Thirdly, you can pass a string containing a valid
// reference to a window/frame from the window/frameset in which this script is located,
// e.g. 'top.leftFrame' or 'parent.popupWin', to make the URL load in there when clicked --
// think of 'parent.main' as similar to <a target="main">.
//    Most importantly, you pass 'sm:' to specify that the URL is the name of a submenu to pop
// out when moused over. See the example below if this seems complicated, it's quite easy once
// you get the hang of it. Thanks to Martin J. Cole for originally suggesting the syntax!
//
// If you want more information, there's a FAQ (Frequently Asked Questions) section on my
// site: http://www.twinhelix.com, on the 'Popup Menus' page.



// A PopupMenu() object must be passed its own name so it can reference itself when the menu
// is active. We also use a 'with' block to work with its properties and functions below.
var pMenu = new PopupMenu('pMenu');
with (pMenu)
{

// *** MOVE OR CENTRE THE MENU HERE ***
// To centre it, or scroll with the window etc, just include a global variable or formula as one
// of the positions. This script includes my page object, which has several useful methods, namely
// 'page.winW()', 'page.winH()', 'page.scrollY()' and 'page.scrollX()'. These return the current
// dimensions of the visible window area and the scroll position of the window, which can be
// used to position menus however you want. Try replacing the first startMenu() below with one of:
//startMenu('root', false, 'page.winW()/2 - 120', 'page.scrollY()', 17, hBar); // Centres & floats.
//startMenu('root', false, 10, 0, 17, hBar, 'frameName'); // To create in subframe.

// The 'root' menu is horizontal, positioned at (x = 10, y = 0) and is 17px high, and items
// by default use the colours and dimensions in the 'hBar' ItemStyle defined above.

// *** THE FIRST TWO ARE LEFT AND TOP ***
startMenu('root', true, 30, 110, 140, hBar);

// The text is a space then 'File', and this item pops out the 'mFile' submenu when moused over
// as we've set 'sm:' as the action type. If you want to assign a click action (i.e. navigating to
// a file) to one of these 'sm:' items, see the 'Optional Code' section below.
addItem('Home', 'index.html', '');
addItem('About TAIM','about.html','');
addItem('Industries', 'industries.html', '');
addItem('Our Expertise', 'mexpertise', 'sm:');
addItem('Projects', 'mprojects', 'sm:');
addItem('Contact Us', 'contact.html', '');
//addItem('Login', 'login.html', '');

// This is a vertical menu positioned 0px across and 22px down from its trigger, and is 80px wide.
// **** startMenu('mAboutUs', true, 0, 13, 150, subM);
// The URLs are set to # here, be sure to replace them with your path/file names or JS functions!
// Also note how all the types are '', indicating these links open in the current frame.
// **** addItem('Overview', 'http://www.electrofed.com/aboutus/index.htm', '');
// **** addItem('Contact Us', 'http://www.electrofed.com/aboutus/contactus/index.htm', '');
// **** addItem('Operations & Leadership', 'http://www.electrofed.com/aboutus/operations/index.htm', '');
// **** addItem('Members & Membership', 'http://www.electrofed.com/aboutus/members.htm', '');
// **** addItem('Industry Links', 'http://www.electrofed.com/aboutus/links.htm', '');
// **** addItem('Services', 'http://www.electrofed.com/aboutus/services.htm', '');
// Notice we're popping out a submenu again here, so set 'sm:' as the action type...
//addItem('Reopen', 'mReopen', 'sm:');

//DAVE-- THE second number is the position down from the calling element
startMenu('mexpertise', true, 130, 0, 160, subM);
addItem('Procurement &amp; Outsourcing Services', 'procurement.html', '');
addItem('Project Development &amp; Financing', 'financing.html', '');
addItem('Engineering Services', 'engineering.html', '');

startMenu('mprojects', true, 130, 0, 160, subM2);
addItem('Ongoing Projects', 'ongoing.html', '');
addItem('Completed Projects', 'completed.html', '');


// **** startMenu('mNews', true, 0, 13, 150, subM);
// Instead of using spaces to indent, consider a special text stylesheet in an ItemStyle?
// **** addItem('The Advocate', 'http://www.electrofed.com/news/advocate.htm', '')
// **** addItem('Electro-Facts', 'http://www.electrofed.com/news/Efacts.htm', '');
// **** addItem('Events', 'http://www.electrofed.com/events/index.htm', '');
// **** addItem('Press Releases', 'http://www.electrofed.com/news/press.htm', '');
// **** addItem('Government Relations', 'http://www.electrofed.com/news/GovernmentRelations/index.htm', '');
// **** addItem('Training & Development', 'http://www.electrofed.com/news/TrainingDevelopment/index.htm', '');
// **** addItem('Annual Report', 'http://www.electrofed.com/news/ann_report.htm', '');
// **** addItem('Scholarship Program', 'http://www.electrofed.com/news/Scholarship/index.htm', '');
// **** addItem('Advertising', 'http://www.electrofed.com/news/Advertising/index.htm', '');

// Here we add extra optional parameters to specify an individual popout indicator, positioned 3px
// from the left edge of this item,  along with the normal dimensions etc, instead of declaring a new
// ItemStyle especially for this item. You have to add all parameters up to the one you're specifying. 
//addItem('About', 'mAbout', 'sm:', subM, 22, 0, '', 0);

// This is across but not down... a horizontal popout.
// **** startMenu('mReopen', true, 85, 0, 120, crazy);
// Again these items have their own ItemStyles, and sometimes lengths and spacings specified.
// **** addItem('Recent Doc 1:<br>Schedule', '#', '', crazy, 35);
// **** addItem('Recent Doc 2:<br>Cunning Plan', '#', '', crazy, 35, 5);
// Ah, back to the normal blue ItemStyle for this item.
// **** addItem('Etc. etc...', '#', '', subM);

// Leftwards popout with a negative x and y relative to its trigger.
// **** startMenu('mAbout', true, -85, -18, 80, subM);
// **** addItem('Leftwards!<br>And up!', '#', '', subM, 40);

// **** startMenu('mEvents', true, 0, 13, 135, subM);
// **** addItem('EFC Events', 'http://www.electrofed.com/events/index.htm', '');
// **** addItem('Atlanic Region Events', 'http://www.electrofed.com/EVENTS/atlantic.htm', '');
// **** addItem('Québec Region Events', 'http://www.electrofed.com/EVENTS/quebec.htm', '');
// **** addItem('Industry Events', 'http://www.electrofed.com/events/industry.htm', '');


// **** startMenu('mStatistics', true, 0, 13, 110, subM);
// **** addItem('Overview', 'http://www.electrofed.com/statistics/index.htm', '');
// **** addItem('Current Programs', 'http://www.electrofed.com/statistics/programs.htm', '');
// **** addItem('Links', 'http://www.electrofed.com/statistics/links.htm', '');

// **** startMenu('mE-Commerce', true, 0, 13, 80, subM);
//addItem('Member1', '#', '');

// **** startMenu('mContactUs', true, 0, 13, 80, subM);
//addItem('Email', '#', '');
//addItem('Phone', '#', '');
//addItem('Fax', '#', '');

// You can also assign hide or show delays (in milliseconds) to the menus. Defaults are:
//showDelay = 0;
//hideDelay = 500;
// Specify hideDelay as zero if you want to disable autohiding, and showDelay as a couple of
// hundred if you don't want the menus showing instantaneously when moused over.

// End of 'with (menu Object)' block. That's one menu object created, now we have to activate it...

}


// You can create another menu object here if you want multiple menus on a page.
// Every menu object MUST have a menu named 'root' in it, as that's always visible.
// You can name the other menus in it anything you want.

//var anotherMenu = new PopupMenu('anotherMenu');
//with (anotherMenu)
//{
// startMenu('root', .....);
// ... make menus here ...
//}
// Then remember to add it to the event section below...





// *** (3) EVENTS ***
//
// In JavaScript, there are document 'events' you need to set so any scripts you are using
// are notified of things like page loading/clicking/scrolling. If you've got several menus
// or another JavaScript entirely in your page, you'll need to add all their functions in here.
// For another menu object, call its functions like update() and position() next to pMenu's.
//    The reason for these is that every time you set them, they override a previous setting.
// So make sure you collate all the functions that need to be called in here! Syntax:

//object.onevent = function()
//{
// function1();
// function2();
// ...
//}

// That's similar to: <BODY ONEVENT="function1(); function2(); function3()...">


// The most important event is one used to display the menu by calling one of several methods of
// any menu object(s) you have created. This is where you select the menu creation mode. 'Dynamic'
// mode inserts the menus into the document once it has finished loading and supports features
// like modifying the menu after creation. You create a 'Dynamic' mode menu by just calling the
// .update() method of a menu object like 'pMenu'.
//    'Fast' creation mode writes the menus to the document here and now, which is faster and
// more reliable in older browsers but doesn't allow those fancy tricks -- you do this by passing
// 'true' without quotes to the update function to signal that we're inline.
//    Opera only supports Fast mode and Netscape 4 is only reliable in Dynamic mode, so we use
// browser-detect code here. If you find some browser has troubles with one mode or another, try
// the other menu creation method -- see the "Cross-Browser" code at the very top of the <SCRIPT>
// tag for the variables used.

if (!isNS4)
{
 // Write menus now in non-NS4 browsers, by calling the "Fast" mode .update(true) method.
 pMenu.update(true);
 //anotherMenu.update(true);
}
else
{
 // For Netscape 4, back up the old onload function and make a new one to update our menus.
 // This is the regular "Dynamic" mode menu update, it works in IE and NS6 too.
 var popOldOL = window.onload;
 window.onload = function()
 {
  if (popOldOL) popOldOL();
  pMenu.update();
  //anotherMenu.update();
 }
}


// Other events must be assigned, these are less complicated, just add or remove menu objects.

window.onresize = function()
{
 ns4BugCheck();
 pMenu.position();
 //anotherMenu.position();
}

window.onscroll = function()
{
 pMenu.position();
 //anotherMenu.position();
}

if (isNS4) document.captureEvents(Event.CLICK);
document.onclick = function(evt)
{
 pMenu.click();
 //anotherMenu.click();
 if (isNS4) return document.routeEvent(evt);
}


// A small function that refreshes NS4 on window resize to avoid bugs, called above.
var nsWinW = window.innerWidth, nsWinH = window.innerHeight;
function ns4BugCheck()
{
 if (isNS4 && (nsWinW!=innerWidth || nsWinH!=innerHeight)) location.reload()
}

// Activate the useful 'onscroll' event for non-Microsoft browsers.
if (!isIE || window.opera)
{
 var nsPX=pageXOffset, nsPY=pageYOffset;
 setInterval('if (nsPX!=pageXOffset || nsPY!=pageYOffset) ' +
 '{ nsPX=pageXOffset; nsPY=pageYOffset; window.onscroll() }', 50);
}





// *** (4) ANIMATION ***
//
// Each menu object you create by default shows and hides its menus instantaneously.
// However you can override this behaviour with custom show/hide animation routines.
// I have included an example clipping animation below. Feel free to edit it, or delete
// this entire section if you don't like the animation to turn it off.
//   If you've created several menu objects, you must assign the animation functions to
// each of them to override the default if you want them all to animate. Also note that not
// all browsers can clip happily, such as Opera, so they don't have these functions assigned.

// This is the clipping animation function. Customisers: My lyr.clip() command gets passed the
// parameters (x1, y1, x2, y2) so you might want to adjust the direction etc. Oh, and I'm
// adding 2 to the dimensions to be safe due to different box models in some browsers.
// Another idea: add some if/thens to test for specific menu names...?
function menuClip(menuObj, menuName, dir)
{
 // The array index of the named menu (e.g. 'mFile') in the menu object (e.g. 'pMenu').
 var mD = menuObj.menu[menuName][0];
 // Add timer and counter variables to the menu data structure, we'll need them.
 if (!mD.timer) mD.timer = 0;
 if (!mD.counter) mD.counter = 0;
 with (mD)
 {
  // Stop any existing animation.
  clearTimeout(timer);
  // If the layer doesn't exist (cross-frame navigation) quit.
  if (!lyr || !lyr.ref) return;
  // Show the menu if that's what we're doing.
  if (dir==1) lyr.vis('visible');
  // Also raise showing layers above hiding ones.
  lyr.sty.zIndex = 1001 + dir;
  // Clip the visible area. Tweak this if you want to change direction/acceleration etc.
  lyr.clip(0, 0, menuW+2, (menuH+2)*Math.pow(Math.sin(Math.PI*counter/20),0.75) );
  // Increment the counter and if it hasn't reached the end (10 steps either way) set the timer.
  // Clear the clipping value in DOM browsers as early NS6 versions are quite terrible at this.
  counter += dir;
  if (counter==11) { counter = 10; if (isDOM&&!isIE) lyr.sty.clip='' }
  else if (counter<0) { counter = 0; lyr.vis('hidden') }
  else timer = setTimeout(menuObj.myName+'.'+(dir==1?'show':'hide')+'Menu("'+menuName+'")', 40);
 }
}


// Add the effect to the 'pMenu' menu object for supported browsers. Opera doesn't support clipping
// so we turn it off, neither does IE4/Mac.
if (!window.opera)
{
 pMenu.showMenu = new Function('mN','menuClip(pMenu, mN, 1)');
 pMenu.hideMenu = new Function('mN','menuClip(pMenu, mN, -1)');
 // Add it to other menu objects like this...
 //anotherMenu.showMenu = new Function('mN','menuClip(anotherMenu, mN, 1)');
 //anotherMenu.hideMenu = new Function('mN','menuClip(anotherMenu, mN, -1)');
}




// *** (6) OPTIONAL CODE ***   DELETE IF YOU'RE NOT USING THESE!
//
// If you want, you can assign functions to handle mouse events like mouse over/out/click.
// You'll want to use these for assigning click actions to 'sm:' items or status messages etc.
// 'with (this)' means use the properties of the menu object, like overM and overI which
// are the current menu name and item number.
// To uncomment and activate, delete the /* and */ at the start and end.

/*
pMenu.onclick = function() { with (this)
{
 // Do actions depending on the item that the mouse was over at the time of the click.
 // You may with to use nested IFs or 'switch' statements etc. if you're familiar with JS.
 if (overM == 'root' && overI == 1) status = 'Congratulations, you\'ve mastered clicking!';
 if (overM == 'root' && overI == 2) location.href = 'edit.html';
}}

// Set the status message to the URL if the 'action type' is nothing, and clear on mouseout.
pMenu.onmouseover = function() { with (this)
{
 // By now, you either have my JS Object Browser script from my site or you need it... try
 // embedding in an IFrame and typing 'pMenu' into its Go To field to see the menu internals.
 with (menu[overM][overI]) if (!type) status = href;
}}
pMenu.onmouseout = function() { status = '' }
*/



// This illustrates changing the contents of the menu -- delete this, it's unnecessary...
// This DOES NOT WORK in Opera yet (as of v6.00 at time of writing) by the way.
function changeMenu() { with (pMenu)
{
 // If your modifications are quite extensive, probably hide the menu before commencing
 // them, as the script relies on the menu array in realtime to handle highlighting etc.
 //over('root', 0);
 //menu.root[0].lyr.vis('hidden');

 // Create a whole new menu...
 startMenu('mNewMenu', true, 0, 22, 130, subM);
 addItem('<b>TwinHelix Designs:</b><br>Extreme DHTML.<br>Small Code.<br>Click to Visit...',
  'window.open("http://www.twinhelix.com")', 'js:', subM, 70);

 // Alter just the 'Visit My Site' menu item to pop it out... setting nextItem tells the
 // addItem() command which item number we are up to in the sequence.
 actMenu = 'root';
 nextItem = 4;
 addItem('&nbsp; Dynamism...', 'mNewMenu', 'sm:', hBar, 80);

 // Call the update function to implement our changes.
 update();
}}


// This is just the moving command called when you click the feature list.
function moveRoot()
{
 with (pMenu.menu.root[0].lyr) x( (x()<100) ? 100 : 10);
}


// End Hide -->
