window.addEvent('domready', function() {

	//mouseover voor hoofditems
	$$('#header_wrapper ul li').each(function(el) {
		if (isMainItem(el)) {

			var submenu = el.getChildren('ul');
			el.addEvent('mouseover', function() {
				showSubMenu(submenu[0]);
			}).addEvent('mouseout', function() {
				hideSubMenu(submenu[0]);
			});
		}
	});

	/**
	 * submenu positioneren boven zijn parent
	 *
	 * @param <object> el		ul element waarin zich subitems bevinden
	 */
	function showSubMenu(el)
	{
		if (!el)
			return;

		//positie van hoofitem bepalen
		var parentPosition = el.getParent().getPosition($('header_wrapper'));

		//breedte van hoofditem bepalen
		var parentSize = el.getParent().getSize();

		//formaat van submenu bepalen
		var subMenuSize = el.getSize();

		//horizontale positie van submenu bepalen
		var targetX = 0;

		if (parentPosition.x + subMenuSize.x > 994)
			targetX = 994 - subMenuSize.x - 1; //zorgen dat submenu binnen content blijft
		else if (parentPosition.x - ((subMenuSize.x - parentSize.x) / 2) < 0)
			targetX = 1;
		else
			targetX = parentPosition.x - ((subMenuSize.x - parentSize.x) / 2);

		//verticale positie van submenu bepalen
		var targetY = 126 - subMenuSize.y;

		//positie instellen
		el.setStyles({
			'left': targetX + 'px',
			'top': targetY + 'px'
		});
	}

	/**
	 * submenu verbergen
	 *
	 * @param <object> el		ul element waarin zich subitems bevinden
	 */
	function hideSubMenu(el)
	{
		if (!el)
			return;

		//var hideFx = new Fx.Tween(el);
		//hideFx.start('opacity', 1, 0);

		el.setStyle('left', '-2000px');
		
	}

	/**
	 * controleren of een menu item van niveau 1 is (hoofdmenu)
	 *
	 * @param <object> el		a element van menu-item
	 */
	function isMainItem(el)
	{
		if (el.getParent().getParent().id == 'header_wrapper')
			return true;

		return false;
	}

});