// JavaScript Document
//<![CDATA[
	
	// 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.
	var listMenu = new FSMenu('listMenu', true, 'visibility', 'visible', 'hidden');

	// 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.

	//listMenu.showDelay = 0;
	//listMenu.switchDelay = 125;
	//listMenu.hideDelay = 500;
	listMenu.cssLitClass = 'highlighted';
	//listMenu.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.
	listMenu.animations[listMenu.animations.length] = animFade;
	listMenu.animations[listMenu.animations.length] = animClipDown;
	listMenu.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('listMenu.activateMenu("listMenuRoot", 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("listMenuRoot").className="menulist"'));

	//]]>
