/* Pagina frame informatie
------------------------------------------------------------------*/
function getFrameSize(dW, dH) {
	doc = document;
	
	// Scrollbar
	var x,y;
	if (self.pageYOffset) {
		// all except Explorer
		x = self.pageXOffset;
		y = self.pageYOffset;
	} else if (doc.documentElement && doc.documentElement.scrollTop) {
		// Explorer 6 Strict
		x = doc.documentElement.scrollLeft;
		y = doc.documentElement.scrollTop;
	} else if (doc.body) {
		// all other Explorers
		x = doc.body.scrollLeft;
		y = doc.body.scrollTop;
	}
	
	// Page frame size
	if (self.innerWidth) {
		// all except Explorer
		fWidth = self.innerWidth;
		fHeight = self.innerHeight;
	} else if (doc.documentElement && doc.documentElement.clientWidth) {
		// Explorer 6 Strict
		fWidth = doc.documentElement.clientWidth;
		fHeight = doc.documentElement.clientHeight;
	} else if (document.body) {
		// all other Explorers
		fWidth = doc.body.clientWidth;
		fHeight = doc.body.clientHeight;
	}
	
	if (fWidth && fHeight) {
		return {fW: fWidth, sW: fWidth + x, fH: fHeight, sH: fHeight + y, sL: x, sT: y};
	}
	return {fW: dW, sW: dW + x, fH: dH, sH: dH + y, sL: x, sT: y};
}


/* Picture view
------------------------------------------------------------------*/
function PicView() {
	this.pointerX = false;
	this.pointerY = false;
	this.allow = (document.images ? true : false);
	
	this.div = false;
	this.img = false;
	this.src = false;
	
	this.ele = false;
	this.hide = false;
	
	this.frame = false;
	this.funcError = false;
}
PicView.prototype.show = function(e, src, hide, funcError) {
	this.src = src;
	this.hide = hide;
	if (funcError) {
		this.funcError = new Function(funcError);
	}
	
	if (this.allow) {
		if (!e) var e = window.event;
		this.pointerX = e.clientX;
		this.pointerY = e.clientY;
		
		this.ele = (e.srcElement ? e.srcElement : e.target);
		if (!this.ele.onmouseout) {
			this.ele.onmouseout = function() { pV.div.style.display = 'none'; };
		}
		
		if (!this.div) {
			// Afbeelding frame
			this.div = document.createElement('div');
			with (this.div.style) {
				position = 'absolute';
				backgroundColor = 'white';
				border = 'dashed 1px #ccc';
				padding = '5px';
			}
						
			document.body.appendChild(this.div);
		}
		
		// Browser frame grootte
		this.frame = getFrameSize(2000, 2000);
	
		// Afbeelding frame tonen
		with (this.div.style) {
			top = (this.pointerY + this.frame.sT) + 'px';
			left = (this.pointerX + 15 + this.frame.sL) + 'px';
			display = '';
		}
		
		this.div.innerHTML = 'Bezig met laden...';
		this.img = document.createElement('img');
		this.img.onload = function() { pV.loaded();	}
		this.img.onerror = function() { pV.error(); }
		this.img.src = this.src;
	}
}
PicView.prototype.loaded = function() {
	// Maximale afbeelding grote
	imgShrink(this.img, 500, 500);
	
	// Overschrijding browser frame verticaal
	picHeight = (this.img.height + 12);
	picBottom = (picHeight + (this.pointerY + this.frame.sT));
	if (picBottom > this.frame.sH) {
		newTop = (this.pointerY + this.frame.sT);
		newTop -= (picBottom - this.frame.sH);
		this.div.style.top = (newTop - 24) + 'px';
	}
	
	// Overschrijding browser frame horizontaal
	if (this.pointerX > 194) {
		picWidth = (this.img.width + 32);
		picRight = (picWidth + (this.pointerX + this.frame.sL));
		if (picRight > this.frame.sW) {
			newLeft = (this.pointerX + this.frame.sL);
			newLeft -= picWidth;
			this.div.style.left = (newLeft - 15) + 'px';
		}
	}

	while (this.div.hasChildNodes()) {
		this.div.removeChild(this.div.firstChild);
	}
	this.div.appendChild(this.img);
}
PicView.prototype.error = function() {
	if (this.hide) {
		this.ele.style.display = 'none';
	}
	
	if (this.funcError) {
		this.funcError();
	} else {
		this.div.innerHTML = 'De afbeelding is niet gevonden...';
	}
}

pV = new PicView();


/*------------------------------------------------------------------
Afbeelding
------------------------------------------------------------------*/
function imgShrink(ele, usewidth, useheight, checksize) {
	if (usewidth == 0) {
		usewidth = 70;
	}
	if (useheight == 0) {
		useheight = 60;
	}
	
	if (ele.width > usewidth) {
		ele.height = ((usewidth / ele.width) * ele.height); 
		ele.width = usewidth; 
	}
	
	if (ele.height > useheight) {
		ele.width = ((useheight / ele.height) * ele.width); 
		ele.height = useheight; 
	}
	
	if (checksize) {
		var checkImage = new Image();
		checkImage.src = ele.src;
			
		if (checkImage.width < ele.width) {
			ele.width = checkImage.width;
		}
		if (checkImage.height < ele.height) {
			ele.height = checkImage.height;
		}
	}
}

function imgNo(ele, bgColor) {
	ele.src = '/images/noimage_' + bgColor + '.gif';
	ele.style.width = '60px';
	ele.style.height = '60px';
	ele.onmouseover = 'return false';
	ele.onmouseout = 'return false';
}

function imgHoverNo(id, bgColor) {
	if (eleId(id)) {
		ele = eleId(id);
		ele.src = '/images/noimage_' + bgColor + '.gif';
	}
}

function imgError(sNr, bgColor) {
	trId = 'tr-' + sNr;
	trEle  = eleId(trId);
	
	imgId = 'img-' + sNr;
	imgEle = eleId(imgId);
	if (trEle && imgEle) {
		imgNo(imgEle, bgColor);
		
		if (pV && pV.div) {
			pV.div.style.display = 'none';
		}
		if (trEle.addEventListener) {
			trEle.addEventListener("mouseover", function(event){imgHoverNo(imgId, 'e5f2f8');},false);
			trEle.addEventListener("mouseout", function(event){imgHoverNo(imgId, bgColor);},false);	
		} else if (trEle.attachEvent) {
			trEle.attachEvent("onmouseover", function(event){imgHoverNo(imgId, 'e5f2f8');});
			trEle.attachEvent("onmouseout", function(event){imgHoverNo(imgId, bgColor);});
		}
	}
}