var imageLayer = null;
var maskLayer = null;

function showImage(modellNummer, sCloseLink, imgHeight) {
	if (imgHeight==null) {
    imgHeight = 360;
  }else{
    imgHeight = imgHeight + 60;
  }
  if (!imageLayer) {
		imageLayer = document.createElement("div");
		imageLayer.id = 'image-layer';
		imageLayer.style.position = 'absolute';
		imageLayer.style.width = '830px';
		imageLayer.style.height = imgHeight + 'px';
		imageLayer.style.top = 0;
		imageLayer.style.left = 0;
		imageLayer.style.backgroundColor = 'white';
		imageLayer.style.border = '5px solid black';
		imageLayer.style.zIndex = '1000';
		imageLayer.onclick = hideImage;
		imageLayer.style.cursor = 'pointer';
		document.body.appendChild(imageLayer);
		onmousewheel(imageLayer, function(delta) {  });
	}
	
	var innerHeight = window.innerHeight | document.body.clientHeight;
	var innerWidth = window.innerWidth | document.body.clientWidth;

	var scrollPosition = 0;
	if( typeof( window.pageYOffset ) == 'number' ) {
		//Netscape compliant
		scrollPosition = window.pageYOffset;
	} else if (document.body && document.body.scrollTop) {
		//DOM compliant
		scrollPosition = document.body.scrollTop;
	} else if (document.documentElement && document.documentElement.scrollTop) {
		//IE6 standards compliant mode
		scrollPosition = document.documentElement.scrollTop;
	}
	document.getElementById('lightbox-bg').style.display = 'block';
	document.getElementById('lightbox-bg').style.top = scrollPosition + 'px';
	imageLayer.style.left = (innerWidth - 850) * 0.5 + 'px';
	imageLayer.style.top = scrollPosition + (innerHeight - 330) * 0.25 + 'px';
	var imgSrc = './resources/images/artikel/' + modellNummer + '.jpg';
	var html = '<img style="margin: 15px;" src="' + imgSrc + '" /><br />';
	html += '<a href="javascript: hideImage()" style="color: black; margin-left: 15px;">'+ sCloseLink +'</a>';
	imageLayer.innerHTML = html;
	imageLayer.style.display = 'block'
}

function hideImage() {
	imageLayer.style.display = 'none';
	document.getElementById('lightbox-bg').style.display = 'none';
}

/**
 * function onmousewheel,
 *	onmousewheel(element:Object [, callback:Function]):Void
 * @param	Object		window, document or DOM.element to use with callback
 * @param	Function	callback function with element scope (.call(...)) and delta wheel value as single parameter
 * @return	Void
 */
function onmousewheel(element, callback) {
		
	// @author	Andrea Giammarchi		[http://www.devpro.it/]
	// @license	MIT 				[http://www.opensource.org/licenses/mit-license.php]
	// @credits	Adomas Paltanavicius 		[http://adomas.org/javascript-mouse-wheel/]
	
	function __onwheel(event) {
		var	delta = 0;
		if(event.wheelDelta) {
			delta = event.wheelDelta / 120;
			if(window.opera)
				delta = -delta;
		}
		else if(event.detail)
			delta = -event.detail / 3;
		if(delta)
			callback.call(element, delta);
		if(event.preventDefault)
			event.preventDefault();
		event.returnValue = false;
		return false;
	};
	
	if(element.addEventListener && !window.opera)
		element.addEventListener("DOMMouseScroll", __onwheel, false);
	else
		element.onmousewheel = (function(base){return function(evt){
			if(!evt) evt = window.event;
			if(base) base.call(element, evt);
			return __onwheel(evt);
		}})(element.onmousewheel);
};