//********************************************************************
//			code om een plugin vanuit javascript te laden
//			kan een element afgeronde corners geven (niet in IE, d'uh)
//********************************************************************
function IncludeJavaScript(jsFile)
{
document.write('<script type="text/javascript" src="http://gymhaacht.be/scripts/'
+ jsFile + '"></script>'); 
}
//http://jquery.malsup.com/corner/			//description
IncludeJavaScript('jquery.corner.js');		//de plugin

//********************************************************
//			testen browserversie 
//********************************************************
//http://msdn.microsoft.com/en-us/library/ms537509(VS.85).aspx
function getInternetExplorerVersion()
// Returns the version of Internet Explorer or a -1
// (indicating the use of another browser).
{
  var rv = -1; // Return value assumes failure.
  if (navigator.appName == 'Microsoft Internet Explorer')
  {
    var ua = navigator.userAgent;
    var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
    if (re.exec(ua) != null)
      rv = parseFloat( RegExp.$1 );
  }
  return rv;
}

//********************************************************
//			jquery code voor het menu
//********************************************************
var previousHoveredMainElement=null;
var activeMainElement=null;
var navJumpHeight = "0.25em";



$(document).ready(function() 
{
	
	
	
	
	//IE6 moet witte achtergrond want die loopt door de pagina ...
	version=getInternetExplorerVersion();
	if (version!=-1) //test for MSIE x.x;
	{
		if ( version >= 6.0 && version < 7.0 ) 
			$("body").css({"background-color":"#AABFE2"});
	}
	
	if(browser=="Microsoft Internet Explorer")						//als het IE is, zet de ganse pagina wat hoger (anders lege ruimte tussen menu en rest vd pagina)
		$(".contentLayout").css({"top":"-70px"});

	setActive();													//de pagina die nu actief is, dat menu-item speciaal kleuren
	$("#maintab li span").addClass("hidePijltje");					//alle pijltjes verbergen
	
	//Hover over event on list item
	$("#maintab li").hover(function() 								//als een hoofd element wordt gehoverd
	{ 
		$(this).css({"height":"10px"});
		
		//verberg het voorgaande 
		hideSubNavigation($(this));
	
		showSubNavigation($(this));									//laat het sub menu zien + vind het huidige geselecteerde 
		
		//animate current main tab
		setLayout($(this));
		
	} , function()		//als de muis weggaat van de , wanneer het item niet meer gehovered is
		{ 
			deleteLayout($(this));
		});

});
//**********************************************************************************
//		 submenu zien/verbergen. Proberen om dat mooi onder het hoofd item te krijgen 
//		IE moet natuurlijk weer moeilijk doen, daarom testen.
//**********************************************************************************
function showSubNavigation(mainNavigationElement)
{	
	if(mainNavigationElement.find("span").hasClass('hidePijltje'))
		mainNavigationElement.find("span").removeClass("hidePijltje");	
	mainNavigationElement.find("span").addClass("showPijltje");					//laat een pijltje naast het hoofdNavigatieItem wanneer het bijhorende subNavigatieItem wordt getoond 

	previousHoveredMainElement  =mainNavigationElement.attr("rel");				//vindt het huidige geselecteerde	
	
	//code om de positie te berekenen waar het subNavigatieMenu moet staan
	myPosition=0;
	var position =mainNavigationElement.position();	
	var LargePartOfWidthOfSubNavigation=($("#"+previousHoveredMainElement).width())/3;
	var SmallPartOfWidthOfSubNavigation=($("#"+previousHoveredMainElement).width())/5;
	if(position!=null)														//prevent errors if mainNavigationElement is not found
	{
		if(position.left-LargePartOfWidthOfSubNavigation>0)					//zo staat een item mooi eronder				
			myPosition=position.left-LargePartOfWidthOfSubNavigation;
		else if(position.left-SmallPartOfWidthOfSubNavigation>0)			//item dat net niet helemaal links staat, maar je wilt toch beetje verdeeldheid
			myPosition=position.left-SmallPartOfWidthOfSubNavigation;
		else															//als het hoofdmenu helemaal links staat
			myPosition=position.left;									//moet je er niets bij aftrekken want dan staat het teveel naar links
	}
	if(browser=="Microsoft Internet Explorer")
    {
		$("#"+previousHoveredMainElement).css('display', 'inline-block')	////iexplorer kan niet overweg met display:block, display:inline-block lukt wel
		$("#"+previousHoveredMainElement).css({"margin-left":myPosition});
	}
	else
	{
		$("#"+previousHoveredMainElement).offset({  left: myPosition })    //change the location to the subNavigation to something below the main navigation
		$("#"+previousHoveredMainElement).show();							//laat submenu van het geselecteerde zien | fadeIn("fast");
	}
							
	
}
function hideSubNavigation(mainNavigationElement)
{
	//doet het pijltje weg dat stond naast het hoofdNavigatieItem wanneer het bijhorende subNavigatieItem werd getoond 
	$('#maintab li[rel="'+previousHoveredMainElement+'"]').find("span").removeClass("showPijltje");	//pijltje van vorig element wegdoen
	$('#maintab li[rel="'+previousHoveredMainElement+'"]').find("span").addClass("hidePijltje");
		
	var position =mainNavigationElement.position();
	var myPosition=position.left;
	if(browser!="Microsoft Internet Explorer")						//als het geen IE is
		$("#"+previousHoveredMainElement).offset({  left: -myPosition }) 	//het submenu mooi onder het hoofdmenu laten beginnen.
	$("#"+previousHoveredMainElement).css({ left: ''});			//reset the position of the subnavigation the the original
	
	$("#"+previousHoveredMainElement).hide();	
}

//*******************************************************************************
//			Via jquery de layout van een main menu-item bepalen 
//*******************************************************************************
function setLayout(mainMenuItem)
{
	if(!mainMenuItem.hasClass('active'))
	{
		mainMenuItem.css({ 'font-size':'+=1px'});
		//mainMenuItem.css('background', '#ebebeb');
		//mainMenuItem.animate({ background-Color: "#ebebeb" }, 500);		
		//if(browser!="Microsoft Internet Explorer")	
		//	mainMenuItem.corner("round 20px");
	}
	//bounce!
	//mainMenuItem.css('position', 'relative')						//fails in opera + unnecessary			
	mainMenuItem.animate({ top : "-="+navJumpHeight },500);			//$(this).animate({ width:'+=10px'},500);
 }
 function deleteLayout(mainMenuItem)
{
	if(!mainMenuItem.hasClass('active'))			//het actieve item (waarop de pagina staat), niet de default layout geven
		mainMenuItem.css({ 'background': 'none','font-size':'-=1px'});	//als muis er niet op staat, default layout geven

				
	//bounce back zie functie	setLayout()
	//mainMenuItem.css('position', 'relative')			//fails in opera	+ unnecessary				
	mainMenuItem.animate({ top : "+="+navJumpHeight },750);	

}
 function setLayoutActive(mainMenuItem)
{
	mainMenuItem.addClass('active');						//needed to test
	
	showSubNavigation(mainMenuItem);
	mainMenuItem.css({ 'background': '#ebebeb'});			// the same background as a page
	//mainMenuItem.css('font-size','+=1px');				// larger font	: geeft ERROR (die in IE alles blokkeert)
	mainMenuItem.css({ 'padding':'5.5px'});					// ~grootte van de achtergrond kleur rondom de tekst
	mainMenuItem.css({ 'padding-bottom':'8px'});			// als je hovered, mainNavigationMenuItem komt omhoog, om verbinding met page niet te verbreken.
	mainMenuItem.css({ 'color':'black'});					// het pijltje zwart kleuren
	mainMenuItem.find("a").css({ 'color':'black'});			// de tekst in de link vh menu ook zwart
	if(browser!="Microsoft Internet Explorer")	
	{
		try														//als hij geen mainMenuItem vindt ...
		{
			mainMenuItem.corner("round top 20px");				// ronde hoeken bovenaan (samen met achtergrond kleur, goed effect)
		}
		catch(err)
		{
			//alert(""+err);
		}
	}
 }

//*******************************************************************************
//			het active (ipv via php bijhouden wat de actieve pagina is) setten 
//*******************************************************************************
function setActive()
{
   var path = location.pathname;  //geen last van get parameters, zit er niet in . Probleem bij index.  =>  /
   var url=location.href;
   
   //	http://www.gymhaacht.be/ heeft geen index.php, dus zal hij niet vinden
   if(url=="http://www.gymhaacht.be/" || url=="http://gymhaacht.be/")
		path="/index.php";
	
		
   //alert("path :"+path+"\n location "+location.pathname);
   if ( path )
   {
	
		//alert("path "+path +"\n text"+$('#maintab a[href$="' + path + '"]').text());
		if($('#maintab a[href$="' + path + '"]').length )								//als link in hoofdmenu staat, item actief maken
			setLayoutActive($('#maintab a[href*="' + path + '"]').parent());			//^= is starts with       , $= is ends with       *= is contains
		
		else																			//als het in een submenu zit, ook het hoofdmenu actief maken
		{		
			var mainElementRelName=$('.submenustyle a[href*="' + path + '"]').parent().attr('id');		//the id of the div from the submenustyle
			//je klikt op een link met een path vb historiek.php, dat ook in het submenu zit.
			if(mainElementRelName!=null)	
			{
				//var mainElementParent=$('#maintab li[rel="'+mainElementRelName+'"]').text();				//debuger chrome werkt enkel als je variabelen met var declareert
				//var url =$('#maintab li[rel*="'+mainElementRelName+'"] a').attr('href');
				setLayoutActive($('#maintab li[rel*="'+mainElementRelName+'"]'));
			}
			//gebruiker heeft op link geklikt, maar hij is niet te vinden in het submenu: de blogs hebben dit probleem
			// vb    blogs/agh/about/
			//aannemen dat dit enkel voorkomt bij de blogs ... tijd zal wel uitwijzen of dit juist is.
			else
			{
				setLayoutActive($('#maintab li[rel="groepen"]'));
			}
		}
		
   }

 }


//te lui om dat overal te verwijderen, lege dummy functie, zodat er geen errors zijn
function initalizetab(tabid)																//tabid= maintab
{
}



//********************************************************
//			oude, niet gebruikte code
//********************************************************
/*
var mastertabvar=new Object()
mastertabvar.baseopacity=0
mastertabvar.browserdetect=""

function showsubmenu(masterid, id){
if (typeof highlighting!="undefined")
clearInterval(highlighting)
submenuobject=document.getElementById(id)
mastertabvar.browserdetect=submenuobject.filters? "ie" : typeof submenuobject.style.MozOpacity=="string"? "mozilla" : ""
hidesubmenus(mastertabvar[masterid])
//iexplorer kan niet overweg met display:block, display:inline-block lukt wel
submenuobject.style.display="inline-block"
//explorer toont menu niet indien de volgende 2 regels niet in commentaar zijn 
//instantset(mastertabvar.baseopacity)
//highlighting=setInterval("gradualfade(submenuobject)",50)
}

function hidesubmenus(submenuarray){
for (var i=0; i<submenuarray.length; i++)
document.getElementById(submenuarray[i]).style.display="none"
}

function instantset(degree){
if (mastertabvar.browserdetect=="mozilla")
submenuobject.style.MozOpacity=degree/100
else if (mastertabvar.browserdetect=="ie")
submenuobject.filters.alpha.opacity=degree
}


function gradualfade(cur2){
if (mastertabvar.browserdetect=="mozilla" && cur2.style.MozOpacity<1)
cur2.style.MozOpacity=Math.min(parseFloat(cur2.style.MozOpacity)+0.1, 0.99)
else if (mastertabvar.browserdetect=="ie" && cur2.filters.alpha.opacity<100)
cur2.filters.alpha.opacity+=10
else if (typeof highlighting!="undefined") //fading animation over
clearInterval(highlighting)
}

//PROBLEEM: bij laden van eender welke pagina komt submenu van <li> met class="selected"
//OPLS? : een onclick bij elke maintab link zetten (en submenustyle?) die de class selected geven en dat bij de rest verwijderen

function initalizetab(tabid)																//tabid= maintab
{
	mastertabvar[tabid]=new Array()
	var menuitems=document.getElementById(tabid).getElementsByTagName("li")					//je slaagt alle hoofdmenu dingen op
	for (var i=0; i<menuitems.length; i++)
	{
		if (menuitems[i].getAttribute("rel"))												//alle <li> die een rel attribuut hebben (rel = beschrijving)
		{
			menuitems[i].setAttribute("rev", tabid) 										//associate this submenu with main tab
			mastertabvar[tabid][mastertabvar[tabid].length]=menuitems[i].getAttribute("rel")//store ids of submenus of tab menu
			if (menuitems[i].className=="selected")											//the contents of a particular submenu displayed automatically when the page loads by adding a CSS class next to the rel attribute:
				showsubmenu(tabid, menuitems[i].getAttribute("rel"))
			menuitems[i].getElementsByTagName("a")[0].onmouseover=function()
			{
			showsubmenu(this.parentNode.getAttribute("rev"), this.parentNode.getAttribute("rel"))
			}	
		}
	}
}
*/