$(document).ready(function() {
	activateButton();
	$("#buttons").bind("mouseleave",function(){ resetButtons('highlight'); });
	$('#vmbo').hover( function() { highlightButtons('#vmbo #boermarkeweg-emmen #vakcollege-emmen #borger #klazienaveen #oosterhesselen'); });
	$('#havo').hover( function() { highlightButtons('#havo #boermarkeweg-emmen #oosterstraat-emmen #borger #klazienaveen #oosterhesselen'); });
	$('#vwo').hover( function() { highlightButtons('#vwo #oosterstraat-emmen #borger #klazienaveen'); });
	$('#boermarkeweg-emmen').hover( function() { highlightButtons('#boermarkeweg-emmen #vmbo #havo'); });
	$('#oosterstraat-emmen').hover( function() { highlightButtons('#oosterstraat-emmen #havo #vwo'); });
	$('#vakcollege-emmen').hover( function() { highlightButtons('#vakcollege-emmen #vmbo'); });
	$('#borger').hover( function() { highlightButtons('#borger #vmbo #havo #vwo'); });
	$('#klazienaveen').hover( function() { highlightButtons('#klazienaveen #vmbo #havo #vwo'); });
	$('#oosterhesselen').hover( function() { highlightButtons('#oosterhesselen #vmbo #havo'); });
	$('#index').hover( function() { highlightButtons('#index'); });
	
	function resetButtons(sTag) {
		var arrayOfButtons = document.getElementsByTagName('a');

		for (x in arrayOfButtons) {
			$(arrayOfButtons[x]).removeClass(sTag);
		}
	}
	
	function highlightButtons(sButtons) {
		resetButtons('highlight');
				
		var arrayOfButtons = sButtons.split(' ');
	
		for (x in arrayOfButtons) {
			$(arrayOfButtons[x]).addClass('highlight');
		}
	}
	
	function activateButton() {
		var url = window.location.pathname;
		var filename = url.substring(url.lastIndexOf('/')+1).toLowerCase();
		var activeButton = "#" + filename.replace(".php", "");
		$(activeButton).addClass('current');
	}
	
	var video = document.getElementById('videoplayer');
	video.addEventListener('click',function(){
		video.play();
	},false);
});