//<![CDATA[

// For each menu you create, you must create a matching "FSMenu" JavaScript object to represent
// it and manage its behaviour. You don't have to edit this script at all if you don't want to;
// these comments are just here for completeness. Also, feel free to paste this script into the
// external .JS file to make including it in your pages easier!

// Here's a menu object to control the above list of menu data:
var secondMenu = new FSMenu('secondMenu', true, 'visibility', 'visible', 'hidden');

// The parameters of the FSMenu object are:
//  1) Its own name in quotes.
//  2) Whether this is a nested list menu or not (in this case, true means yes).
//  3) The CSS property name to change when menus are shown and hidden.
//  4) The visible value of that CSS property.
//  5) The hidden value of that CSS property.

// It must match a <ul> list in the page with an "id" attribute that is the same as its
// own name plus 'Root', like the list above. This was you can create several menus in one
// page, each with their own unique FSMenu object and settings.

// Here's some optional settings for delays and highlighting:
//  * showDelay is the time (in milliseconds) to display a new child menu.
//  * switchDelay is the time to switch from one child menu to another child menu.
//    Set this higher and point at 2 neighbouring items to see what it does.
//  * hideDelay is the time it takes for a menu to hide after mouseout.
//  * cssLitClass is the CSS classname applied to parent items of active menus.
//  * showOnClick will, suprisingly, set the menus to show on click. Pick one of 3 values:
//    0 = all mouseover, 1 = first level click, sublevels mouseover, 2 = all click.

secondMenu.showDelay = 0;
secondMenu.switchDelay = 0;
secondMenu.hideDelay = 0;
secondMenu.cssLitClass = 'highlighted';
//secondMenu.showOnClick = 1;


// Now the fun part... animation! This script supports animation plugins you can add to each
// menu object you create. Here's two to get you started. To enable animation, add one or
// more functions to the menuObject.animations array, and set menuObject.animSpeed to the
// desired percentage of animation to be completed per frame.
// Animation functions are called with a reference to the menu element being animated,
// and a counter variable that changes from 0 to 100 depending on the animation progress.

// function animClipDown(ref, counter)
// {
//  var cP = Math.pow(Math.sin(Math.PI*counter/200),0.75);
//  ref.style.clip = (counter==100 ? (window.opera ? '': 'rect(auto, auto, auto, auto)') :
//   'rect(0, ' + ref.offsetWidth + 'px, '+(ref.offsetHeight*cP)+'px, 0)');
// };
// 
// function animFade(ref, counter)
// {
//  var f = ref.filters, done = (counter==100);
//  if (f)
//  {
//   if (!done && ref.style.filter.indexOf("alpha") == -1)
//    ref.style.filter += ' alpha(opacity=' + counter + ')';
//   else if (f.length && f.alpha) with (f.alpha)
//   {
//    if (done) enabled = false;
//    else { opacity = counter; enabled=true }
//   }
//  }
//  else ref.style.opacity = ref.style.MozOpacity = counter/100.1;
// };

// I'm applying them both to this menu and setting the speed to 20%. Delete this to disable.
// secondMenu.animations[secondMenu.animations.length] = animFade;
// secondMenu.animations[secondMenu.animations.length] = animClipDown;
// secondMenu.animSpeed = 20;



// Finally, on page load you have to activate the menu by calling its 'activateMenu()' method.
// I've provided an "addEvent" method that lets you easily run page events across browsers.
// You pass the activateMenu() function two parameters:
//  (1) The ID of the outermost list element.
//  (2) A node containing your submenu popout arrow indicator.
// If none of that made sense, just cut and paste this next bit for each menu you create.



var arrow = null;
if (document.createElement && document.documentElement)
{
 arrow = document.createElement('span');
 arrow.appendChild(document.createTextNode(''));
 // Feel free to replace the above two lines with these for a small arrow image...
 //arrow = document.createElement('img');
 //arrow.src = 'arrow.gif';
 //arrow.style.borderWidth = '0';

 arrow.className = 'subind';
}

addEvent(window, 'load', new Function('secondMenu.activateMenu("secondMenuRoot", arrow)'));


// You may wish to leave your menu as a visible list initially, then apply its style
// dynamically on activation for better accessibility. Screenreaders and older browsers will
// then see all your menu data, but there will be a 'flicker' of the raw list before the
// page has completely loaded. If you want to do this, remove the CLASS="..." attribute from
// the above outermost UL tag, and uncomment this line:
//addEvent(window, 'load', new Function('getRef("secondMenuRoot").className="menulist"'));


//]]>