// JavaScript Document
///////////////////////////////////////
//////copyright Jacob Baars 2007///////
///////////////////////////////////////
//menuvariabelen, globaal zodat ze overal kunnen worden benaderd. Worden gevuld met function Init.
var hoofdMenuItems = new Array;
var subMenuus = new Array;
var subMenuItems = new Array;
//dit worden de divs met thumbnails
var deThumbs = new Array;
//het startplaatje, doorzichtig, gebruikt om bij verandering van afbeelding eerst te tonen om maat problemen te verhelpen
var StartPlaatje;
//om het submenu van de actieve pagina te tonen
var actiev;
// de menuonderdelen initialiseren
				function Init(pagina) {
					if (!document.getElementById) return false;
					if (!document.getElementsByTagName) return false;
				//arrays met menu onderdelen vullen
				//menu zoeken en onderverdelen in hoofd en sub
					var alleUl = document.getElementById("menu").getElementsByTagName("ul");
				//de eerste ul is het hoofdmenu
					//de li's zijn childNodes hiervan en sommige li's bevatten een ul d.i een submenu
					for(i=0;i<alleUl[0].childNodes.length;i++) {
						//alle child nodes van de eerste ul
						dehoofdli = alleUl[0].childNodes[i];
						//als het een echt element is toevoegen aan hoofMenuItems
						if(dehoofdli.nodeType==1){
							hoofdMenuItems[hoofdMenuItems.length] = dehoofdli;
						}
					}
				//de andere ul's zijn submenu's, i=1 omdat de eerste het hoofdmenu was
					for(i=1;i<alleUl.length;i++) {
						subMenuus[i-1] = alleUl[i];
					}
					//de items van elk submenu in een samengesteld array zetten
					for(i=0;i<subMenuus.length;i++) {
						subMenuItems[i] = subMenuus[i].getElementsByTagName("li");
					}
				//muisfuncties koppelen
					for(i=0;i<hoofdMenuItems.length;i++) {
						hoofdMenuItems[i].onmouseover = muisEroverH;//functie gaat worden aangeroepen onmouseover
						hoofdMenuItems[i].onmouseout = muisEruitH;
						hoofdMenuItems[i].onmouseup = muisKlikH;
						//een speciale functie aanroepen die cookie zet als op hoofdmenuitem wordt geklikt
						hoofdMenuItems[i].firstChild.onmouseup = muisKlikAH;						
						//standaard klik-naar-href onmogelijk maken
						//alert(hoofdMenuItems[i].firstChild.nodeName);
						hoofdMenuItems[i].onclick = function () {
							//alert("klik onclick H");
							return false;
						}
						//getal dat aan de li wordt gekoppeld om de juiste submenu's te tonen
						hoofdMenuItems[i].nummertje = i; 
					}
				//de muisacties van de submenuitems regelen
					for(i=0;i<subMenuItems.length;i++) {
						var hoevsub = subMenuItems[i];
						for(p=0;p<hoevsub.length;p++){
						hoevsub[p].onmouseover = muisEroverS;
						hoevsub[p].onmouseout = muisEruitS;
						hoevsub[p].onmouseup = muisKlikS;
						//standaard klik-naar-href onmogelijk maken
						hoevsub[p].onclick = function () {
							//alert("klik onclick S");
							return false;
						}
						//getal dat aan de li wordt gekoppeld om later de juiste items te tonen, middels cookie
						hoevsub[p].subnummer = p;
						}
					}
				//als er thumbs zijn, deze activeren en muisacties eraan koppelen
					var deInhoud = document.getElementById("beeld");
					if(deInhoud) {
						var alleThumbs = deInhoud.getElementsByTagName("div");
						//hier wordt het array met 'echte' thumbdivs gemaakt
						if(alleThumbs.childNodes=true){
							for(var i=0;i<alleThumbs.length;i++) {
								if(alleThumbs[i].firstChild.nodeType==1){
									deThumbs[deThumbs.length]=alleThumbs[i];
								}
							}
						}
					}
				//elke thumbdiv doorlopen en aan de afbeelding muisacties koppelen
					for(var i=0;i<deThumbs.length;i++){
						var dekleinePlaatjes = deThumbs[i].getElementsByTagName("IMG");
						//de klikactie koppelen
						for(var p=0;p<dekleinePlaatjes.length;p++){
							dekleinePlaatjes[p].onclick = function () {
								return false;
							}
							dekleinePlaatjes[p].onmouseup = thumbKlik;
						}
						//te lange thumblijsten ontdekken en regelfunctie starten daarvoor
						if(dekleinePlaatjes.length>6){
							thumbsTeLang(deThumbs[i]);
						}
					}
				//als er een paginanummer in de Init zat, dus niet bij de index, submenu tonen en verbergen en items actief maken
					if(pagina!=null){
						actiev = pagina-2;
						startSub();
					}
				//het startplaatje achterhalen
					if(document.getElementById("deAfbeelding")){
						StartPlaatje = document.getElementById("deAfbeelding").src;
					}
				//cookie lezen en alsiederis functie toonBeeld starten met cookiewaarde als aansturing
					var welknummer = readCookie('waarheen');
					var welkekleur = readCookie('kleur')
						//alert(welknummer + "  " + welkekleur)
				//alleen toonBeeld bij beeldpagina's, niet bij contact (actiev=-1)
					if(welknummer&&actiev>=0) {
						toonBeeld(welknummer, welkekleur);
					}
				//als het cookie niet gelezen wordt, toch maar aan het werk
					if(!welknummer&&actiev>=0) {
						toonBeeld(0, '');
					}
				}
//einde Init
				
//bij het laden van de pagina en bij onmouseout het goede submenu tonen, niet bij contact
				function startSub() {
					if(actiev>=0){
						subMenuus[actiev].style.display = "block";
						var hoofdli = subMenuus[actiev].parentNode;
						hoofdli.style.backgroundColor = "transparent";
						hoofdli.style.backgroundImage = "url(afb/driehoekjeR.gif)";
						hoofdli.style.backgroundRepeat = "no-repeat";
						hoofdli.style.backgroundPosition = "7.25em 0.25em";
						hoofdli.firstChild.style.color = "#E2272A";
					} else {
				//om contact rood te maken bij het laden van de pagina
						hoofdMenuItems[actiev+1].firstChild.style.color = "#E2272A";
					}
				}
//de verschillende muisfuncties voor de menu's
				//hoofdmenu hover, werkt ook op de betreffende submenu's
				function muisEroverH() {
				//submenu's verbergen
					for(i=0;i<subMenuus.length;i++) {
						subMenuus[i].style.display = "none"
						hoofdMenuItems[i+1].style.backgroundImage = "none";
					}
				//driehoekje plaatsen en submenu tonen, niet bij contact
					if(this.nummertje>0) {
						this.style.backgroundColor = "transparent";
						this.style.backgroundImage = "url(afb/driehoekjeR.gif)";
						this.style.backgroundRepeat = "no-repeat";
						this.style.backgroundPosition = "7.25em 0.25em";
						subMenuus[this.nummertje-1].style.display = "block";
					}
				}
				//hoofdmenu mouseout
				function muisEruitH() {
				//submenuus verbergen
					for(i=0;i<subMenuus.length;i++) {
						subMenuus[i].style.display = "none"
					}
				//driehoekje verbergen
					if(this.nummertje>0) {
						this.style.backgroundImage = "none";
					}
				//kijken of actiev bij Init een waarde heeft gekregen, zoniet dan is dit pagina contact
					if(actiev!=null){
						startSub();
					}
				}
				function muisKlikH() {
					if(this.nummertje-1==actiev){
						return
					}else{
						var deweg = this.firstChild.getAttribute("href");
						window.location.href = deweg;
					}
				}
				
				
				//functie wordt aangeroepen als er precies op de hoofdmenulink wordt geklikt 
				//dwz er wordt geen submenukeuze gemaakt, cookie op 0 zetten of erasen
				//in Safari en FF op mac werkt dat alleen met niet actieve links
				//en muisklikH wordt ook altijd nog uitgevoerd
				function muisKlikAH() {
				//nu wordt het eerste item getoond
						createCookie('waarheen',0,0);
				//nu wordt er geen item getoond
						//eraseCookie('waarheen')
				}
				//submenu hover omdat standaard hover stijlen (ivm display manipulaties) niet altijd werken in safari
				function muisEroverS() {
					this.firstChild.style.textDecoration = "underline";
				}
				function muisEruitS() {
					this.firstChild.style.textDecoration = "none";
				//kijken of actiev bij Init een waarde heeft gekregen, zoniet dan is dit pagina index en die doet niet aan sub
					if(actiev!=null){
						startSub();
					}
				}
				function muisKlikS() {

					var hoeveel = this.subnummer;
					var deweg = this.parentNode.parentNode.firstChild.getAttribute("href");
					var URL = location.href;
					//als de link href gelijk is aan de locatie van de pagina, 
					//dubbele voorwaarde omdat IE<6 het url anders beschrijft
					if((URL.substring(URL.lastIndexOf('/'))=="/"+deweg)||deweg==URL){
						//als nieuwe pagina niet nodig is, wordt het juiste item getoond
						toonBeeld(hoeveel);
						createCookie('waarheen',hoeveel,0);
					} else {//klikken op het submenu maakt een cookie met daarin het submenu-item-nummer
						createCookie('waarheen',hoeveel,0)
						window.location.href = deweg;
					}
			//en de href wordt gevolgd
				}
//de thumbnails klikfunctie
				function thumbKlik() {
					dehref = this.parentNode.getAttribute("href")
					plaatje = document.getElementById("deAfbeelding");
					plaatje.setAttribute("src", StartPlaatje);//eerst doorzicht terug plaatsen, ivm breedte en hoogte perikelen
					plaatje.setAttribute("src", dehref);
				}
//om het beeld te tonen in de pagina's, na klikken in het menu
//bij het openen wordt hij aangeroepen door Init die het cookie leest
				function toonBeeld(menuitemnr) {
					plaatje = document.getElementById("deAfbeelding");
					plaatje.setAttribute("src", StartPlaatje);//eerst doorzicht terug plaatsen, ivm breedte en hoogte perikelen
					debeelddiv = document.getElementById("beeld");
					//kijken welk submenu en welk submenuitem is aangeklikt, href en value daarvan gebruiken
					deAtag = subMenuItems[actiev][menuitemnr].firstChild;
					deHref = deAtag.getAttribute("href");
					plaatje.setAttribute("src",deHref);//de afbeelding plaatsen
					deTekst = deAtag.firstChild.nodeValue;
					//de thumbs verbergen
					alleThumbs = debeelddiv.getElementsByTagName("div");
					for(var i=0;i<alleThumbs.length;i++){
						alleThumbs[i].style.display = "none"
					}
					//de goede thumb tonen
					if(document.getElementById(deTekst)){//de juiste thumbs tonen
						document.getElementById(deTekst).style.display = "block"
					}
					  //var welknummer = readCookie('waarheen');
					var dekleur = readCookie('kleur');
  					//het actieve submenuitem regelen, niet doen als contact wordt aangeklikt (actiev<0)
					if(actiev>=0){
						actieveSublink(menuitemnr, dekleur);
					}
				}

//de actieveSublink van een kleur voorzien
				function actieveSublink(k, m) {
					for(i=0;i<subMenuItems[actiev].length;i++){
						if(m == 'wit') {
							subMenuItems[actiev][i].firstChild.style.color = "#000000";
						}
						if(m == 'zwart') {
							subMenuItems[actiev][i].firstChild.style.color = "#FFFFFF";
						}
					}
					var hetitem = subMenuItems[actiev][k].firstChild;
					hetitem.style.color = "#E2272A";
				}
//functies die te lange thumbnaillijsten regelt, wordt door Init gestart
//knoppen worden ingevoegd met acties eraan
				function thumbsTeLang(dezethumblijst) {
					//alert(dezethumblijst.getAttribute("id")+" is te lang");
					deLinks = dezethumblijst.childNodes;//dit zijn de links
							//pijltjesknoppenDown maken met plaatje en link er al aan
							var nieuweLinkD = document.createElement("a");
							nieuweLinkD.setAttribute("name", "verder")
							var nieuwPlaatjeD = document.createElement("img");
							nieuwPlaatjeD.setAttribute("src","afb/pijltjeD.gif");
							nieuweLinkD.appendChild(nieuwPlaatjeD);
							//pijltjesknoppenUp maken met plaatje en link er al aan
							var nieuweLinkU = document.createElement("a");
							nieuweLinkU.setAttribute("name", "terug")
							var nieuwPlaatjeU = document.createElement("img");
							nieuwPlaatjeU.setAttribute("src","afb/pijltjeU.gif");
							nieuweLinkU.appendChild(nieuwPlaatjeU);
					//de knoppen op de juiste plekken invoegen
					var p=1;
					for(var i=0;i<deLinks.length;i++){
						if(i==7*p-2) {//na iedere 5 originele thumbs pijltjes invoegen
							var nieuwErinU = nieuweLinkU.cloneNode(true);
							nieuwErinU.onmouseup = naarVorige;
							dezethumblijst.insertBefore(nieuwErinU,deLinks[i]);
							var nieuwErinD = nieuweLinkD.cloneNode(true);
							nieuwErinD.onmouseup = naarVolgende;
							dezethumblijst.insertBefore(nieuwErinD,deLinks[i]);
						p++;
						}
					}
					for(var i=0;i<deLinks.length;i++){
						var thumbnummer;
						deLinks[i].thumbnummer = i+1;
						if(i>5) {
							deLinks[i].style.display = "none";
						}
					}
				}
				function naarVolgende(){
					var thumblijst = this.parentNode.childNodes;
					for(var i=0;i<thumblijst.length;i++){
						thumblijst[i].style.display = "none";
						if(i>=this.thumbnummer&&i<this.thumbnummer+7){
							thumblijst[i].style.display = "block";
						}
					}
				}
				function naarVorige(){
					var thumblijst = this.parentNode.childNodes;
					for(var i=0;i<thumblijst.length;i++){
						thumblijst[i].style.display = "none";
						if(i<=this.thumbnummer-2&&i>this.thumbnummer-9){
							thumblijst[i].style.display = "block";
						}
					}
				}

//cookie functies mda www.quirksmode.org
				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=/";
				}
				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;
				}
				function eraseCookie(name) {
						createCookie(name,"",-1);
				}