//get viepoint width + height

 var viewportwidth;
 var viewportheight;
 
 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
 
 if (typeof window.innerWidth != 'undefined')
 {
      viewportwidth = window.innerWidth,
      viewportheight = window.innerHeight
 }
 
// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)

 else if (typeof document.documentElement != 'undefined'
     && typeof document.documentElement.clientWidth !=
     'undefined' && document.documentElement.clientWidth != 0)
 {
       viewportwidth = document.documentElement.clientWidth,
       viewportheight = document.documentElement.clientHeight
 }
 
 // older versions of IE
 
 else
 {
       viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
       viewportheight = document.getElementsByTagName('body')[0].clientHeight
 }

//viewportheight-=30;
//if(viewportheight > 500) viewportheight=500;

// CONFIG //////////////////////////////////////////////////////////////

thumbClass = "zoom" // the html class of the thumbnails
// ie. if you set this to "gallery" then you can invoke the zoomer on an img like this: <img src="myIm.gif" class="gallery" />

/* text
-------------------------*/
loadingMsg = "Laden..."; // text or image for the image loading message
clickMsg = "Vergr&ouml;&szlig;ern"; // message that appears on thumb mouseover
goBackMsg = "Zur&uuml;ck zur &Uuml;bersicht"; // go back to page message that appears under full size image

/* styles
-------------------------*/
// full size img viewer styles
loadingMsgTxtColr = "#555555" // loading message text color
viewerBgColr = "#333333"	// bg color of full size image viewer
viewerBgOpacity = "0.75" // 0-1 (1=100%)
goBackMsgTxtColr = "#ffffff" // go back message text color
// click me msg styles
clickMeTxtColr = "#888888"
clickMeBgColr = "#e0e4e7"
clickMeOpacity = "0.7"

/* action speeds
-------------------------*/  
// NB. the presets fast,slow and normal must be enclosed in speach marks but milisecond numbers must not
viewerBgFadeInSpeed = "fast" // speed that the viewer bg fades in // fast,slow,normal or time in miliseconds
viewerImgFadeInSpeed = "slow" // speed that the full size img fades in // fast,slow,normal or time in miliseconds
viewerImgFadeOutSpeed = 1000 // speed that the full size img fades out // fast,slow,normal or time in miliseconds


/* ::::::::::::: DON'T EDIT BELOW THIS LINE 
////////////////////////////////////////////////////////////////////////////
------------------------------------------ */
function doGallerySetStyles(){
	$("#galleryImViewer").css({
		position:"fixed",
		textAlign:"center",
		top:"0px",
		left:'0px',
		width:"100%",
		height:"100%",
		display:"none",
		zIndex:"250",
		color:goBackMsgTxtColr	
	});
	$("#galleryImViewerBg").css({
		position:"fixed",
		textAlign:"center",
		top:"0px",
		left:'0px',
		width:"100%",
		height:"100%",
		display:"none",
		zIndex:"200",
		color:loadingMsgTxtColr,
		fontWeight:"bold",
		backgroundColor:viewerBgColr	
	});
	$("#galleryClickMe").css({
		backgroundColor:clickMeBgColr,
		position:"absolute",
		display:"none",
		color:clickMeTxtColr,
		opacity:clickMeOpacity
	})
}
function doGalleryClickMeNote(e){
	$("#galleryClickMe").css({left:e.pageX+10,top:e.pageY+10})
}
function doGalleryShowIm(el){
	$("#galleryImViewerBg").css({opacity:viewerBgOpacity}).fadeIn(viewerBgFadeInSpeed)
	$("#galleryImViewer img").attr("src",el.attr("src").replace("/tn/","/"))
	$("#galleryImViewer,#galleryImViewerBg").css({height:$(window).height()})
	$("#galleryImViewer img").load(function(){
		$("#galleryImViewer").fadeIn(viewerImgFadeInSpeed);
	})
}
function doGalleryHideIm(){
	$("#galleryImViewerBg").hide()
	$("#galleryImViewer").fadeOut(viewerImgFadeOutSpeed)
}

$(document).ready(function(){
	
	$("body").append("<table id='galleryImViewerBg'><tr><td>"+loadingMsg+"</td></tr></table>"+
	"<table id='galleryImViewer'><tr><td width='98%'><img src='' height='"+viewportheight+"'/><br/>"+goBackMsg+"</td></tr></table>"+
	"<span id='galleryClickMe'>"+clickMsg+"</span>");
	
	doGallerySetStyles();
	$(".zoom").click(function(){
		doGalleryShowIm($(this))
	})
	$("."+thumbClass+", #galleryImViewer").css({cursor:"pointer"})
	
	$("#galleryImViewer").click(function(){
		doGalleryHideIm()
	})
	
	$("."+thumbClass).mousemove(function(e){
		doGalleryClickMeNote(e)
	})
	
	$("."+thumbClass).mouseover(function(){
		$("#galleryClickMe").show()
	})
	
	$("."+thumbClass).mouseout(function(){
		$("#galleryClickMe").hide()
	})
	
})