// LET OP: dit is helemaal geen 'lightbox' script, gebruikt gewone mouseover met preload :)

var titels = new Array();
var teksten = new Array();

function niks (){
	alert('a');
	return true;
}

function toon (beeld,index){// mouseover code
	x = new getObj('portfolio_img');
	x.obj.src = beeld;
	x = document.getElementById('title');
	x.innerHTML = '';
	x.innerHTML = titels[index];
	x = document.getElementById('description');
	x.innerHTML = '';
	x.innerHTML = teksten[index];
//	x.innerHTML = '<p>bla</p>';
//	alert(y);
//	alert(teksten[tekstindex]);
	return
}

function attach (){// attach mouseover code aan de thumbnails
if (!document.getElementsByTagName){ return; }
//alert('ok');
		var anchors = document.getElementsByTagName('a');

		var eerste = false; // voor eerste portfolio beeld (dat wordt meteen getoond, hoeft niet index i=0 te hebben, vndaar deze var)
		// loop through all anchor tags
		var j = 0; // index voor de img's die een 'rel' attribuut hebben - loopt van 0-7 (= max aantal thumbs)
		for (var i=0; i<anchors.length; i++){
			var anchor = anchors[i];
			var beelden = new Array;
			var relAttribute = String(anchor.getAttribute('rel'));
			
			// use the string.match() method to catch 'lightbox' references in the rel attribute
			if (anchor.getAttribute('href') && (relAttribute.toLowerCase().match('lightbox'))){
				source = anchor.getAttribute('href');
				titel = anchor.getAttribute('title');
				tekst = anchor.getAttribute('alt');
				//website = anchor.getAttribute('rev');
				//if (website) anchor.setAttribute('href', website);
				//alert(tekst);
				beelden[j] = newImage(source);
				titels[j] = titel;
				teksten[j] = tekst;
				if (!eerste) {eerste = true; toon(source,j)};
				//anchor.onclick = function () {niks()}
				// onderstaand lelijk, maar hoe anders de waarde van j meegeven aan de attached functie?
				// dit: toon(this,j) werkt niet, want dan wordt var 'j' meegeveven en niet de waarde van j op dit moment
				switch (j){
					case 0:
						anchor.onmouseover = function () {toon(this,0);}
						break;
					case 1:
						anchor.onmouseover = function () {toon(this,1);}
						break;
					case 2:
						anchor.onmouseover = function () {toon(this,2);}
						break;
					case 3:
						anchor.onmouseover = function () {toon(this,3);}
						break;
					case 4:
						anchor.onmouseover = function () {toon(this,4);}
						break;
					case 5:
						anchor.onmouseover = function () {toon(this,5);}
						break;
					case 6:
						anchor.onmouseover = function () {toon(this,6);}
						break;
					case 7:
						anchor.onmouseover = function () {toon(this,7);}
						break;
				}
				j++;
				//alert(j);
			}
		}
}

function getStyle(el,styleProp)
{
	var x = document.getElementById(el);
	return x.offsetHeight;
/*	if (x.currentStyle)
		var y = x.currentStyle[styleProp];
	else if (window.getComputedStyle)
		var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp);
	return y;
*/
}

function sizedivs (){// deze functie past de ondermarge van het actieve hoofdmenuitem aan, zodat het submenu genoeg ruimte krijgt
if (document.getElementById('body_4')){
	y = getStyle('inhoud','height');
	x = new getObj('uid4');
//	alert(y);
	x.style.marginBottom = parseInt(y) + 'px';
}
else if (document.getElementById('body_6')){
	y = getStyle('catlist','height');
	x = new getObj('uid6');
	x.style.marginBottom = parseInt(y) + 'px';
}
else if (document.getElementById('body_7')){
	y = getStyle('catlist','height');
	x = new getObj('uid7');
	x.style.marginBottom = parseInt(y) + 'px';
}
else if (document.getElementById('body_8')){
	y = getStyle('catlist','height');
	x = new getObj('uid8');
	x.style.marginBottom = parseInt(y) + 'px';
}
else if (document.getElementById('body_32')){
	y = getStyle('catlist','height');
	x = new getObj('uid32');
	x.style.marginBottom = parseInt(y) + 'px';
}

//	alert(y);
//	alert(x.style.marginBottom);
//	y = getStyle('uid4','marginBottom');
//	alert(y);
	
}

function inital (){
	attach();
	sizedivs();
}	

Event.observe(window, 'load', inital, false);