window.onresize = function(){
	if ($("overlay").visible()) {
		// resize overlay
		var h=document.viewport.getHeight();
		var w=document.viewport.getWidth();
		var scroll=document.viewport.getScrollOffsets()
		var wh=$("body").getHeight();
		document.getElementById("overlay").style.height = wh + "px";
		document.getElementById("overlay").style.width = w + "px";

		// place image
		var imgw= scroll.left + ((w/2) - ($("displayimg").getWidth()/2));
		var imgh= scroll.top + ((h/2)- ($("displayimg").getHeight()/2));

		$("displaybox").setStyle("top:"+imgh+"px;");
		$("displaybox").setStyle("left:"+imgw+"px;");
	}

}


var Toggle = function(opt){
	var o = opt;

	var load = function() {
		var elem = $('displaybox');
		if (elem == null) return true;
		var elem = $('overlay');
		if (elem == null) return true;
		$("overlay").toggle();
		$("displaybox").toggle();
		$A(o.selector).each(function(s) {
			$$(s).each(
				function(i) {
					var os = i.src, ni = document.createElement('img'), blank=document.createElement('img');
					blank.src='/none.gif';
					ni.src=o.srcFunction(i);
					$(i).observe('click', function(e){
						try {
							if ($("overlay").visible()) {
								$("overlay").toggle();
								$("displaybox").toggle();
								$("displayimg").src = blank.src;
							} else {
								$("displayimg").src = ni.src;
								var h=document.viewport.getHeight();
								var w=document.viewport.getWidth();
								var scroll=document.viewport.getScrollOffsets();
								var wh=$("body").getHeight();
								document.getElementById("overlay").style.top = 0 + "px";
								document.getElementById("overlay").style.left = 0 + "px";
								document.getElementById("overlay").style.height = wh + "px";
								document.getElementById("overlay").style.width = w + "px";
								var imgw= scroll.left + ((w/2) - (ni.width/2));
								var imgh= scroll.top + ((h/2)- (ni.height/2));
								$("displaybox").setStyle("top:"+imgh+"px;");
								$("displaybox").setStyle("left:"+imgw+"px;");
								$("overlay").toggle();
								$('displaybox').toggle();
							}
						}
						catch(err){}
					});
					$(i).observe('mouseover', function(e){
						$(i).setStyle({cursor:'pointer'});
					});
					$(i).observe('mouseout', function(e){
						$(i).setStyle({cursor:'auto'});
					});


				}
			);
		});

		$("displaybox").observe('click', function(e){
			blank=document.createElement('img')
			blank.src='/none.gif';
			$("displayimg").src = blank.src;
			$("overlay").toggle();
			$("displaybox").toggle();
		});

		$("displaybox").observe('mouseover', function(e){
			$("displaybox").setStyle({cursor:'pointer'});
		});
		$("displaybox").observe('mouseout', function(e){
			$("displaybox").setStyle({cursor:'auto'});
		});

	};
	Event.observe(window, 'load', load);

}

Toggle({
	selector : ['img.galerie'],
	srcFunction : function(i) {
		return i.src.replace(/(.*)\.(jpg|gif|png)$/i, "$1_big.$2");
	}
});