function hideOverlay() {
	
	if($('overlayCloseIcon')) {
		$('overlayCloseIcon').stopObserving('click');	
	}
	
	if($('overlayImage')) {
		$('overlayImage').stopObserving('click');	
	}
			
	$('overlay').setStyle({display: 'none'});
	$('overlayContent').setStyle({display: 'none'});
	
	$('overlayContent').update('');

	preLrgImg = null;
			
}

function getScrollY() {
				
  	var scrOfY = 0;
  	
  	if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    	scrOfY = window.pageYOffset;
  	} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    	scrOfY = document.body.scrollTop;
  	} else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
   		//IE6 standards compliant mode
    	scrOfY = document.documentElement.scrollTop;
  	}
	return scrOfY;
  			
}

function magnifierIn(obj) {
			
	var offsets = $(obj).cumulativeOffset();
				
	offsets[0] = offsets[0] - 15;
				
	$('overlayMagnifier').setStyle({position: 'absolute', top: offsets[1] + 'px', left: '54px', display: 'block', cursor:'pointer'});
	
	id = obj.substr(5,23);

	loadImg = new Image();
	loadImg.src = $('image' + id).readAttribute('src').substr(0,35) + 'large.jpg';
			
	$('overlayMagnifier').observe('click', function() {
		
		$('overlayMagnifier').stopObserving('click');

		showOverlay(id);		

	});
		
}
			
function magnifierOut() {
				
	$('overlayMagnifier').setStyle({display: 'none'});	
				
}

function switchTo(id, step, max, link, itemid){

	var imageInt = $('image' + id).readAttribute('src').substr(33,1);
			
	var newInt = parseInt(imageInt) + step;
			
	if (newInt < 1) { newInt = max; }
	if (newInt > max) { newInt = 1; }
	
	timer = new PeriodicalExecuter(function(){fadeOut(id, newInt, link, itemid)}, 0.024);
		
}

var timer;
var i = 1.0;

function fadeIn(id, link, itemid) {

		i = i + 0.05;
		$('image' + id).setOpacity(i);
	
		if(i >= 1.0) {
			timer.stop();			
		
			Event.observe(itemid, 'click', function(event){
						
				Event.stopObserving(itemid);
							
				max = itemid.substr(1,1);
				id = itemid.substr(3,23);
						
				switchTo(id, 1, max, link, itemid);	
			
			});	

		}
		
}

function fadeOut(id, newInt, link, itemid) {
	
		i = i - 0.05;
		$('image' + id).setOpacity(i);
	
		if(i <= 0.0) {
			timer.stop();
			$('image' + id).writeAttribute('src', 'img/upload/' + id + newInt + '-small.jpg');
			timer = new PeriodicalExecuter(function(){fadeIn(id, link, itemid)}, 0.024);
		}	
}

function showOverlay(id) {
			
	imgsrc = parseInt($('image' + id).readAttribute('src').substr(33, 1)) - 1;
	var imgoffset = getScrollY() + 2;

	imgcount = $('imgcount'+id).getValue();

	preLrgImg = new Array();

    images = new Array();

	for(i=0; i<imgcount; i++) {
		 images[i] = 'img/upload/'+id+(i+1)+'-large.jpg';	
	}

    for(i=0; i<imgcount; i++) {
    	preLrgImg[i] = new Image();
        preLrgImg[i].src = images[i];
    }

	images = null;
	
	$('overlay').setOpacity(0.5);
	
	$('overlay').setStyle({display: "block"});
	$('overlayContent').setStyle({top: imgoffset + 'px', display: 'block'});

	setNewImage(preLrgImg[imgsrc], imgsrc);
	
				
}

function switchLrgImage(img, direction, imgsrc) {
	
	$('overlayForwardIcon').stopObserving('click');
	$('overlayBackIcon').stopObserving('click');

	if(typeof(imgid)=="undefined") {
 		imgid = parseInt(imgsrc);
	}

	max = parseInt(preLrgImg.length) - 1;
	
	if(direction == 'forward') {
		if(imgid < max) {
			imgid = imgid + 1;	
		}
		else if (imgid == max) {
			imgid = 0;
		}			
	}
	else {
		if(imgid >= 1) {
			imgid = imgid - 1;	
		}
		else if (imgid == 0) {
			imgid = max;
		}	
	}

	setNewImage(preLrgImg[imgid]);
	
}

function setNewImage(img, imgsrc) {
	
		setLeft = (($('overlayContent').getWidth() - img.width) / 2);
				
		imgcode = "<span id='overlayImageContainer' style='position: absolute; left:"+ setLeft +"px; top:0px;'><img id='overlayImage' src='"+img.src+"' style='border: solid 5px black;' alt='Vergr&ouml;&szlig;ertes Bild' /><img id='overlayBackIcon' style='position: absolute; z-index: 13; left: 16px; top: 8px;' src='img/back.png' alt='Vorheriges Bild'/><img id='overlayForwardIcon' style='position: absolute; z-index: 13; left: 54px; top: 8px;' src='img/forward.png' alt='N&auml;chstes Bild'/><img id='overlayCloseIcon' style='position: absolute; z-index: 13; right: 8px; top: 8px;' src='img/closeIcon.png' alt='Bild schlie&szlig;en'/></span>";
				
		$('overlayContent').update(imgcode);	
		
		$('overlayCloseIcon').setStyle({cursor:"pointer"});			
		$('overlayForwardIcon').setStyle({cursor:"pointer"});			
		$('overlayBackIcon').setStyle({cursor:"pointer"});

		Event.observe('overlayCloseIcon', 'click', hideOverlay);
		Event.observe('overlayForwardIcon', 'click', switchLrgImage.curry(img, 'forward', imgsrc), false);
		Event.observe('overlayBackIcon', 'click', switchLrgImage.curry(img, 'back', imgsrc), false);
		Event.observe('overlayImage', 'click', hideOverlay);
		
}
