var minHeight = 582;	// Minimale hoogte van de website
var menuItems = 5;		// Het aantal hoofdmenuitems
var submenuItems = 5;	// Het aantal submenuitems

var oldheight = 0;  // Oude hoogte van de viewport, nodig om resize event goed te laten verlopen
var aImg = ['images/main_top.jpg', 'images/main_left.jpg', 'images/main_right.jpg', 'images/main_top_1.gif', 'images/main_top_2.gif'];
var preloader = null;

//window.addEvent('domready', init);
window.onload = init;
window.onresize = resizeScrollpane;
var initFunctions = new Array();

var stockzoeken = function() {
	if ($('stockzoeken_stock').getStyle('color') == '#d2dbee') {
		$('stockzoeken_stock').tween('color', '#5C7691');
		$('stockzoeken_zoeken').tween('color', '#D2DBEE');
	}
	else {
		$('stockzoeken_stock').tween('color', '#D2DBEE');
		$('stockzoeken_zoeken').tween('color', '#5C7691');
	}
};

function init() {
	externalLinks();
	resizeScrollpane();
	initMenu();
	
	$$('p.__button').each( function(item, index) {
		item.set('class', 'button_normal');
		item.setStyle('cursor', 'pointer');
		item.addEvents({
			'mouseenter': function() {
				item.set('class', 'button_active');
			},
			'mouseleave': function() {
				item.set('class', 'button_normal');
			}
		});
		item.getElement('a').set('class', 'button_link');
	});
	
	initInputs();
	
	for( var i=0; i<initFunctions.length; i++) {
		initFunctions[i]();
	}
	
	stockzoeken.periodical(1000);
}

function onPreload(aImages, nImages)
{
	if ( nImages = aImg.length )
	{
		return;
	}
}
 
// Fade functie
var swapArray = new Array();
var swapFade = function(index) {
	if( $defined(swapArray[index]) ) {
		var element = swapArray[index];
		element.set('tween',{
			duration: 1500,
			property: 'opacity'
		});
		element.tween(1,0);
		swapArray[index] = element.getNext('div');
		if( !$defined(swapArray[index]) )
			swapArray[index] = element.getParent().getFirst('div');
		swapArray[index].set('tween',{
			duration: 1000,
			property: 'opacity'
		});
		swapArray[index].tween(0,1);
	}
}

var viewportwidth;
var viewportheight;
function resizeScrollpane(isResized) {
	var leftDiv = $('div_left');
	var rightDiv = $('div_right');
	var containerDiv = $('div_container');
	var fullheight = 0;

	// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
	if (typeof window.innerWidth != 'undefined') {
		viewportwidth = window.innerWidth,
		viewportheight = window.innerHeight
	}

	// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
	else if (typeof document.documentElement != 'undefined'
	&& typeof document.documentElement.clientWidth !=
	'undefined' && document.documentElement.clientWidth != 0) {
		viewportwidth = document.documentElement.clientWidth,
		viewportheight = document.documentElement.clientHeight
	}

	// older versions of IE
	else {
		viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
		viewportheight = document.getElementsByTagName('body')[0].clientHeight
	}

	if ($defined(containerDiv)) {
		leftDiv.setStyle('height', containerDiv.offsetHeight + 'px');
		rightDiv.setStyle('height', containerDiv.offsetHeight + 'px');
	}
}

/* Algoritme om de hoogte van de gehele site dynamisch aan te passen aan veranderende
 * blokhoogtes. Dit wordt mogelijk gemaakt door de breedtes van de blokken te
 * vergelijken met de totale contentbreedte, en vervolgens de hoogste van die blokken
 * te pakken. Als het totaal van deze hoogtes de huidige websitehoogte overschrijdt,
 * moet er dus een hoogteaanpassing plaatsvinden.
 * Het lastige is dat hierbij ook rekening moet worden gehouden met eventuele padding,
 * margin en borders, waardoor deze ook in de berekening moeten worden meegenomen.
 * Als laatste een resizeMore() aanroep om het linker- en rechterblok ook mee te schalen.
 */
function resizeBlokhoogte() {
	var totaalbreedte=0, totaalhoogte=0, breedte=0, hoogte=0;
	var margin, border;
	var contentbreedte = $('div_scrollpane').getStyle('width').toInt();
	var contentpadding = new Array($('div_scrollpane').getStyle('padding-top').toInt(), $('div_scrollpane').getStyle('padding-right').toInt(), $('div_scrollpane').getStyle('padding-bottom').toInt(), $('div_scrollpane').getStyle('padding-left').toInt());
	var hoogteArray = new Array(), marginArray = new Array(), borderArray = new Array();
	
	$$('.blok').each( function(item, index) {
		breedte = item.offsetWidth;
		hoogte = item.offsetHeight;
		
		margin = new Array(item.getStyle('margin-top').toInt(), item.getStyle('margin-right').toInt(), item.getStyle('margin-bottom').toInt(), item.getStyle('margin-left').toInt());
		border = new Array(item.getStyle('border-top').toInt(), item.getStyle('border-right').toInt(), item.getStyle('border-bottom').toInt(), item.getStyle('border-left').toInt());
		
		totaalbreedte += breedte + margin[1] + margin[3];
		if( totaalbreedte > contentbreedte && hoogteArray.length != 0 ) {
			if( hoogteArray.length > 1 )
				hoogteArray.sort(function(a,b){return b - a});
			totaalhoogte += hoogteArray[0];
			totaalbreedte = 0;
			hoogteArray.empty();
		}
		hoogteArray.push(hoogte + margin[0] + margin[2]);
	});
	
	if( hoogteArray.length != 0 ) {
		if( hoogteArray.length > 1 )
			hoogteArray.sort(function(a,b){return b - a});
		totaalhoogte += hoogteArray[0];
		totaalbreedte = 0;
		hoogteArray.empty();
	}
	$('div_scrollpane').setStyle('height', totaalhoogte + 'px');
	resizeScrollpane(true);
}

// Input velden gevoelig maken voor de enter knop
function initInputs() {
	$$('input').each( function(item) {
		if(item.get('type') == 'text') {
			item.addEvent('keydown', function(event) {
				var imgid = item.get('id').replace(/input_/, 'img_');
				event = new Event(event);
				if( event.key == 'enter' )
					$(imgid).fireEvent('click');
				else if( event.key == 'esc' ) {
					this.setStyle('display', 'none');
					$(imgid).setStyle('display', 'none');
					if( $defined(this.getParent().getElement('span')) )
						this.getParent().getElement('span').setStyle('display', 'block');
					else if( $defined(this.getParent().getElement('a')) )
						this.getParent().getElement('a').setStyle('display', 'block');
				}
			});
		}
	});
}

/* Bepaalt de totale verticale hoogte van een element, inclusief padding, margin en border
 * 
 * Indien noHeight true is, wordt de hoogte van een element niet meegenomen in de berekening
 */
function getVerticalOffset(element, noHeight) {
	var result = 0;
	if (!noHeight) {
		result += element.offsetHeight;
	}
	result += (element.getStyle('padding-top').toInt() + element.getStyle('padding-bottom').toInt());
	result += (element.getStyle('margin-top').toInt() + element.getStyle('margin-bottom').toInt());
	result += (element.getStyle('border-top').toInt() + element.getStyle('border-bottom').toInt());
	return result;
}

function muteVideo(vidid, linkid) {
	ytplayers[vidid].changeMute();
	if( ytplayers[vidid].player.isMuted() )
		$(linkid).getElement('img').set('src', 'images/icons/soundoff.png');
	else
		$(linkid).getElement('img').set('src', 'images/icons/sound.png');
}

// Menu
function initMenu() {
	var hoofdmenuLists = $$('.hoofdmenu_item');
	var hoofdmenuAnchors = new Array();
	var submenus = $$('.submenu');
	var submenuLists = new Array();
	var submenuAnchors = new Array();
	var home = $('a_home');
	home.addEvents({
		mouseenter: function(){
			this.morph('a.homeprint_hover');
		},
		mouseleave: function(){
			this.morph('a.homeprint_default');
		}
	});
	var print = $('a_print');
	print.addEvents({
		mouseenter: function(){
			this.morph('a.homeprint_hover');
		},
		mouseleave: function(){
			this.morph('a.homeprint_default');
		}
	});
	
	// List items van het hoofdmenu
	hoofdmenuLists.each( function(li, i) { 
		hoofdmenuAnchors[i] = li.getElement('a');
		li.addEvents({
			mouseleave: function(){
				if( this.getElement('a').get('class').indexOf('hoofdmenu_active') < 0 ) {
					this.getElement('a').morph('a.hoofdmenu_default');
				}
			}
		});
	});
	hoofdmenuAnchors.each( function(a, i) { 
		a.addEvents({
			mouseenter: function(){
				if( this.get('class').indexOf('hoofdmenu_active') < 0 ) {
					this.morph('a.hoofdmenu_hover');
				}
			}
		});
	});
	// De unordered lists van de submenus
	submenus.each( function(ul, i) {
		submenuLists[i] = ul.getElements('li');
		submenuAnchors[i] = ul.getElements('a');
	});
	submenuLists.each( function(li) {
		if($defined(li)) {
			li.addEvents({
				mouseleave: function(){
					if( this.getElement('a').get('class').indexOf('submenu_active') < 0 ) {
						this.getElement('a').morph('a.submenu_default');
					}
				}
			});
		}
	});
	submenuAnchors.each( function(anchor) {
		if($defined(anchor)) {
			anchor.addEvents({
				mouseenter: function(){
					this.morph('a.submenu_hover');
				}
			});
		}
	});
}

/**
 * Checks whether the specified e-mail addres has a valid format
 * 
 * @param string email
 * @return bool
 */
function IsValidEmail(email) {
	var emailExp = new RegExp("[a-zA-Z0-9._%+-]+@(?:[a-zA-Z0-9-]+\.)+[a-zA-Z]{2,4}");
	return emailExp.test(email);
}

/**
 * Creates _blank targets for links in the website. Specify the attribute
 * rel='external' to make it open in a new window.
 * 
 * @return void
 */
function externalLinks() {
 var anchors = $$("a");
 anchors.each( function(anchor) {
   if (anchor.get("href") && 
       anchor.get("rel") == "external") 
     anchor.target = "_blank"; 
 });
 var areas = $$("area"); 
 areas.each( function(area) {
   if (area.get("href") && 
       area.get("rel") == "external") 
     area.target = "_blank"; 
 });
}

/**
 * Returns the width of the scrollbar in pixels, very handy for overflowing divs indeed
 * 
 * @return int
 */
function getScrollbarWidth () {
	var inner = new Element('p');
	inner.setStyle('width', "100%");
	inner.setStyle('height', "200px");

	var outer = new Element('div');
	outer.setStyle('position', "absolute");
	outer.setStyle('top', "0px");
	outer.setStyle('left', "0px");
	outer.setStyle('visibility', "hidden");
	outer.setStyle('width', "200px");
	outer.setStyle('height', "150px");
	outer.setStyle('overflow', "hidden");
	inner.inject(outer);

	document.body.appendChild (outer);
	var w1 = inner.offsetWidth;
	outer.setStyle('overflow', 'scroll');
	var w2 = inner.offsetWidth;
	if (w1 == w2) w2 = outer.clientWidth;

	outer.destroy();

	return (w1 - w2);
};