var isie = (document.all) ? true : false;

function MenuItem (id, name)
{
	/// default properties of a menuitemobject
	this.id           = id;
	this.name         = name;
	this.children     = new Array();
	
	/// each menuitemobject gets its own timer to avoid problems with multithreading
	this.timer        = null;			
	
	/// if the method setopacityvalues is triggerd then useopacity will be set to true
	this.useopacityfade	  = false;

		this.opacity      = null;
		this.opacitystart = null;
		this.opacityend   = null;
		this.opacitystep  = null;
		this.opacityspeed = null;

	/// if the method setslidemenuvalues is triggerd then useslidemenu will be set to true
	this.useslidemenu	  = false;
		
		this.slidesubelement	= null;
		
		this.slidewidth			= null;
		this.slideheight		= null;
		this.slidepercentage	= null;
		this.slidespeedout	  	= null;
		this.slidespeedin	  	= null;
		this.slidespeedbridge 	= null;
		
		this.slidecurrentheight	= null;
		this.slidecurrentwidth	= null;
		
		this.slidetop			= null;
		this.slideposition		= 0;
		
		this.sliderollout 		= false;	// rollout become true when the mouseover triggered the function SlideMenu

	/// if the method setswapmenuvalues is triggerd then useswapmenu will be set to true
	this.useswapmenu	  = false;
}

	MenuItem.prototype.SetOpacityValues = function (opacitystart, opacityend, opacitystep, opacityspeed)
	{
		this.opacity      = opacitystart;
		
		this.opacitystart = opacitystart;
		this.opacityend   = opacityend;
		this.opacitystep  = opacitystep;
		this.opacityspeed = opacityspeed;
		
		this.useopacityfade = true
	}

	MenuItem.prototype.SetSlideMenuValues = function (slidewidth, slideheight, slidepercentage, slidespeedout, slidespeedin, slidespeedbridge)
	{
		this.slidesubelement	= document.getElementById('sub' + this.id);
		
		this.slidenextsibling	= null;
		
		this.slidewidth		  = slidewidth;
		this.slideheight	  = slideheight;
		this.slidepercentage  = slidepercentage;
		this.slidespeedout	  = slidespeedout;
		this.slidespeedin	  = slidespeedin;
		this.slidespeedbridge = slidespeedbridge;
		
		this.slidecurrentheight	= this.slidesubelement.offsetHeight;
		this.slidecurrentwidth	= slidewidth;
		
		this.slidetop			= this.slidesubelement.offsetTop;	// original position of the element
		
		this.useslidemenu = true;
	}
	
	MenuItem.prototype.SetSwapMenuValues = function ()
	{
		this.useswapmenu = true;
	}
	
	MenuItem.prototype.AddChild = function (menuitem)
	{
		this.children[this.children.length] = menuitem;
	}
	
	MenuItem.prototype.Fader = function (state)
	{
		var element = document.getElementById(this.id);
		var self	= this;
		
		clearTimeout (this.timer);
		
		switch (state)
		{
			// fade in
			case true:
				
				this.opacity = this.opacity + this.opacitystep
				
				if (isie)
				{
					element.filters.alpha.opacity = this.opacity;
				}
				else
				{
					element.style.MozOpacity = this.opacity/100;
					element.style.KhtmlOpacity = this.opacity/100;
				}
				
				if (this.opacity < this.opacitystart)
				{
					this.timer = setTimeout(function(){self.Fader(state)}, this.opacityspeed);
				}
				
				break;
			
			// fade out
			case false:
				
				this.opacity = this.opacity - this.opacitystep
				
				if (isie)
				{
					element.filters.alpha.opacity = this.opacity;
				}
				else
				{
					element.style.MozOpacity = this.opacity/100;
					element.style.KhtmlOpacity = this.opacity/100;
				}
				
				if (this.opacity > this.opacityend)
				{
					this.timer = setTimeout(function(){self.Fader(state)}, this.opacityspeed);
				}
				
				break;
		}
    }
	
	MenuItem.prototype.SlideMenu = function (state)
	{
		var element = document.getElementById(this.id);
		var self = this;
		
		clearTimeout(this.timer);
		
		// extra initialisatie wanneer de funtie SlideMenu op een onclick event wordt gehangen
		if (state == null)
		{
			// baseer state op sliderollout
			if (this.sliderollout == true)
			{
				state = false;
			}
			else
			{
				state = true;
			}
			
			// laat openstaande menuitems dichtklappen (items zijn open geklapt wanneer this.sliderollout true is)
			CloseTheOthers(this.id);
		}
		
		// nextsibling proberen te vinden nu de pagina helemaal geladen is
		if (this.slidenextsibling == null)
		{
			this.slidenextsibling = GetNextListItem(this.id);
		}
		
		switch (state)
		{
			// slide out
			case true:
			{
				this.sliderollout = true;
				
				element.className = 'active';
				
				var slideheight = (this.slideheight == 0) ? PercentageCalculator (this.slidecurrentheight, this.slidesubelement.offsetHeight, this.slidepercentage, "+"): this.slideheight;
				var slidewidth  = (this.slidewidth  == 0) ? PercentageCalculator (this.slidecurrentwidth,  this.slidesubelement.offsetWidth,  this.slidepercentage, "+"): this.slidewidth;
				
				this.slideposition = this.slidetop - Math.round(slideheight);
				this.slideposition = (isie) ? this.slideposition + 20 : this.slideposition; 
				
				this.slidesubelement.style.top =  this.slideposition + 'px';
				
				if (this.slidenextsibling)
				{
					var tmp = this.slidesubelement.offsetHeight - slideheight;
					this.slidenextsibling.style.marginTop = tmp + 'px';
				}
				
				this.slidesubelement.style.clip = "rect(" + Math.round(slideheight) + "px " + Math.round(slidewidth) + "px " + this.slidesubelement.offsetHeight + "px 0)";		// top, right, bottom, left
				
				// save the current size into the object
				this.slidecurrentheight = slideheight;
				this.slidecurrentwidth  = slidewidth;
				
				if (Math.round(slideheight) > 0)
				{
					this.timer = setTimeout (function(){self.SlideMenu(state)}, this.slidespeedout);
				}
				
				break;
			}
			
			// slide in
			case false:
			{
				// waiting cycle before the object will be collapse
				if (this.sliderollout)
				{
					this.sliderollout = false;
					this.timer = setTimeout (function(){self.SlideMenu(state)}, this.slidespeedbridge);
					
					break;	// end of the execute of this function
				}
				
				var slideheight = (this.slideheight == 0) ? PercentageCalculator (this.slidecurrentheight, this.slidesubelement.offsetHeight, this.slidepercentage, "-"): this.slideheight;
				var slidewidth  = (this.slidewidth  == 0) ? PercentageCalculator (this.slidecurrentwidth,  this.slidesubelement.offsetWidth,  this.slidepercentage, "-"): this.slidewidth;
				
				this.slideposition = this.slidetop - Math.round(slideheight);
				this.slideposition = (isie) ? this.slideposition + 20 : this.slideposition; 
				
				this.slidesubelement.style.top =  this.slideposition + 'px';
				
				// als dit menu item een next sibling heeft de rest van de menuitems ff doorduwen
				if (this.slidenextsibling)
				{
					var tmp = this.slidesubelement.offsetHeight - slideheight;
					this.slidenextsibling.style.marginTop = tmp + 'px';
				}
				
				this.slidesubelement.style.clip = "rect(" + Math.round(slideheight) + "px " + Math.round(slidewidth) + "px " + this.slidesubelement.offsetHeight + "px 0)";		// top, right, bottom, left
				
				// save the current size into the object
				this.slidecurrentheight = slideheight;
				this.slidecurrentwidth  = slidewidth;
				
				if (slideheight < this.slidesubelement.offsetHeight && ((this.slidesubelement.offsetHeight-slideheight) > 0.4))
				{
					this.timer = setTimeout (function(){self.SlideMenu(state)}, this.slidespeedin);
				}
				
				// behoort dit element tot een van de parents?
				
				var itemfound = false;
				
				for (var i = 0; i < activeparentnodes.length; i++)
				{
					if (activeparentnodes[i].id == this.id)
					{
						itemfound = true;
					}
				}
				if (!itemfound)
				{
					element.className = '';
				}
				
				break;
			}
		}
	}
	
	MenuItem.prototype.SwapMenu = function ()
	{
		var subelement = document.getElementById('sub' + this.id);
		
		if (subelement.style.display == 'none')
		{
			subelement.style.display = 'block';
		}
		else
		{
			subelement.style.display = 'none';
		}
	}

function GetNextListItem (id)
{
	for (var i = 0; i < menu.children.length; i++)
	{
		if (menu.children[i].id == id)
		{
			var index = i;
		}
	}
	
	if (menu.children[index + 1])
	{
		var object = document.getElementById(menu.children[index + 1].id);
		return object.parentNode;
	}
	else
	{	
		return false;
	}
}

function CloseTheOthers(id)
{
	for (var i = 0; i < menu.children.length; i++)
	{
		if (menu.children[i].sliderollout && menu.children[i].id != id)
		{
			menu.children[i].SlideMenu();
		}
	}
}
	
function Initialize (menuobject, activeitem)
{
	/// contains a pointer to the object itself
	var self = menuobject;
	
	/// contains a pointer to the htmlobject
	var element;
	
	element = (document.getElementById(menuobject.id)) ? document.getElementById(menuobject.id) : false;
		
	if (element)
	{
		element.onmouseover = function ()
		{
			if (menuobject.useopacityfade) { self.Fader(false); }
			//if (menuobject.useslidemenu) { self.SlideMenu(true); }
		}
		
		element.onmouseout = function ()
		{
			if (menuobject.useopacityfade) { self.Fader(true); }
			//if (menuobject.useslidemenu) { self.SlideMenu(false); }
		}
		element.onclick = function ()
		{			
			if (menuobject.useswapmenu) { self.SwapMenu(); }			
			if (menuobject.useslidemenu) { self.SlideMenu(); }
		}
		
		// initialisatie van alle parents en active node indien er gebruik is van SwapMenu (moet nog netjes recursief)
		if (menuobject.useswapmenu)
		{
			for (var i = 0; i < menuobject.children.length; i++)
			{
				if (menuobject.children[i].id == activeitem)
				{
					activeparentnodes[activeparentnodes.length] = menuobject;
					menuobject.SwapMenu();
					element.className = 'active';
				}
			}
		}
		
		// initialisatie van alle parents en active node indien er gebruik is van SlideMenu (moet nog netjes recursief)
		if (menuobject.useslidemenu)
		{
			for (var i = 0; i < menuobject.children.length; i++)
			{
				if (menuobject.children[i].id == activeitem)
				{
					activeparentnodes[activeparentnodes.length] = menuobject;
					menuobject.SlideMenu();
					element.className = 'active';
				}
			}
		}
		
		if (element.id == activeitem)
		{
			element.className = 'active';
		}
	}
	
	for (var i = 0; i < menuobject.children.length; i++)
	{
		Initialize (menuobject.children[i], activeitem);
	}
}

var navigatorloaded = true;