// javascripts.js versie 1.0 (opgeschoond 25-03-09)

function onLoadFn() {

	// ===================
	// Type html-bestand bepalen...
	// ===================

	// De verwerking is soms afhankelijk van de webpagina. hRef laat zien waar we zitten.
	// Variabele hRef initialiseren met type html-bestand:  "overons", "collectie", "referenties" of "webwinkel"
	var strW = window.location.href;
	strW = strW.toLowerCase();

	hRef = "";
	if (strW.indexOf("overons") > -1) hRef = "overons";
	else if (strW.indexOf("collectie") > -1) hRef = "collectie";
	else if (strW.indexOf("referenties") > -1) hRef = "referenties";
	else if (strW.indexOf("showroommodellen") > -1) hRef = "webwinkel";
	else if (strW.indexOf("webshop") > -1) hRef = "webwinkel";
	else if (strW.indexOf("webwinkel") > -1) hRef = "webwinkel";
	else if (strW.indexOf("winkelwagen") > -1) hRef = "webwinkel";

	if (hRef == "") alert("ERROR! Kan type html-bestand niet bepalen. Moet één van de volgende zijn: 'overons', 'collectie', 'referenties' of 'webwinkel'. ");

	// ============================
	// Bepalen of Internet Explorer...
	// ============================

	isExplorer = (navigator.appName.indexOf('Expl') > -1);

	// ============================
	// Einde van huidige pad/nivo bepalen...
	// ============================

	/*
	09-09-2008, open een beeld als de pagina voor het eerst geopend wordt. We bepalen welke beeld door de huidige
	nivo te verlengen tot het einde van de pad. Zie function padVerlengen voor een uitleg.
	// WE GAAN ERVAN UIT dat het eerste element met 'nivo1_' begint !!
	*/

	linkClick("nivo1");
}

function showHideLayers(id, dummy, actie) {
  // tweede parameter wordt niet gebruikt
  if (actie == 'show') document.getElementById(id).style.visibility='visible';
  else document.getElementById(id).style.visibility='hidden';
}


function padVerlengen(strStartID) {
	/* strStartID laat zien bij welk nivo we beginnen. We gaan dit verlengen tot het einde van de 'eerste' pad.
	Bijv. strStartID = nivo1_2. We kijken of een element met ID nivo1_2_1 bestaat. Zo niet zoeken we 
	naar nivo1_2_2, nivo1_2_3, enz. totdat we een element vinden. Zeg nivo1_2_3. Dan zoeken we naar
	nivo1_2_3_1, nivo1_2_3_2, nivo1_2_3_3 enz. Als we het einde van een pad vinden dan geven we dit terug.

	strStartID is gelijk zijn aan 'nivo1' als we een nieuwe webpagina openen (padVerlengen() wordt aangeroepen door onLoad).
	*/

	var laatsteGevondenID = strStartID;	// Kan 'nivo1' zijn, maar dan hopen we iets anders te vinden.

	// De buitenlus zoekt elke keer naar de volgende nivo (nivo1, nivo1_1, nivo1_1_1, nivo1_1_1_1 enz.) 
	// met maximum 10 extra nivo's (tellerBuiten, tBuit = 10).
	// De binnenlus zoekt elke keer naar het eerste aanwezige element op dit nivo (nivo1_1, nivo1_2, nivo1_3, enz.) 
	// met maximum tellerBinnen, tBinn = 10.

	var strID = strStartID + "_";
	var tBuit = 1;
	var tBinn;
	while (tBuit<10) {
		tBuit++;
		tBinn = 1;
		while (!document.getElementById(strID + tBinn) && (tBinn<10)) {
			// Binnenlus - zoeken naar nivo1_1, nivo1_2, nivo1_3, enz...
			tBinn++;
		}
		// Als tBinn<10 dan hebben we een element gevonden (bijv. nivo1_3), anders zijn er geen elementen meer (nemen we aan)
		if (tBinn < 10) {
			laatsteGevondenID = strID + tBinn;
			strID = strID + tBinn + "_";
		} else {
			tBuit = 10;	// Buitenlus beëindigen
		}
	}
	
	if (laatsteGevondenID == "nivo1_") {
		alert("ERROR! Kan de pad niet verlengen. Er wordt geen selectie gemaakt.");
		laatsteGevondenID = "";
	}

	return laatsteGevondenID;
}

function linkClick(thisID) {

	// Einde van pad bepalen...
	thisID = padVerlengen(thisID);

	// De aangeklikte element pakken...
	var objThisId = document.getElementById(thisID);
	var strOuterHTML;

	if (isExplorer) {
		strOuterHTML = objThisId.outerHTML;
	} else {
		// Mozilla herkent 'outerHTML' niet. Het volgende voor Mozilla...
		var element = document.createElement("div");
		element.appendChild(objThisId.cloneNode(true));
		strOuterHTML = element.innerHTML;
	}

	// Stap 1 - 'tag' instellen. We zijn bezig met div's, niet span's
	var tag = "div";

	// Stap 2 - de groep bepalan d.m.v. de functie getGroep(). Dit is de 'naam' van de menu, bijv. 'nivo'...

	var groep = getGroep(thisID);

	// Stap 3 - alle elementen bepalen met de tag 'tag' en die met een ID in de groep 'groep'...

	// Array maken met alle links met deze tag en van deze groep...
	var allTags = getArrayOfTags(tag, groep);

	// Stap 4 - de lengte van ID van het hoogste niveau bepalen. Dit hebben we nodig omdat elementen op het 
	// hoogste niveau (m.a.w. met deze lengte) allemaal altijd getoond moeten worden. Het hoogste niveau heeft de korste ID.

	var lengteTopNivoID = 999;		// Een willekeurige groot nummer
	var strTopID = "";
	for (var i = 0; i < allTags.length; i++) {
		if (allTags[i].id.length < lengteTopNivoID) {
			strTopID = allTags[i].id;
			lengteTopNivoID = allTags[i].id.length;
		}
	}

	// Stap 5 - als dit het top niveau is dat geklikt is door de gebruiker (lengte van thisID = lengteTopNivoID), 
	// en het al geselecteerd/geklikt is (class begint niet met 'un'), dan dit onthouden...

	var topNivoEnAlClicked = false;
	if ((thisID.length == lengteTopNivoID) && (document.getElementById(thisID).className.substring(0, 2) != "un")) {
		topNivoEnAlClicked = true;
	}

	// NU BEGINNEN MET ELEMENTEN INSTELLEN OP CLICKED/UNCLICKED EN ZICHTBAAR/VERBORGEN...

	// Stap 6 - Alle elementen in allTags instellen op class 'un...' en verbergen (behalve het hoogste niveau)...

	alleNivosInitialiseren(allTags, lengteTopNivoID);

	// Stap 7 - als we niet op het topniveau hebben geklikt, of als we dat toch hebben gedaan en het niet  
	// al geselecteerd was, de verschillende links tonen en zonodig als 'clicked' instellen...

	if ((hRef == "referenties") || (hRef == "overons")) {
		if (topNivoEnAlClicked == false) {
			instellenTotEnMetClickedID(thisID, allTags, lengteTopNivoID);
		}
	} else {
		if (thisID.length != lengteTopNivoID)  {
			instellenTotEnMetClickedID(thisID, allTags, lengteTopNivoID);
		}
	}
}

function alleNivosInitialiseren(allTags, lengteTopNivoID) {
	// Voor alle tags in alltags, class instellen op 'un...' BEHALVE het topniveau (wijziging 2-6-08)
	// en alle tags in alltags die op een _0 eindigen, verbergen, behalve het topniveau
	// (herkend door id.lengte = lengteTopNivoID).
	// NIETS DOEN QUA ZICHTBAARHEID MET TAGS DIE NIET OP _0 EINDIGEN !!!!!

	for (var i = 0; i < allTags.length; i++) {
		if ((hRef =="referenties") || (hRef =="overons")) {
			unSelect(allTags[i]);
		} else {
			if (allTags[i].id.length != lengteTopNivoID) unSelect(allTags[i]);
		}

		// Topniveau altijd tonen...
		if (allTags[i].id.substring(allTags[i].id.length-2) == "_0") {
			if (allTags[i].id.length == lengteTopNivoID) {
				// Topniveau, altijd tonen...
				allTags[i].style.display='';		// Tonen
			} else {
				allTags[i].style.display='none';	// Verbergen
			}
		}
	}
}

function instellenTotEnMetClickedID(thisID, allTags, lengteTopNivoID) {

	/* De gebruiker heeft op een link geklikt, met einde van pad: 'nivo1_2_2_1'
	   We moeten zichtbaar maken: het topniveau('s) (bijv. nivo1), nivo1_0, nivo1_2_0, nivo1_2_2_0 en nivo1_2_2_1_0
	   We moeten selecteren/clicken: nivo1, nivo1_2, nivo1_2_2 en nivo1_2_2_1.
	*/

	var arraySplitID = thisID.split("_");	// thisID opsplitsen op basis van '_'-teken. arraySplitID is nivo1, 2, 2, 1.

	var aantalItems = arraySplitID.length;		// Gelijk aan 4 in voorbeeld (nivo1, 2, 2 en 1), indexes 0, 1, 2 en 3.

	// '_' terugzetten in alle items behalve het eerste...
	for (var i = 1; i < aantalItems; i++) {
		arraySplitID[i] = "_" + arraySplitID[i];
	}

	// Verwerking voor alle niveau's in thisID.
	var element;
	var elementID = "";
	var elementID_0 = "";
	for (var i = 0; i < aantalItems; i++) {
		elementID += arraySplitID[i];
		// Als 'elementID' bestaat, selecteren... (misschien is topniveau bijv. nivo1_2 i.p.v. nivo1)
		element = document.getElementById(elementID)
		if (element) {
			select(element)
		}

		// Als element 'elementID_0' bestaat, tonen...
		elementID_0 = elementID + "_0";
		element = document.getElementById(elementID_0);

		if (element) {
			document.getElementById(elementID_0).style.display='';
		}
	}
}

function getGroep(ID) {
	/*	De groep bepalen door alles voor het eerste, eventuele '_'-teken te bepalen.
		Vervolgens het laatste teken verwijderen.
		Bijv. de volgende ID's horen allemaal bij de groep 'plaat': plaat1, plaats, plaat1_2_1, plaats_2_3.
		De ID's 'plaat12' en 'plaatsen' niet.
	*/
	var arraySplitID = ID.split("_");
	var groep = arraySplitID[0];
	groep = groep.substring(0, groep.length-1);
	return groep;
}

function getArrayOfTags(tag, groep) {
	// We zoeken naar alle elementen met de tag 'tag' EN elementen met de tag '<a>...

	allTags = document.getElementsByTagName(tag);

	allTagsA = document.getElementsByTagName("a");

	var allTagsGroep = [];
	var j = 0;
	for (var i = 0; i < allTags.length; i++) {
		if (getGroep(allTags[i].id) == groep) {
			allTagsGroep[j] = allTags[i];
			j++;
		}
	}

	for (var i = 0; i < allTagsA.length; i++) {
		if (getGroep(allTagsA[i].id) == groep) {
			allTagsGroep[j] = allTagsA[i];
			j++;
		}
	}

	return allTagsGroep;
}

function unSelect(element) {
	var strClass = element.className;
	if (strClass.substring(0, 2) != "un") {
		// 'un' toevoegen class...
		element.className = "un" + strClass;
	}
}

function select(element) {
	var strClass = element.className;
	if (strClass.substring(0, 2) == "un") {
		// 'un' verwijderen van class...
		element.className = strClass.substring(2);
	}
}