var imagewidth1;
	var imageheight1;
	var zooming1 = false;
	var imageLoaded1 = false;
	
	function loadImage(obj, image)
	{
		obj.getElementsByTagName('img')[0].src = image;
	}
	
	function imageload1(imagebox, obj)
	{
		if (imageLoaded1 == false)
		{
			imagewidth1 = obj.width;
			imageheight1 = obj.height;
			imagebox.style.cursor = "url('/img/enlarge.cur'), crosshair";
			imageLoaded1 = true;
		}
	}
	
	function doPan1(obj, event)
	{
		if (imageLoaded1)
		{
			var mouseX = event.clientX-obj.viewportOffset()[0];
			var mouseY = event.clientY-obj.viewportOffset()[1];
			obj.getElementsByClassName('imagezoom')[0].style.left = ((mouseX/obj.getWidth()*imagewidth1)-mouseX)*-1 + "px";
			obj.getElementsByClassName('imagezoom')[0].style.top = ((mouseY/obj.getHeight()*imageheight1)-mouseY)*-1 + "px";
		}
	}
	
	function zoom1(obj)
	{
		if (imageLoaded1)
		{
			if (zooming1)
			{
				obj.getElementsByClassName('imagezoom')[0].style.visibility = 'hidden';
				obj.style.cursor = "url('/img/enlarge.cur'), crosshair";
				zooming1 = false;
			}
			else
			{
				obj.getElementsByClassName('imagezoom')[0].style.visibility = 'visible';
				obj.style.cursor = "url('/img/reduce.cur'), crosshair";
				zooming1 = true;
			}
		}
	}
	
	var imagewidth2;
	var imageheight2;
	var zooming2 = false;
	var imageLoaded2 = false;

	function imageload2(imagebox, obj)
	{
		if (imageLoaded2 == false)
		{
			imagewidth2 = obj.width;
			imageheight2 = obj.height;
			imagebox.style.cursor = "url('/img/enlarge.cur'), crosshair";
			imageLoaded2 = true;
		}
	}
	
	function doPan2(obj, event)
	{
		if (imageLoaded2)
		{
			var mouseX = event.clientX-obj.viewportOffset()[0];
			var mouseY = event.clientY-obj.viewportOffset()[1];
			obj.getElementsByClassName('imagezoom')[0].style.left = ((mouseX/obj.getWidth()*imagewidth2)-mouseX)*-1 + "px";
			obj.getElementsByClassName('imagezoom')[0].style.top = ((mouseY/obj.getHeight()*imageheight2)-mouseY)*-1 + "px";
		}
	}
	
	function zoom2(obj)
	{
		if (imageLoaded2)
		{
			if (zooming2)
			{
				obj.getElementsByClassName('imagezoom')[0].style.visibility = 'hidden';
				obj.style.cursor = "url('/img/enlarge.cur'), crosshair";
				zooming2 = false;
			}
			else
			{
				obj.getElementsByClassName('imagezoom')[0].style.visibility = 'visible';
				obj.style.cursor = "url('/img/reduce.cur'), crosshair";
				zooming2 = true;
			}
		}
	}
	
	var crtImage = 1;
	var totalImages = 0;
	function showImage(dir)
	{
		if (totalImages == 0)
			totalImages = $('column1').select('.imagebox').length-1;
		
		// originele positie
		if (zooming1)
			zoom1($('imagebox'+crtImage));

		if (zooming2)
			zoom2($('imagebox'+crtImage));

		imageLoaded1 = false;
		imageLoaded2 = false;
	
		// dir = 1 of -1
		if (dir == 1)
		{
			$('imagebox' + (crtImage-1)).removeClassName('display');
			crtImage += dir;
			$('imagebox' + crtImage).addClassName('display');
		}
		if (dir == -1)
		{
			$('imagebox' + crtImage).removeClassName('display');
			crtImage += dir;
			$('imagebox' + (crtImage-1)).addClassName('display');
		}
		
		
		$('prevImage').addClassName('display');
		$('nextImage').addClassName('display');
		
		if (crtImage == 1)
			$('prevImage').removeClassName('display');
		if (crtImage == totalImages)
			$('nextImage').removeClassName('display');
	}