var VGOKEUR = VGOKEUR || {
	
	/**
	 * Initialize all needed function on body onload
	 */
	init: function() {
		this.initHeader();
		this.enableMenu();
		this.addSearchFormEventHandlers();
	},
	
	/**
	 * Sets the first header and belonging texts
	 */
	initHeader: function() {
		if (typeof headerArr == "object" && typeof headerArr[0] == "object") {
			this.setHeader(0);
			
			var total = headerArr.length;
			if (total > 1) {
				for (var i=1; i<=total; i++) {
					var imgsrc = (i == 1) ? '/images/icon_circle_active.gif' : '/images/icon_circle_inactive.gif'
					$('<img>').attr( {counter:i,src:imgsrc} ).appendTo('#headerbuttons').click(function() {
						VGOKEUR.setHeader($(this).attr('counter')-1);
						
						//set all buttons disabled, except the clicked one
						$('#headerbuttons img').attr('src','/images/icon_circle_inactive.gif');
						$(this).attr('src','/images/icon_circle_active.gif');
						
						//stop and reactive the interval again
						if ($('body').attr('className') == 'vp') {
							window.clearInterval(VGOKEUR.headerInterval);
							VGOKEUR.headerInterval = window.setInterval(function(){ VGOKEUR.setHeader(VGOKEUR.currentHeader + 1); }, 11000);
						}
					});
				}
				if ($('body').attr('className') == 'vp')
					this.headerInterval = window.setInterval(function(){ VGOKEUR.setHeader(VGOKEUR.currentHeader + 1); }, 7000);
			}
		}
	},
	
	/**
	 * Make the selected header visible
	 * @param	i	key of the headerArr in which all the headerinformation is stored.
	 */
	setHeader: function(i) {
		if (typeof headerArr == "object") {
			if (i > (headerArr.length-1)) i = 0;
			
			if ($('#header').css('display') !== 'none') {
				$('#header').css('background','url('+headerArr[i][0]+')');
				$('#header').hide();
				$('#header').fadeIn();
				$('#header strong').html(headerArr[i][1]);
				$('#header p').html(headerArr[i][2]);
				
				if (headerArr[i][3])
					$('#header a').attr('href',headerArr[i][3]).css('display','block');
				else
					$('#header a').css('display','none');
			}
			this.currentHeader = i;
			
			//set all buttons disabled, except the current one
			$('#headerbuttons img').attr('src','/images/icon_circle_inactive.gif');
			$('#headerbuttons img[counter='+ (i+1) +']').attr('src','/images/icon_circle_active.gif');
		}
	},
	
	/**
	 * Enables the mouseover and mouseout event to display the submenu. Also changes the backgroundcolor of a submenu when hovering over it.
	 * several timeouts are used to prevent 'flickering' in IE while hovering the submenu.
	 */
	enableMenu: function() {
		$('#nav').mouseover(function() {
			$('.subnavcontainer').show();
		});
		$('#nav').mouseout(function() {
			$('.subnavcontainer').hide();
		});
		$('.subnavcontainer').mouseover(function() {
			window.clearTimeout(this.toMenuID);
			$('.subnavcontainer').show();
		});
		$('.subnavcontainer').mouseout(function() {
			this.toMenuID = window.setTimeout(function(){ $('.subnavcontainer').hide();}, 50);
		});
		
		$('.subnav ul').each(function(i){ 
			$(this).mouseover(function() {
				window.clearTimeout(this.toSubmenuID);
				$(this).addClass('active');
				$('.subnavcontainer .bar').addClass($(this).attr('id'));
			});
			$(this).mouseout(function() {
				$('.subnavcontainer .bar').removeClass($(this).attr('id'));
				var el = $(this);
				this.toSubmenuID = window.setTimeout(function(){ $(el).removeClass('active')}, 50);
			});
		}); 
	},
	
	/**
	 * Add some event handlers to formfields to submit the form, and enable the AutoComplete functionality
	 */
	addSearchFormEventHandlers: function() {
		$('.bedrijf form select').change(function() {
			VGOKEUR.submitSearchForm($(this).attr('name'));
		});
		$('.bedrijf form a').click(function() {
			VGOKEUR.submitSearchForm($(this).attr('name'));
		});
		if ($("input.autocomplete").autocomplete) {
			$("input.autocomplete").change(function() {
				$('.bedrijf #action').val('trefwoord');
			});
			$("input.autocomplete").autocomplete({
				source: autocompleteArr,
				select: function(event, ui) { 
					$("input.autocomplete").val(ui.item.value);
					VGOKEUR.submitSearchForm('trefwoord');
				}
			});
		}
	},
	
	/**
	 * Submits the searchform and (if given) sets the action or the bedrijfPk
	 * @param string action: the action which should be executed
	 * @param string bedrijfPk: PK of the selected company
	 */
	submitSearchForm: function(action, bedrijfPk) {
		if (action)
			$('.bedrijf #action').val(action);
		if (bedrijfPk)
			$('.bedrijf #bedrijf').val(bedrijfPk);
		$('.bedrijf form').submit();
	},
	
	/**
	 * Get the innerHTML of a given DOM elements and puts it in a clean printing template
	 * @param string id: the ID of the DOM element which innerHTML should be printed
	 * @param object btn: the hyperlink which called this method. If we are in the frontpage template, use this object to determine which column we should print.
	 */
	printPage: function (id, btn) {
		if ($('body').attr('className') == 'vv')
			var el = document.getElementById(id);
		else
			var el = $(btn).parents('td').get(0);
		
		if (!el)
			return false;
		
		//disable links to in printversion
		var content = el.innerHTML;
		content = content.replace(/href/gi,"hrefdisabled");
		content = content.replace(/onclick/gi,"onclickdisabled");
		content = content.replace(/<object/gi,"<objectdisabled");

		//open popup and call print dialog
		window.print = '<img src="/images/vgo-keur_logo.png"><br><br><table><tr><td>'+content+'</td></tr></table>';
		var w =  window.open('/print/');
	}
	
}