/*
	Home Menu & RHS Menu for NAB FHB
*/
	// Grabs all elements by their classname, very handy!
	function getElementsByClassName(classname, node)  {
		if(!node) node = document.getElementsByTagName("body")[0];
		var a = [];
		var re = new RegExp('\\b' + classname + '\\b');
		var els = node.getElementsByTagName("*");
		for(var i=0,j=els.length; i<j; i++)
			if(re.test(els[i].className))a.push(els[i]);
		return a;
	}
	// Binds our DHTML events to the elements.
	function addEvent(obj, event, fn, i){
		// Mozilla / Gecko
		if (window.addEventListener){
			switch (event){
				case "onclick":
					obj.onclick = function(){eval(fn(obj,i));};
					break;
				case "onmouseover":
					obj.onmouseover = function(){eval(fn(obj,i));};
					break;
				case "onmouseout":
					obj.onmouseout = function(){eval(fn(obj,i));};
					break;
			}
		// IE / MS
		} else { 
			obj.attachEvent(event, function(){eval(fn(obj,i))});
		} 
	}
	
	
	/* For Home DHTML */
	var myDropLI;
	var currentMenu;
	// The DHTML Menu
	function home_bindToDHTML(el){
		// First, bind all top LI elements
		myDropLI = getElementsByClassName("option");
		// Set up the event handlers to show all menus
		for(var i=0; i<myDropLI.length; i++){
			addEvent(myDropLI[i], "onclick", setupMenuSummaryClick, i);
			addEvent(myDropLI[i], "onmouseover", setupMenuSummaryOver, i);
			addEvent(myDropLI[i], "onmouseout", setupMenuSummaryOut, i);
		}
	}
	// ONCLICK
	function setupMenuSummaryClick(obj,i){
		showMenuSummary(obj, i);
		currentMenu = i;
	}
	// ONMOUSEOVER
	function setupMenuSummaryOver(obj,i){
		obj.style.color = "red";
	}
	// ONMOUSEOUT
	function setupMenuSummaryOut(obj,i){
		//if(currentMenu != i) obj.style.color = "#444444";
	}
	// Show the hidden menu summary
	function showMenuSummary(obj, elID){
		// First hide all other menus
		var myHiddenLI = getElementsByClassName("hidden");
		for(var i=0; i<myHiddenLI.length; i++){
			myDropLI[i].style.color = "#444444";
			myDropLI[i].style.backgroundImage = "url(/vgnmedia/images/About_Us/com_view_more_btn.gif)";
			myHiddenLI[i].style.display = "none";
		}
		if(window.openMenu != elID){
			// Set our newly selected menu to red
			myDropLI[elID].style.color = "red";
			// Now show our matching summary
			myHiddenLI[elID].style.display = "list-item";
			// Update the arrow
			myDropLI[elID].style.backgroundImage = "none";//url(cssimages/view_more_btn.gif)";
			// Set the open id
			window.openMenu = elID;
		}else{
			window.openMenu = null;
		}
	}
	
	/* For RHS DHTML */
	var myDropDiv;
	function rhs_bindToDHTML(el){
		// First, bind all top DIV elements
		myDropDiv = getElementsByClassName("rhsmenu");
		// Set up the event handlers to show the sub menu list
		for(var i=0; i<myDropDiv.length;i++){
			addEvent(myDropDiv[i], "onclick", showSubMenu, i);
		}
	}
	// ONCLICK
	function showSubMenu(obj, elID){
		var myHiddenDiv = getElementsByClassName("hidden");
		for(var i=0; i<myHiddenDiv.length;i++){
			myDropDiv[i].style.backgroundImage = "url(/vgnmedia/images/About_Us/com_view_more_btn.gif)";
			myHiddenDiv[i].style.display = "none";
		}
		myHiddenDiv[elID].style.display = "block";
		myDropDiv[elID].style.backgroundImage = "url(/vgnmedia/images/About_Us/com_view_more_btn.gif)";
		
	}
	
	/* For How To Apply DHTML */
	function howto_bindToDHTML(el){
		el = document.getElementById(el);
		addEvent(el, "onclick", showHideHowTo, i);
	}
	var howtoOpen = false;
	function showHideHowTo(obj, i){
		if(!howtoOpen){
			document.getElementById("howtomenu").style.display = "block";
			obj.style.backgroundImage = "url(/vgnmedia/images/About_Us/com_ad_on_white.gif)"
			howtoOpen = true;
		}else{
			document.getElementById("howtomenu").style.display = "none";
			obj.style.backgroundImage = "url(/vgnmedia/images/About_Us/com_view_more_btn.gif)"
			howtoOpen = false;
		}
	}
