/************************/
/* MAD CSS AJAX MENU V1 */
/************************/

/* 	Instructions
	////////////
	
1/ 	Insert the following code into the masterpage

START ********************************

<!-- MAD CSS AJAX MENU V1 BLOCK -->
<script src="/common/scripts/scriptaculous/lib/prototype.js" type="text/javascript"></script>
<script src="/common/scripts/madMenu/madMenu.js" type="text/javascript"></script>
<script type="text/javascript">
	var activeItem = <asp:literal id="activeMenuId" runat="server" text="0"/>;
	var disableMenu  = <asp:literal id="disableMenu" runat="server" text="false"/>;
	var host  = 'http://<%=request.servervariables("HTTP_HOST") & Session("ApplicationPath") %>';
</script>
<!-- MAD CSS AJAX MENU V1 compliance patch for microsoft browsers -->
<!--[if lt IE 7]>
<script>
	isIE6 = "yes";
</script>
<![endif]-->
<!-- END MAD CSS AJAX MENU V1 BLOCK -->	
END ********************************

2/ 	Make sute this file is located at /common/scripts/madMenu/
3/ 	Make sure the prototype script libary is located at /common/scripts/scriptaculous/lib/
4/ 	Setup the master page to write the active L1 cat to the text value of the asp:literal activeMenuId you included in the code above.
	this allows you to pass the active menu item to the ajax menu (as the entire menu is replaced if this in not passed then you will loose the active state.
5/ 	If this site uses one master template and disables the left nav for the checkout area etc then the asp:literal 'diableMenu' you included above should be
	be set to true (case sensitive) when the left nav is not required, this prevents the ajax call from triggering when its not needed.
6/	Make changes as required to the setup section below.
7/	Create the ajax menu aspx page.
*/	

/* Setup */
/*********/

// 1 Set this the the name of the class to be used for IE6 hover emulation
var ieClassName = "iehover";

// 2 set this to the location of the ajax page
var ajaxPage = "/modules/genericFlyoutMenuHandler.ashx";

// 3 set this to the id of the div where the menu should be loaded
var menuDiv = "topNav";
	
// 4 Add any css class names attached to the elements that require IE6 emulation to this array
/* e.g
	<ul>
		<li class="first">
			<ul>
				<li></li>
				<li></li>
				<li></li>
			</ul>
		</li>
		<li>
			<ul>
				<li></li>
				<li></li>
				<li></li>
			</ul>
		</li>
		<li class="last">
			<ul>
				<li></li>
				<li></li>
				<li></li>
			</ul>
		</li>
	</ul>
	
In this example the 3 li's with subnavs will require :hover emulation for IE6, the classes 'first' and 'last' 
will be replaced (and the styles won't then work correctly) unless they are added to this array.
*/
var preserveStyles = new Array()
preserveStyles[0] = 'menu'	
	
/* DO NOT EDIT AFTER THIS LINE */
/*******************************/

//sets default to non emulation mode
var isIE6 = "no";

Event.observe(window, 'load', function() {
  ajaxMenu(menuDiv);
});

/* MAD CSS AJAX MENU V1	- AJAX CALL*/
/* where = target div */
function ajaxMenu(where) {
//Check that the menu is not disabled and get the menu if it is
	if (disableMenu == false) {
		new Ajax.Updater({ success: where }, host+ajaxPage+'?CatID='+ activeItem + '&rootID=' + rootItem + '&ie=' + isIE6, { method: 'get' });
		}//if
}

/*IE6 Hover emulation functions */
function on(which) {
		var i;
		for (i=0; i<preserveStyles.length; ++i) {
			if(which.className == preserveStyles[i]){
				which.className= preserveStyles[i] + ' ' + ieClassName;
			}//if
		} // for

		if(which.className == ''){
			which.className=ieClassName;
		}//if
	}

function off(which) {
		var i;

		for (i=0; i<preserveStyles.length; ++i) {
			if(which.className == preserveStyles[i] + ' ' + ieClassName){
				which.className= preserveStyles[i];
			}//if
		} // for

		if(which.className == ieClassName){
			which.className='';
		}//if
	}