/* ##################################
   ###                            ###
   ### Initialisatie + Declaratie ###
   ###                            ###
   ################################## */


var timer        = 0;
var interval     = 0;
var windowWidth  = 0;
var windowHeight = 0;
var rowClassName = '';


// Initialiseert alle benodigde javascript om alle content op een pagina goed te kunnen zien.
function initContent() {
	windowWidth  = window.innerWidth || document.body.clientWidth;
	windowHeight = window.innerWidth || document.body.clientWidth;
	
	initNavigation();
	initHeaderNavigation();
	initScrollBox();
	// initLanguage();
	initSitemap();
	initProductNavigation();
	initMagnifier();
	
	window.onresize = rePosition;
}

// Herpositioneert alles na window.resize
function rePosition() {
	windowWidth  = window.innerWidth || document.body.clientWidth;
	windowHeight = window.innerWidth || document.body.clientWidth;
	
	positionHeaderNavigation();
	positionSubMenus(2);
	moveActiveDiv();
	positionProduct();
	positionMagnifiers();
}


/* ###############################
   ###                         ###
   ### Functies t.b.v. Sitemap ###
   ###                         ###
   ############################### */


// Initialiseert sitemap.
function initSitemap() {
	var sitemapHeader     = document.getElementById("sitemap_header");
	var sitemapBody = document.getElementById("sitemap_body");
	
	sitemapHeader.onclick = swapSitemapState;
	if(readCookie('sitemap') == 1) {
		sitemapBody.style.display = 'block';
	} else {
		sitemapBody.style.display = 'none';
	}
}

// Zet sitemap open of dicht.
function swapSitemapState() {
	var sitemapBody = document.getElementById("sitemap_body");
	
	if(sitemapBody.style.display == 'block') {
		sitemapBody.style.display = 'none';
		createCookie('sitemap', 0, 1);
	} else {
		sitemapBody.style.display = 'block';
		createCookie('sitemap', 1, 1);
	}
}


/* ##############################
   ###                        ###
   ### Functies t.b.v. Header ###
   ###                        ###
   ############################## */


// Initialiseert de headernavigatie
function initHeaderNavigation() {
	positionHeaderNavigation();
}

// Positioneert de headernavigatie
function positionHeaderNavigation() {
	var headerTable = document.getElementById("scrollBox");
	var headerImage = document.getElementById("header_im");
	
	var headerImageX = findPos(headerImage)[0];
	var headerImageH = headerImage.clientHeight;
	var headerImageY = findPos(headerImage)[1];
	var headerTableX = headerImageX - 190;
	var headerTableY = headerImageY + headerImageH - 100;
	
	headerTable.style.left       = headerTableX + 'px';
	headerTable.style.top        = headerTableY + 'px';
	headerTable.style.visibility = 'visible';
}

// Initialiseert de taalselector
function initLanguage() {
	var selector   = document.getElementById("lang_select");
	selector.onmouseover = swapSelectorState;
	selector.onmouseout  = swapSelectorState;
	
	var languages  = document.getElementsByTagName('TR');
	for(var i = 0; i < languages.length; i++) {
		if(languages[i].id.substr(0,5) == 'lang_') {
			languages[i].onmouseover = swapLangState;
			languages[i].onmouseout  = swapLangState;
			languages[i].onclick     = handleLanguage;
		}
	}
}

// Handelt klik op de taalselector af
function handleLanguage(evt) {
	evt            = evt || event;
	var element    = evt.target || evt.srcElement;
	var languageId = element.id.split("_");
	
	var lang = getUrlVars()["taal"];
	if(lang) {
		var langStringLocation = window.location.href.indexOf('taal=') + 5;
		var langStringLength   = lang.length;
		var newUrl             = window.location.href.substr(0, langStringLocation) + languageId[1] + window.location.href.substr(langStringLocation + langStringLength);
	} else {
		if(window.location.href.indexOf('?') > 0) {
			var newUrl = window.location.href + '&taal=' + languageId[1];
		} else {
			var newUrl = window.location.href + '?taal=' + languageId[1];
		}
	}
	window.location.href = newUrl;
}

// Wisselt itemstatus op de taalselector
function swapLangState(evt) {
	evt            = evt || event;
	var element    = evt.target || evt.srcElement;
	var languageId = element.id.split("_");
	var cellId     = 'langcell_' + languageId[1];
	var selector   = document.getElementById("lang_selector");
	
	if(evt.type == 'mouseover') {
		keepObject();
		document.getElementById(cellId).style.backgroundImage = "url('image/lang_middle_dark.png')";
	} else {
		requestHideObject(selector);
		document.getElementById(cellId).style.backgroundImage = "url('image/lang_middle.png')";
	}
}

// Toont of verbergt de taalselector
function swapSelectorState(evt) {
	evt          = evt || event;
	
	var langButton = document.getElementById("lang_select");
	var selector   = document.getElementById("lang_selector");
	
	if(evt.type == 'mouseover') {
		keepObject();
		selector.style.left       = (findPos(langButton)[0] + 3)  + 'px';
		selector.style.top        = (findPos(langButton)[1] + 30) + 'px';
		selector.style.visibility = 'visible';
	} else {
		requestHideObject(selector);
	}
}

function requestHideObject(obj) {
	timer = setTimeout(function(){hideObject(obj)}, 300);
}

function hideObject(obj) {
	obj.style.visibility = 'hidden';
}

function keepObject() {
	clearTimeout(timer);
}



/* ####################################
   ###                              ###
   ### Functies t.b.v. dropdownmenu ###
   ###                              ###
   #################################### */



// Initialiseert de headernavigatie
function initNavigation() {
	var menuParent = document.getElementById('navigationParent');
	var menuTable  = document.createElement("table");
	var menuTbody  = document.createElement("tbody");
	var menuRow    = document.createElement("tr");
	
	menuTable.cellPadding       = 0;
	menuTable.cellSpacing       = 0;
	menuTable.style.marginLeft  = 'auto';
	menuTable.style.marginRight = '0px';
	
	menuParent.appendChild(menuTable);
	menuTable.appendChild(menuTbody);
	menuTbody.appendChild(menuRow);
	
	for(var i in menu) {
		// Hoofdmenu Item
		if(i == 2) {
			for(var j = 0; j < menu[i].menuItems.length; j++) {
				var itemCell = document.createElement("td");
				
				// itemDiv initialiseert submenu.
				if(menu[i].menuItems[j].folder) {
					var itemText = document.createTextNode(menu[i].menuItems[j].folder);
					itemCell.onmouseover = swapSubMenu;
					itemCell.onmouseout  = swapSubMenu;
					itemCell.className   = 'itemOff';
					itemCell.style.cursor = 'pointer';
					itemCell.onclick      = clickItem;
				}
				
				// itemDiv initialiseert pagina.
				if(menu[i].menuItems[j].page) {
					var itemText = document.createTextNode(menu[i].menuItems[j].page);
					itemCell.onmouseover  = swapItem;
					itemCell.onmouseout   = swapItem;
					itemCell.onclick      = clickItem;
					itemCell.className    = 'itemOff';
					itemCell.style.cursor = 'pointer';
					itemCell.id           = 'item' + menu[i].menuItems[j].id;
				} else {
					itemCell.id           = 'main' + menu[i].menuItems[j].id;
				}
				
				itemCell.style.paddingRight = '30px';
				itemCell.appendChild(itemText);
				menuRow.appendChild(itemCell);
			}
		} 
		
		// SubItem
		else {
			var menuDiv                 = document.createElement("div");
			menuDiv.className           = "menuDiv";
			menuDiv.id                  = "div" + i;
			menuDiv.style.paddingTop    = '5px';
			menuDiv.style.paddingBottom = '5px';
			
			// Maak subItems aan.
			for(var j = 0; j < menu[i].menuItems.length; j++) {
				var itemDiv   = document.createElement("div");
				var itemOut = false;
								
				// subItem initialiseert submenu.
				if(menu[i].menuItems[j].folder) {
					var itemText = document.createTextNode(menu[i].menuItems[j].folder);
					itemDiv.className   = 'itemOff';
					itemDiv.onmouseover = swapSubMenu;
					itemDiv.onmouseout  = swapSubMenu;
					itemDiv.id          = 'menu' + menu[i].menuItems[j].id;
					itemDiv.onclick     = clickItem;
					itemDiv.style.cursor = 'pointer';
				} 
				
				// subItem initialiseert pagina.
				if(menu[i].menuItems[j].page) {
					var itemText = document.createTextNode(menu[i].menuItems[j].page);
					itemDiv.onmouseover  = swapItem;
					itemDiv.onmouseout   = swapItem;
					itemDiv.onclick      = clickItem;
					itemDiv.className    = 'itemOff';
					itemDiv.style.cursor = 'pointer';
					itemDiv.id          = 'item' + menu[i].menuItems[j].id;
				}
				
				// subItem initialiseert productgroep.
				if(menu[i].menuItems[j].group) {
					var itemText = document.createTextNode(menu[i].menuItems[j].group);
					itemDiv.onmouseover  = swapSubGroup;
					itemDiv.onmouseout   = swapSubGroup;
					itemDiv.onclick      = clickGroup;
					itemDiv.className    = 'itemOff';
					itemDiv.style.cursor = 'pointer';
					itemDiv.id          = 'item' + menu[i].menuItems[j].id;
					if(menu[menu[i].menuItems[j].id]) {
						itemOut = true;
					}
				}
				
				itemDiv.style.paddingLeft  = '5px';
				itemDiv.style.paddingRight = '18px';
				if(itemOut) {
					itemDiv.style.backgroundImage    = "url('image/icon/open.png')";
					itemDiv.style.backgroundPosition = "right center";
					itemDiv.style.backgroundRepeat   = "no-repeat";
				}
				itemDiv.appendChild(itemText);
				menuDiv.appendChild(itemDiv);
			}
			// Koppel het nieuwe submenu aan de pagina.
			document.body.appendChild(menuDiv);
		}
	}
	positionSubMenus(2);
}

function positionSubMenus(parentFolder) {
	for(var i in menu) {
		if(menu[i].subId == parentFolder) {
			switch(menu[i].subId) {
				case '2':
					var menuParent   = document.getElementById('main' + i);
					var menuMain     = true;
					break;
				default:
					var menuParent   = document.getElementById('item' + i);
					if(!menuParent) {
						menuParent = document.getElementById('menu' + i);
					}
					var menuMain     = false;
					break;
			}
			
			divId = "div" + i;
			if(document.getElementById(divId)) {
				var menuDiv = document.getElementById(divId)
				// Bepaal de schermpositie van het submenu.
				if(menuMain) {
					menuDiv.style.left = findPos(menuParent)[0] + 'px';
					menuDiv.style.top  = (findPos(menuParent)[1] + 31) + 'px';
				} else if(menuParent) {
					var menuWidth = menuParent.offsetWidth || menuParent.clientWidth;
					var menuLeft  = findPos(menuParent)[0] + menuWidth;
					var menuTop   = findPos(menuParent)[1] - 5;
					
					var subWidth  = menuDiv.offsetWidth || menuDiv.clientWidth;
					
					if(menuLeft + subWidth >= windowWidth) {
						menuLeft = findPos(menuParent)[0] - subWidth;
					}
					
					menuDiv.style.left = menuLeft + 'px';
					menuDiv.style.top  = menuTop  + 'px';
				}
			positionSubMenus(i);
			}
		}
	}
}

// Toont submenu op muisover.
function swapSubMenu(evt) {
	evt = evt || event;
	var element = evt.target || evt.srcElement;
	var groupId = element.id.substr(4);
	
	if(evt.type == 'mouseover') {
		element.className = 'itemOn';
		showMenu(element);
	} else {
		element.className = 'itemOff';
		requestHide();
	}
}

// Toont product-subgroep op muisover.
function swapSubGroup(evt) {
	evt = evt || event;
	var element = evt.target || evt.srcElement;
	var groupId = element.id.substr(4);
	
	if(evt.type == 'mouseover') {
		element.className = 'itemOn';
		showMenu(element);
	} else {
		element.className = 'itemOff';
		requestHide();
	}
}

// Handelt een click op een productgroep af.
function clickGroup(evt) {
	evt = evt || event;
	var element = evt.target || evt.srcElement;
	var groupId = element.id.substr(5);
	document.location.href = 'index.php?group=' + groupId;
}

// Mousover op pagina-item.
function swapItem(evt) {
	evt = evt || event;
	var element = evt.target || evt.srcElement;
	
	if(evt.type == 'mouseover') {
		element.className = 'itemOn';
		showMenu(element);
	} else {
		element.className = 'itemOff';
		requestHide();
	}
}

function clickItem(evt) {
	evt = evt || event;
	var element = evt.target || evt.srcElement;
	var itemId  = element.id.substr(4);
	if(element.id.substr(0,4) == 'main' || element.id.substr(0,4) == 'menu') {
		document.location.href = 'index.php?map=' + itemId;
	} else {
		document.location.href = 'index.php?page=' + itemId;
	}
}



// Toont menu.
function showMenu(element) {
	keepMenus();
	
	var liveId = element.id.substr(4);
	var liveMenus = new Array();
	
	for(var i in menu) {
		for(var j = 0; j < menu[i].menuItems.length; j++) {
			if(menu[i].menuItems[j].id == liveId) {
				var liveMenu = i;
			}
		}
	}
	
	var count = 0;
	while(liveMenu != 0) {
		liveMenus[count] = liveMenu;
		count++;
		liveMenu = menu[liveMenu].subId;
	}
	liveMenus[count] = liveId;
	
	for(var i in menu) {
		if(document.getElementById('div' + i))
			if(in_array(i, liveMenus)) {
				document.getElementById('div' + i).style.visibility = 'visible';
			} else {
				document.getElementById('div' + i).style.visibility = 'hidden';
		}
	}
	
}

// Vraagt menuhide aan.
function requestHide() {
	timer = setTimeout("hideMenus()",500);
}

// Verbergt menu's
function hideMenus() {
	for(var i in menu) {
	if(document.getElementById('div' + i))
		document.getElementById('div' + i).style.visibility = 'hidden';
	}
}

function keepMenus() {
	clearTimeout(timer);
}


/* ###################################
   ###                             ###
   ### Functies t.b.v. scroll-menu ###
   ###                             ###
   ################################### */


var currentMessage = 0;
var maxScrollDown  = 0;
var scrollTimer    = null;
var activeItem     = 0;
var topOfTheBox    = 0;

// Initialiseer scroller.
function initScrollBox() {
	// Roep de scrollBox aan.
	var scrollBox = document.getElementById('scrollBox');
	
	// Plaats de content in de scrollBox.
	var contentTable = document.createElement('table');
	contentTable.cellSpacing  = 0;
	contentTable.cellPadding  = 0;
	contentTable.style.width  = '100%';
	contentTable.style.height = '100%';
	
	var contentTbody = document.createElement('tbody');
	
	scrollBox.style.overflow  = 'hidden';
	scrollBox.appendChild(contentTable);
	contentTable.appendChild(contentTbody);
	
	for(var i = 0; i < scrollMessage.length; i++) {
		var contentRow  = document.createElement('tr');
		var contentCell = document.createElement('td');
		var contentText = document.createTextNode(scrollMessage[i].text);
		
		contentRow.id                   = 'scrollRow_' + i;
		
		contentCell.id                  = 'scrollItem_' + i;
		contentCell.onclick             = openScrollLink;
		contentCell.style.cursor        = 'pointer';
		contentCell.onmouseover         = swapScrollItem;
		contentCell.onmouseout          = swapScrollItem;
		contentCell.style.fontSize      = '8pt';
		contentCell.style.verticalAlign = 'middle';
		contentCell.style.paddingLeft   = '5px';
		
		contentCell.appendChild(contentText);
		contentRow.appendChild(contentCell);
		contentTbody.appendChild(contentRow);
	}				
	
	// Zoek de topwaarde van elk content-item op en plaats deze in variabele 'scrollMessage'.
	for(var i = 0; i < scrollMessage.length; i++) {
		contentRow = document.getElementById('scrollRow_' + i);
		scrollMessage[i].top = contentRow.offsetTop;
	}
	
	topOfTheBox   = findPos(scrollBox)[1];
	maxScrollDown = contentTable.clientHeight - scrollBox.clientHeight;
	
	var activeDiv              = document.createElement('div');
	activeDiv.style.width      = scrollBox.clientWidth;
	activeDiv.style.height     = document.getElementById('scrollRow_0').clientHeight;
	activeDiv.className        = 'activeDiv';
	activeDiv.style.position   = 'absolute';
	activeDiv.style.top        = topOfTheBox;
	activeDiv.style.left       = '0px';
	activeDiv.style.zIndex     = 7;
	activeDiv.id               = 'activeDiv';
	activeDiv.style.visibility = 'hidden';
	document.body.appendChild(activeDiv);
	
	var activeImg              = document.createElement('img');
	activeImg.src              = 'image/icon/arrow.png';
	activeImg.style.position   = 'absolute';
	activeImg.style.top        = topOfTheBox;
	activeImg.style.left       = '0px';
	activeImg.style.zIndex     = 8;
	activeImg.style.height     = activeDiv.clientHeight;
	activeImg.style.width      = activeDiv.clientHeight;
	activeImg.id               = 'activeImg';
	activeImg.style.visibility = 'hidden';
	document.body.appendChild(activeImg);
	
	moveActiveDiv();
}


// Scroll naar volgende item.
function scrollToThis(value) {
	var scrollBox = document.getElementById('scrollBox');

	if(value == 'next' || value == 'previous') {				
		// Maak van het volgende item het huidige...
		if(value == 'next') {
			stopScrolling();
			currentMessage++;
			if(currentMessage == scrollMessage.length) {
				currentMessage = 0;
			}
		}
		
		if(value == 'prev') {
			stopScrolling();
			currentMessage--;
			if(currentMessage == -1) {
				currentMessage = scrollMessage.length - 1;
			}
		}
	} else {
		currentMessage = parseInt(value);
	}
	
	// Scroll die box!
	var body = document.getElementsByTagName('BODY')[0];
	
	if(topOfTheBox) {
		scrollBoxToValue(scrollMessage[currentMessage].top);
	} else {
		if(body && body.readyState == 'loaded' || body && body.readyState == 'complete') {
			scrollBoxToValue(scrollMessage[currentMessage].top);
		} else {
			if (window.addEventListener) {
				window.addEventListener('load', function() { scrollBoxToValue(scrollMessage[currentMessage].top); }, false);
			} else {
				if(window.attachEvent) {
					window.attachEvent('onload', function() { scrollBoxToValue(scrollMessage[currentMessage].top); });
				} else {
					alert('Your browser is not compatible with some of the scripting on this site.');
				}
			}
		}
	}
}

// Scroll naar een bepaalde hoogte...
function scrollBoxToValue(value) {
	var scrollBox = document.getElementById('scrollBox');
	
	if(value == scrollBox.scrollTop || scrollBox.scrollTop == maxScrollDown && value > scrollBox.scrollTop) {
		moveActiveDiv();
	}
	if(value > scrollBox.scrollTop && scrollBox.scrollTop < maxScrollDown) {
		scrollBox.scrollTop++;
		scrollTimer = setTimeout(function() { scrollBoxToValue(value) }, 10);
	}
	if(value < scrollBox.scrollTop) {
		scrollBox.scrollTop--;
		scrollTimer = setTimeout(function() { scrollBoxToValue(value) }, 10);
	}
}

// Verplaats het actieve element.
function moveActiveDiv() {
	var scrollBox = document.getElementById('scrollBox');
	var activeDiv = document.getElementById('activeDiv');
	var activeImg = document.getElementById('activeImg');
	
	if(document && document.getElementById('scrollRow_' + activeItem)) {
		scrollActiveToValue(document.getElementById('scrollRow_' + activeItem).offsetTop - scrollBox.scrollTop + findPos(scrollBox)[1]);
		activeDiv.style.left       = findPos(scrollBox)[0];
		activeImg.style.left       = findPos(scrollBox)[0] + activeDiv.clientWidth;
	}
}

// Scrollfunctie voor actieve boxje.
function scrollActiveToValue(value) {
	var activeDiv = document.getElementById('activeDiv');
	var activeImg = document.getElementById('activeImg');
	var divTop    = parseInt(activeDiv.style.top);
	
	if(divTop >= topOfTheBox) {
		activeDiv.style.visibility = 'visible';
		activeImg.style.visibility = 'visible';
	}
	if(value > divTop) {
		activeDiv.style.top = divTop + 1;
		activeImg.style.top = divTop + 1;
		scrollTimer = setTimeout(function() { scrollActiveToValue(value) }, 10);
	}
	if(value < divTop) {
		activeDiv.style.top = divTop - 1;
		activeImg.style.top = divTop - 1;
		scrollTimer = setTimeout(function() { scrollActiveToValue(value) }, 10);
	}
}

function setActiveItem(value) {
	activeItem = value;
	
	/* Uncomment code below to make active item bold.
	for(var i = 0; i < scrollMessage.length; i++) {
		if(i == value) {
			document.getElementById('scrollItem_' + i).style.fontWeight = 'bold';
		} else {
			document.getElementById('scrollItem_' + i).style.fontWeight = 'normal';
		}
	}
	*/
}

function stopScrolling() {
	clearTimeout(scrollTimer);
}

function swapScrollItem(evt) {
	evt         = evt || event;
	var element = evt.target || evt.srcElement;
	
	if(evt.type == 'mouseover') {
		element.style.textDecoration = 'underline';
	} else {
		element.style.textDecoration = 'none';
	}
}

function openScrollLink(evt) {
	evt = evt || event;
	element = evt.target || evt.srcElement;
	var clickedId = element.id.substr(11);
	document.location.href = 'index.php?group=' + scrollMessage[clickedId].group;
}

function doStuffFunction (imgindex, keyword) {
	setActiveItem(imgindex);
	scrollToThis(keyword);
}


/* ############################
   ###                      ###
   ### Vergrootglasfuncties ###
   ###                      ###
   ############################ */


function initMagnifier() {
	var magnifyImages = document.getElementsByTagName("IMG");
	var magnifiers    = new Array();
	var count         = 0;
	
	var darkerHeight = Math.max(document.body.scrollHeight);
	var darkerWidth  = Math.max(document.body.scrollWidth);
	
	if(darkerHeight < document.body.clientHeight) {
		darkerHeight = document.body.clientHeight;
	}
	if(darkerWidth < document.body.clientWidth) {
		darkerWidth = document.body.clientWidth;
	}
	
	var documentDarker = document.createElement("div");
	documentDarker.style.width           = darkerWidth;
	documentDarker.style.height          = darkerHeight;
	documentDarker.style.position        = 'absolute';
	documentDarker.style.left            = '0px';
	documentDarker.style.top             = '0px';
	documentDarker.style.zIndex          = 20;
	documentDarker.style.visibility      = 'hidden';
	documentDarker.style.backgroundColor = '#000000';
	documentDarker.style.filter          = 'alpha(opacity=0)';
	documentDarker.style.opacity         = 0;
	documentDarker.id                    = 'darker';
	documentDarker.style.cursor          = "url('image/cursors/magnify.cur')";
	document.body.appendChild(documentDarker);
	
	for(var i = 0; i < magnifyImages.length; i++) {
		if(magnifyImages[i].className == 'enlarge') {
			magnifyImages[i].id = 'magnify_' + i;
			
			var glassImage = new Image();
			glassImage.src = 'image/icon/magnify.jpg';
			glassImage.style.position = 'absolute';
			glassImage.style.left     = findPos(magnifyImages[i])[0] + magnifyImages[i].clientWidth - 21;
			glassImage.style.top      = findPos(magnifyImages[i])[1] + magnifyImages[i].clientHeight - 21;
			glassImage.style.zIndex   = findZIndex(magnifyImages[i]) + 1;
			glassImage.style.cursor   = 'pointer';
			glassImage.onclick        = magnify;
			glassImage.id             = i;
			document.body.appendChild(glassImage);
		}
	}
}

function positionMagnifiers() {
	var glassImages = document.getElementsByTagName("IMG");
	
	for(var i = 0; i < glassImages.length; i++) {
		if(glassImages[i].src.substr(glassImages[i].src.length - 11) == 'magnify.jpg') {
			var glassTarget = document.getElementById('magnify_' + glassImages[i].id);
			glassImages[i].style.left = findPos(glassTarget)[0] + glassTarget.clientWidth - 21;
			glassImages[i].style.top  = findPos(glassTarget)[1] + glassTarget.clientHeight - 21;
		}
	}
}

function magnify(evt) {
	evt         = evt || event;
	var element = evt.target || evt.srcElement;
	
	interval = setInterval(function () { makeDocumentDarkness(15) }, 1);
	
	var magnifiedImage               = new Image();
	magnifiedImage.style.border      = '12px solid #FFFFFF';
	magnifiedImage.align             = 'center';
	magnifiedImage.alt               = 'Click image to return to site.';
	magnifiedImage.style.textAlign   = 'center';
	magnifiedImage.style.marginRight = 'auto';
	magnifiedImage.style.marginLeft  = 'auto';
	magnifiedImage.id                = 'magnified';
	magnifiedImage.style.zIndex      = 21;
	magnifiedImage.style.position    = 'absolute';
	magnifiedImage.onclick           = stopMagnifier;
	magnifiedImage.style.cursor      = 'pointer';
	magnifiedImage.src = document.getElementById('magnify_' + element.id).src;
	document.body.appendChild(magnifiedImage);
	magnifiedImage.style.left = (document.body.clientWidth / 2) - (magnifiedImage.clientWidth / 2);
	var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
	magnifiedImage.style.top  = (document.body.clientHeight / 2) - (magnifiedImage.clientHeight / 2) + scrollY;
}

function stopMagnifier(evt) {
	evt         = evt || event;
	var element = evt.target || evt.srcElement;
	
	if(interval) {
		clearInterval(interval);
	}
	
	document.getElementById('darker').style.visibility = 'hidden';
	document.getElementById('darker').style.opacity    = 0;
	document.getElementById('darker').style.filter     = 'alpha(opacity=0)';
	document.body.removeChild(element);
}

function makeDocumentDarkness(val) {
	var documentDarker = document.getElementById('darker');
	documentDarker.style.visibility = 'visible';
	if((documentDarker.style.opacity * 100) < val) {
		var currentOpacity = documentDarker.style.opacity * 100;
		currentOpacity++;
		
		documentDarker.style.filter          = 'alpha(opacity=' + currentOpacity + ')';
		documentDarker.style.opacity         = currentOpacity / 100;
	} else {
		clearInterval(interval);
	}
}



/* ########################
   ###                  ###
   ### Zoekbalkfuncties ###
   ###                  ###
   ######################## */

function clearBar(element) {
	if(element.value == 'Uw zoekopdracht') {
		element.value = '';
	}
}

function submitSearchForm() {
	if(document.forms['searchForm'].search.value && document.forms['searchForm'].search.value != 'Uw zoekopdracht') {
		document.forms['searchForm'].submit();
	} else {
		alert('U heeft geen geldige\nzoekopdracht ingevoerd.');
	}
}

function showAdvancedSearch() {
	if(document.getElementById('advancedSearch').style.display == 'block') {
		document.getElementById('advancedSearch').style.display = 'none';
	} else {
		document.getElementById('advancedSearch').style.display = 'block';
	}
}


/* #######################
   ###                 ###
   ### Productfuncties ###
   ###                 ###
   ####################### */

function initProductNavigation() {
	if(document.getElementById('productTable')) {
		var documentRows = document.getElementsByTagName('TR');
		
		for(var i = 0; i < documentRows.length; i++) {
			if(documentRows[i].id.substr(0,8) == 'product_') {
				documentRows[i].onmouseover  = swapProductState;
				documentRows[i].onmouseout   = swapProductState;
				documentRows[i].onclick      = handleProductClick;
				documentRows[i].style.cursor = 'pointer';
			}
		}
	}
	positionProduct();
}

function positionProduct() {
	if(document.getElementById('productDiv')) {
		var productDiv = document.getElementById('productDiv');
		var coords = findPos(document.getElementById("header_im"));
		productDiv.style.left = coords[0] - 9;
	}
	if(document.getElementById('darkDiv')) {
		var darkDiv          = document.getElementById('darkDiv');
		darkDiv.style.width  = '1px';
		darkDiv.style.height = '1px';
	}
	
	var darkerHeight = Math.max(document.body.scrollHeight);
	var darkerWidth  = Math.max(document.body.scrollWidth);
	
	if(darkerHeight < document.body.clientHeight) {
		darkerHeight = document.body.clientHeight;
	}
	if(darkerWidth < document.body.clientWidth) {
		darkerWidth = document.body.clientWidth;
	}
	if(document.getElementById('darkDiv')) {
		var darkDiv          = document.getElementById('darkDiv');
		darkDiv.style.width  = darkerWidth;
		darkDiv.style.height = darkerHeight;
	}
}

function swapProductState(evt) {
	evt         = evt || event;
	var element = evt.target || evt.srcElement;
		
	while(element.tagName != 'TR') {
		element = element.parentElement || element.parentNode;
	}
	var rowDaughters = element.childNodes;
	
	for(var i = 0; i < rowDaughters.length; i++) {
		if(evt.type == 'mouseover') {
			if(rowDaughters[i].tagName == 'TD') {
				rowClassName              = rowDaughters[i].className;
			}
			rowDaughters[i].className = 'selectedCell';
		} else {
			rowDaughters[i].className = rowClassName;
		}
	}
}

function handleProductClick(evt) {
	evt         = evt || event;
	var element = evt.target || evt.srcElement;
	
	while(element.tagName != 'TR') {
		element = element.parentElement || element.parentNode;
	}
	
	var vars = getUrlVars();
	if(vars['view']) {
		document.location.href = 'index.php?product=' + element.id.substr(8) + '&view=image';
	} else {
		document.location.href = 'index.php?product=' + element.id.substr(8);
	}
}


/* #########################
   ###                   ###
   ### Algemene functies ###
   ###                   ###
   ######################### */


// Zoekt een stylepropertie op.
function getStyle(el,styleProp) { 
	if (window.getComputedStyle) { 
		var y = document.defaultView.getComputedStyle(el,null).getPropertyValue(styleProp);  
	} else if (el.currentStyle) { 
		var y = el.currentStyle[styleProp]; 
	}                      
	return y; 
}
   
// Zoekt in welke laag een object zit
function findZIndex(element) {
	while(element.tagName != 'BODY') {
		var zIndx = getStyle(element, 'zIndex');
		
		if(zIndx) {
			return zIndx;
		} else {
			element = element.parentElement || element.parentNode;
		}
	}
	return 0;
}

// Zoekt positie van een object
function findPos(obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		do {
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		} while (obj = obj.offsetParent);
	}
	return [curleft,curtop];
}

// Maak een cookie
function createCookie(name,value,days) {
	if (days) {
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}

// Lees een cookie
function readCookie(name) {
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++) {
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}

// Verwijder een cookie
function eraseCookie(name) {
	createCookie(name,"",-1);
}

// Zoek variabele in querystring
function getUrlVars() {
	var vars = [], hash;
	var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
	
	for(var i = 0; i < hashes.length; i++) {
		hash = hashes[i].split('=');
		vars.push(hash[0]);
		vars[hash[0]] = hash[1]
	}
	return vars;
}

// Kijk of waarde in array voorkomt.
function in_array(stringToSearch, arrayToSearch) {
	for (s = 0; s < arrayToSearch.length; s++) {
		thisEntry = arrayToSearch[s].toString();
		if (thisEntry == stringToSearch) {
			return true;
		}
	}
	return false;
}