$(document).ready(function() {
	/* ACHTERGROND AFBEELDING */
	var	boschwidth = $(window).width();
	if (boschwidth > 1024){
		var	boschheight =  Math.round(boschwidth * 0.75) + 1;
		if (boschheight < $(window).height()){
			boschheight = $(window).height();
			boschwidth = Math.round($(window).height() * 1.34);
		}
		$("#bgimg").css("height",boschheight);
		$("#bgimg").css("width",boschwidth);

		//$("#bgimg").height(boschwidth);
		//$("#bgimg").width(boschheight);
		
	}
});
$(function() {
	/*
	 * FRONTPAGE SLIDER
	 */
	$("#rotate").tabs().addClass('ui-tabs-vertical ui-helper-clearfix');
	$('#rotate > ul').tabs({ fx: { opacity: 'toggle' } }).tabs('rotate', 5000).addClass('ui-tabs-vertical ui-helper-clearfix');
	//$('#rotate > ul').tabs({ fx: { opacity: 'toggle' } }).addClass('ui-tabs-vertical ui-helper-clearfix');	// initialiseeer de tabs.
	//$('#rotate > ul').tabs('select', 1).tabs('select', 0).tabs({ fx: { opacity: 'toggle' } }).tabs('rotate', 5000).addClass('ui-tabs-vertical ui-helper-clearfix');
	
	/*
	 * TOPNAV LANGUAGE MENU 
	 */
	$("ul.subnav").parent().append("<span><\/span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subnav*)
	$("ul.topnav li").hover(function() { //When trigger is clicked...
			$(this).find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click
		}, function(){	//On Hover Out
			$(this).find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up			
	});
	
	/*
	// trigge with span
	$("ul.topnav li span").hover(function() { //When trigger is clicked...

			//Following events are applied to the subnav itself (moving subnav up and down)
			$(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click

			$(this).parent().hover(function() {
			}, function(){
				$(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up
			});

			//Following events are applied to the trigger (Hover events for the trigger)		
			$(this).addClass("subhover"); //On hover over, add class "subhover"
		}, function(){	//On Hover Out
			$(this).removeClass("subhover"); //On hover out, remove class "subhover"
	});
	*/	
	/*
	 * TRANSPARENT TOP NAV
	 */
	// LI>LI MOUSEOVER past de height aan van de sub-link-bar bij aanwezigheid van een uitbrekend subsubitem
	$('#nav li li').bind('mouseenter', function (e) {
		// bereken het verschil in listitems
		var mylistsize = $("li", this).size();		// lijst groote van subsublist
		var mylistindex = $(">li", $(this).parent()).index(this);	// index nr van huidige hover li (index begint bij 0)
		var myparentsize = $(">li", $(this).parent()).size();	// lijst grootte van parent
		var mytotalheight = mylistsize + mylistindex;			// totale index hoogte is index + onderliggende li's
		var mydifference = mytotalheight - myparentsize;		// verschil = parent grootte - de totale grootte van de hoverende li.
		var newheight = "";
		if (mydifference > 0){
			// subsub item breekt uit de lijst (is langer dan de totaallijst)
			newheight = $("#sub-link-bar").height() + (20*mydifference);
			$("#sub-link-bar").height(newheight)
		}
		//alert(mylistsize);
		})
		.bind('mouseleave', function (e) {
			// hetzelfde verhaal als de mouseover, alleen deze keer halen we de hoogte er weer af.
			// bereken het verschil in listitems
			var mylistsize = $("li", this).size();
			var mylistindex = $(">li", $(this).parent()).index(this);
			var myparentsize = $(">li", $(this).parent()).size();
			var mytotalheight = mylistsize + mylistindex;
			var mydifference = mytotalheight - myparentsize;
			var newheight = "";
			if (mydifference > 0){
				newheight = $("#sub-link-bar").height() - (20*mydifference);
				$("#sub-link-bar").height(newheight)
		}
	});
	
	/* BALK ONDERIN */
	var containerheight = $(window).height() - 114 - 216;	// document minus topmargin and bottom
	if (containerheight > $("#container-inner").height()){
		
		var newcontainerheight = $("#container-inner").height() + (containerheight - $("#container-inner").height());
		
		//alert("containerheight" + containerheight);
		//alert("divhoogte" + $("#container-inner").height());
		//alert("nieuwe hoogte" + newcontainerheight);
		
		$("#container-inner").height(containerheight);
	}
	
	/* Bij een windows aanpassing, balk en afbeelding bijstellen */
	$(window).resize(function() {
		var	boschwidth = $(window).width();
		if (boschwidth > 1024){
			var	boschheight =  Math.round(boschwidth * 0.75) + 1;
			if (boschheight < $(window).height()){
				boschheight = $(window).height();
				boschwidth = Math.round($(window).height() * 1.34);
			}
			$("#bgimg").css("height",boschheight);
			$("#bgimg").css("width",boschwidth);

			//$("#bgimg").height(boschwidth);
			//$("#bgimg").width(boschheight);
			
		}
		// balk bijstellen
		var containerheight = $(window).height() - 114 - 216;	// document minus topmargin and bottom
		if (containerheight > $("#container-inner").height()){
			
			var newcontainerheight = $("#container-inner").height() + (containerheight - $("#container-inner").height());
			//alert("containerheight" + containerheight);
			//alert("divhoogte" + $("#container-inner").height());
			//alert("nieuwe hoogte" + newcontainerheight);
			$("#container-inner").height(containerheight);
			
		}
	});
	

	// HOVERINTENT http://cherne.net/brian/resources/jquery.hoverIntent.html
	// UL LEAVE met hoverintent (is gelijk aan hover, maar dan met vertraging), zorgt voor vertraging bij een mouseleave. Voorkomt problemen met het snel er overheen schuiven.
	// past de hoogte aan van de achtergrond div
	$("#nav>li").hoverIntent( 
		function() {
			// mouserover
			$("ul", this).hide(); // zorgt ervoor dat jquery het item de 1e keer goed kan benaderen.
			// mouseover state
			var listsize = $("li", this).size();
			var sublistsize = $("li>ul>li", this).size();
			var addsize = "";				
			/*
				// vooralsnog niet meer nodig ivm extra mouseover functie
				// script dat de children van de gehoverde li berekend.
				$('ul>li>ul', this).each(function(i) {
					// Find this list's parent list item.
					var mylistsize = $("li", this).size();
					//var $parent_li = $(this).parent();
					var $li = $(this).parent();
					var myIndex = $li.parent().children().index( $li );
					
					//var qindex = $('li').index($(this).parent());

					//var qindex = $('li').index($parent_li);
					//alert(myIndex);
				});
			*/
			
			listsize = ((listsize-sublistsize) * 20);
			if (listsize > 0){
				listsize += 10;
			}
			var mylist = this;
			
			//$("#sub-link-bar").css({height: listsize});	// zet de height direct naar een vaste waarde
			$("#sub-link-bar").stop()	// stop eventuele animatie zodat deze niet eerst naar height 0 gaat en daarna weer groot wordt.
			// animeer de height van x naar de vaste waarde
			$("#sub-link-bar").animate({height: listsize}, 50, function() {
				// Animation complete.
				$("ul", mylist).slideDown('fast');
			});
			
		},
		function() {
			// mouseout state
			$("ul", this).hide();	// verberg het menu
			// animeer de balk terug.
			$("#sub-link-bar").animate({height: '0'}, 500, function() {
				// Animation complete.
				$("ul", this).hide();
			});
			
		}
	);
			

});