// GENERAL CORE FUNCTIONS
function delegate(_func, _scope, event)
{
	return function(event)
	{
		_func.call(_scope,event);
	}
}

//function $(id)
//{
//	return document.getElementById(id);
//}

function observe(obj, eventName, callbackFunction, useCapture)
{
	if (obj.attachEvent)
	{
		obj.attachEvent("on" + eventName, callbackFunction);
	}
	else
	{
		obj.addEventListener(eventName, callbackFunction, useCapture);
	}
}
// -- End general functions

/// Navigation is a class that applies javascript events and styles to menu navigation
/// Elements.
/// 	navigationId      -> id of the navigation container (DIV)
///		overCssClass      -> "nav-hover" class that will be given to menu items when hovering over them -> defined in css stylesheet 
///		nextLevelCssClass -> "nav-arrow" class that will be given to menu items containing sub menues -> defined in css stylesheet
///		firstLevelId      -> "current" id that will apply style to menu item when on hover state (li)
///		nextLevelId       -> "current-sub" or other id that will apply style to menu item when on hover state (li) that is not in the first level

var Navigation = function(navigationId, nextLevelId)
{
	var N = {
		navigationId:		navigationId,
		overCssClass: "sfhover",
		nextLevelCssClass:	"nav-arrow",
		firstLevelId:		"current",
		nextLevelId:		nextLevelId || "current-sub",
		
		start: function()
		{
			this.attachAllEvents();	
		},
		
		attachUlEvents: function(ulElement, firstLevel)
		{
			if (ulElement && ulElement.childNodes)
			{
				var sfEls = ulElement.childNodes;
				var _base = this;
				for (var i=0, len=sfEls.length ; i<len ; i++) 
				{
					if (sfEls[i].tagName == "LI")
					{
						sfEls[i].onmouseover=function() 
						{
							this.className+=(this.className.length>0? " ": "") + _base.overCssClass;
							this.firstChild.id = firstLevel ? _base.firstLevelId : _base.nextLevelId;
						}
						sfEls[i].onmouseout=function() 
						{
							this.className=this.className.replace(new RegExp("( ?|^)" + _base.overCssClass + "\\b"), "");
							this.firstChild.id = "";
						}
					}
				}
			}
		},
		
		attachAllEvents: function()
		{
			var navigationContainer =document.getElementById(this.navigationId);
			if (navigationContainer)
			{
				var sfEls = navigationContainer.getElementsByTagName("LI");
				var sfEl;
				var _base = this;
				for (var i=0; i<sfEls.length; i++) 
				{
					sfEl = sfEls[i];
					sfEl.className=sfEl.className.replace(new RegExp("( ?|^)" + this.overCssClass + "\\b"), "");
					sfEl.onmouseover=function() 
					{
						this.className+=(this.className.length>0? " ": "") + _base.overCssClass;
					}
					sfEl.onmouseout=function() 
					{
						this.className=this.className.replace(new RegExp("( ?|^)" + _base.overCssClass + "\\b"), "");
					}
					
					// add arrow
					var aElements = sfEl.getElementsByTagName('a');
					var element;
					for (var aIndex = 1, len=aElements.length ; aIndex<len ; aIndex++)
					{
						element = aElements[aIndex].nextSibling;
						
						if (element && !element.tagName)
							element = element.nextSibling;
		
						if (element && element.tagName == "UL")
							aElements[aIndex].className += " " + this.nextLevelCssClass;
					}
				}
				
				// add current hover effect in main tabs link
				var ulElements = navigationContainer.getElementsByTagName("UL");
				if (ulElements && ulElements.length)
				{
					for (var i=0, len=ulElements.length ; i<len ; i++)
						this.attachUlEvents(ulElements[i], (i==0));
				}
			}
		}
		
	};
	
	return N;
}

function initMainNavigation()
{
	var nav = new Navigation("main-navigation");
	nav.start();
}

//$(function() { initMainNavigation(); });
observe(window, "load", initMainNavigation, false);