// GENERAL

var txtOut = Array();

txtOut['de'] = new Object(); ////////////////////////////////////// DEUTSCH
txtOut['de'][0] = "Hier klicken um zu vergrößern";
txtOut['de'][1] = "weiter";
txtOut['de'][2] = "nägstes Bild anzeigen";
txtOut['de'][3] = "zurück";
txtOut['de'][4] = "vorheriges Bild anzeigen";
txtOut['de'][5] = "schließen";
txtOut['de'][6] = "Fenster schleißen";

txtOut['fr'] = new Object(); ////////////////////////////////////// DEUTSCH
txtOut['fr'][0] = "cliquez ici pour agrandir l'image";
txtOut['fr'][1] = "suivant";
txtOut['fr'][2] = "afficher l'image suivante";
txtOut['fr'][3] = "retour";
txtOut['fr'][4] = "afficher l'image precedente";
txtOut['fr'][5] = "fermer";
txtOut['fr'][6] = "fermer fenetre";

// LAYOUT

var fadeToColor = "#000000";
var containerColor = "#FFFFFF";
var containerBorder = 10;
var fontColor = "#444444";
var fontSize = "12px";

//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// END EDITABLE PART
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

var countW = 0;
var countH = 0;
var widthReady = false;
var heightReady = false;
var resizeStepsW = null;
var resizeStepsH = null;

function resizeDiv(){
	if(resizeStepsW == null){
		if(imageTdObj != null) imageTdObj.style.backgroundImage = "";
		containerObj.style.visibility = "visible";
		clipWidth = parseInt(containerObj.style.width);
		clipHeight = parseInt(containerObj.style.height);
		resizeStepsW = getSteps(clipWidth,curImgWidth);
		resizeStepsH = getSteps(clipHeight,curImgHeight+28);
	}
	if(resizeStepsW != null && resizeStepsH != null){
		var clipLeft = parseInt(containerObj.style.left);
		var clipTop = parseInt(containerObj.style.top);
		clipWidth = parseInt(containerObj.style.width);
		clipHeight = parseInt(containerObj.style.height);
		
		if (countW < resizeStepsW.length){
			containerObj.style.width = resizeStepsW[countW]+"px";
			countW++;
		}else{
			containerObj.style.width = curImgWidth+"px";
			widthReady = true
		}
		containerObj.style.left = parseInt(clipLeft - ((parseInt(containerObj.style.width)-clipWidth) /2));
		
		if (countH < resizeStepsH.length){
			containerObj.style.height = resizeStepsH[countH]+"px";
			countH++;
		}else{
			containerObj.style.height = (curImgHeight+28)+"px";
			heightReady = true;
		}
		containerObj.style.top = parseInt(clipTop - ((parseInt(containerObj.style.height)-clipHeight) /2));
		
		//alert(containerObj.style.top +" "+ resizeStepsH[countH]);
		if(heightReady && widthReady){
			window.clearInterval(interval); 
			resteResizer();
			InsertImage();
			return false;
		}
	}
}

function getSteps(s,e){
	var resizeSteps = new Array();
	var i=0;
	if(s<e){
		for(var o=s; o<e; o+= parseInt(easeOut(o,e,2))){
			resizeSteps[i] = o;
			i++;
			if((e-o) < 5) return resizeSteps;
		}
	}else{
		for(var o=s; o>e; o+= parseInt(easeOut(o,e,2))){
			resizeSteps[i] = o;
			i++;
			if((o-e) < 5) return resizeSteps;
		}
	}
	return resizeSteps;
}

function resteResizer(){
	window.clearInterval(interval); 
	countW = 0;
	countH = 0;
	widthReady = false;
	heightReady = false;
	resizeStepsW = null;
	resizeStepsH = null;
}

////////////////////////////////////////////////////////////////////////////////////////////////////////// Umgebungsparameter

var clipWidth = 0;
var clipHeight = 0;

var windowWidth;
var windowHeight;

var windowCenterX;
var windowCenterY;

function onPageResize(){
	windowWidth = (isIE)? document.body.clientWidth : window.innerWidth;
	windowHeight = (isIE)? document.body.clientHeight : window.innerHeight;

	windowCenterX = (isIE)? (windowWidth/2)+document.body.scrollLeft : (windowWidth/2)+self.pageXOffset;
	windowCenterY = (isIE)? (windowHeight/2)+document.body.scrollTop : (windowHeight/2)+self.pageYOffset;
	
	//disableObj.style.width = document.body.scrollWidth < windowWidth? windowWidth+"px" : document.body.scrollWidth+"px";
	//disableObj.style.height =document.body.scrollHeight< windowHeight? windowHeight+"px" : document.body.scrollHeight+"px";
	
	var newClipLeft =  (windowCenterX-clipWidth/2);
	containerObj.style.left = newClipLeft;
	var newClipTop = (windowCenterY-clipHeight/2);
	containerObj.style.top = newClipTop;
	
	//alert(windowCenterX);
}

////////////////////////////////////////////////////////////////////////////////////////////////////////// BackgroundFader

var bgStep = 0;
var bgEndOpac = 0;

function bgFade(obj,newOpac){ // braucht ein object welches im style opacity besitet und einen alphawert zwischen 0-100;
	closeVar = true;
	obj.style.visibility = "visible";
	if(isIE) var clipOpacity = obj.filters.alpha.opacity;
	if(isW3C) var clipOpacity = parseFloat(obj.style.MozOpacity)*100;
	if(isOP) var clipOpacity = parseFloat(obj.style.opacity)*100;
	if(bgStep == 0){ 
		bgStep = parseInt((clipOpacity-newOpac)/3); 
		bgEndOpac = clipOpacity-(bgStep*3);
	}
	if (clipOpacity == bgEndOpac){
		window.clearInterval(interval);
		bgStep = 0;
		//obj.style.backgroundImage = "url('img/pre_loading.gif')";
		obj.style.backgroundPosition = (windowCenterX-80)+" "+(windowCenterY-80);
		if(loaded == true){
			obj.style.backgroundImage = "";
			interval = window.setInterval("resizeDiv()", 40);
			resized = true;
		}
		faded = true;
		return false;
	}
	if(isIE) obj.filters.alpha.opacity -= bgStep;
	if(isW3C) obj.style.MozOpacity -= bgStep/100;
	if(isOP) obj.style.opacity -= bgStep/100;
}

////////////////////////////////////////////////////////////////////////////////////////////////////////// ImageFader

var imStep = 0;
var imEndOpac = 0;

function imgFade(obj,newOpac){ // braucht ein object welches im style opacity besitet und einen alphawert zwischen 0-100;
	if(isIE) var clipOpacity = obj.filters.alpha.opacity;
	if(isW3C) var clipOpacity = parseFloat(obj.style.MozOpacity)*100;
	if(isOP) var clipOpacity = parseFloat(obj.style.opacity)*100;
	if(imStep == 0){ 
		imStep = parseInt((clipOpacity-newOpac)/3); 
		imEndOpac = clipOpacity-(imStep*3);
	}
	if (clipOpacity == imEndOpac){
		resetImgFade()
		return false;
	}
	if(isIE) obj.filters.alpha.opacity -= imStep;
	if(isW3C) obj.style.MozOpacity -= imStep/100;
	if(isOP) obj.style.opacity -= imStep/100;
}

function resetImgFade(){
	window.clearInterval(interval);
	imStep = 0;
}

////////////////////////////////////////////////////////////////////////////////////////////////////////// Bild & Nav einfügen 

function InsertImage(){
	var style = "font-family: Verdana, Arial, Helvetica, sans-serif; font-size: "+fontSize+"; color:"+fontColor+";cursor:hand;cursor:pointer;";
	
	var imagetab = "<table border=\"0\" width=\"100%\" height=\"100%\"cellspacing=\"0\" cellpadding=\"0\"><tr>";
	imagetab += "<td id=\"imageTd\" style=\"background-repeat: no-repeat;background-position: 50% 50%; opacity: 0;filter: alpha(opacity=0);-moz-opacity: 0;\"  align=\"center\">";
	imagetab += "<img style=\"border-left:"+containerBorder+"px solid "+containerColor+"; border-top:"+containerBorder+"px solid "+containerColor+"; border-right:"+containerBorder+"px solid "+containerColor+";\" src=\""+curImgPath+"\" /></td>";
	imagetab += "</tr><tr>";
	imagetab += "<td height=\"28\" >";
	
	var navNorm = "<table width=\"100%\"  border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><tr>";
	navNorm += "<td width=\"10\">&nbsp;</td>";
	navNorm += "<td style=\""+style+"\" onclick=\"nav('down')\" id=\"prevlabel\" title=\""+txtOut[lang][4]+"\">&lt; "+txtOut[lang][3]+"</td>";
	navNorm += "<td align=\"right\" style=\""+style+"\" onclick=\"closeVar = true; stopView();\" title=\""+txtOut[lang][6]+"\">"+txtOut[lang][5]+" x</td>";
	navNorm += "<td align=\"right\" width=\"75\" style=\""+style+"\" onclick=\"nav('up');\" id=\"nextlabel\"  title=\""+txtOut[lang][2]+"\">"+txtOut[lang][1]+" &gt;</td>";
	navNorm += "<td width=\"10\">&nbsp;</td>";
	navNorm += "</tr></table>";
	
	var navBegin = "<table width=\"100%\"  border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><tr>";
	navBegin += "<td width=\"10\">&nbsp;</td>";
	navBegin += "<td style=\""+style+"\" onclick=\"closeVar = true; stopView();\" title=\""+txtOut[lang][6]+"\">"+txtOut[lang][5]+" x</td>";
	navBegin += "<td align=\"right\" width=\"75\" style=\""+style+"\" onclick=\"nav('up');\" id=\"nextlabel\"  title=\""+txtOut[lang][2]+"\">"+txtOut[lang][1]+" &gt;</td>";
	navBegin += "<td width=\"10\">&nbsp;</td>";
	navBegin += "</tr></table>";
	
	var navEnd = "<table width=\"100%\"  border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><tr>";
	navEnd += "<td width=\"10\">&nbsp;</td>";
	navEnd += "<td style=\""+style+"\" onclick=\"nav('down')\" id=\"prevlabel\" title=\""+txtOut[lang][4]+"\">&lt; "+txtOut[lang][3]+"</td>";
	navEnd += "<td align=\"right\" style=\""+style+"\" onclick=\"closeVar = true; stopView();\" title=\""+txtOut[lang][6]+"\">"+txtOut[lang][5]+" x</td>";
	navEnd += "<td width=\"10\">&nbsp;</td>";
	navEnd += "</tr></table>";
	
	if(curNum == imgs.length-1 ){
		imagetab += navEnd;
	}else if(curNum == 0){
		imagetab += navBegin;
	}else{
		imagetab += navNorm;
	}
	
	imagetab += "</td></tr></table>";
	containerObj.innerHTML = imagetab;

	imageTdObj = document.getElementById("imageTd");
	interval = window.setInterval("imgFade(imageTdObj,100)", 40);
}

////////////////////////////////////////////////////////////////////////////////////////////////////////// VerlangsamungsRechnung

function easeOut(s, e, vario){
	var step = -(s - e)/vario;
	return step;
}

////////////////////////////////////////////////////////////////////////////////////////////////////////// Navigation

var curImgPath = null;
var curImgWidth = null;
var curImgHeight = null;

var interval = null;
var resized = false;
var faded = false;
var loaded = false;

var closeVar = null;
var curNum = null;

function nav(updown){
	resteResizer();
	resetImgFade();
	curNum = updown == "up"? curNum+1 : curNum-1;
	imageTdObj = document.getElementById("imageTd");
	imageTdObj.innerHTML = "&nbsp;";
	imageTdObj.style.backgroundImage = "url('img/wihteloadinglabel.gif')";
	loaded = false;
	resized = false;
	curImgWidth = null;
	curImgHeight = null;
	loadImg();
}

function loadImg(){
	var imgPreloader = null;
	imgPreloader = new Image();
	imgPreloader.onload = function(){
		curImgWidth = imgPreloader.width;
		curImgHeight = imgPreloader.height;
		curImgPath = imgs[curNum].lowsrc;
		if(curImgWidth != 0 && curImgWidth != null){ // Opera läd auch nicht gefundene dateien
			loaded = true;
			curImgWidth += containerBorder*2;
			curImgHeight += containerBorder;
		}
		if(!resized && faded){
			interval = window.setInterval("resizeDiv()", 40);
		}
	}
	imgPreloader.src = imgs[curNum].lowsrc;
}


function startView(img){
	onPageResize();
	for(var i=0;i<imgs.length;i++){
		if(imgs[i] == img){
			curNum = i;
		}
	}
	loaded = false;
	resized = false;
	faded = false;
	curImgWidth = null;
	curImgHeight = null;
	interval = window.setInterval("bgFade(disableObj,75)", 40);
	loadImg();
}

function stopView(){
	if(closeVar == true){
		window.clearInterval(interval);
		disableObj.style.backgroundImage = "";
		clipWidth = 0;
		clipHeight = 0;
		containerObj.style.visibility = "hidden";
		containerObj.innerHTML = "";
		containerObj.style.height = "1px";
		containerObj.style.width = "1px";
		containerObj.style.left = windowWidth/2+"px";
		containerObj.style.top = windowHeight/2+"px";
		disableObj.style.visibility = "hidden";
		if(isW3C)disableObj.style.MozOpacity = 0;
		if(isIE)disableObj.filters.alpha.opacity = 0;
		if(isOP)disableObj.style.opacity = 0;
		closeVar = false;
	}
}

function keyboardAction(e) {
	if(clipWidth != 0){
		if (isIE){ 
			keycode = event.keyCode;
		}else{ 
			keycode = e.which;
		}
		key = String.fromCharCode(keycode).toLowerCase();
		
		if((key == 'x') || (key == 'o') || (key == 'c')){ stopView();// close 
		} else if(key == 'p' || keycode == 37){ 	
			if(curNum > 0 ) nav('down'); // display previous image
		} else if(key == 'n' || keycode == 39){
			if(curNum != imgs.length-1 ) nav('up');// display next image
		}
	}
}

/////////////////////////////////////////////////////////////////////////////////////////////// Initialisieren

var disableDiv = "<table id=\"disable_tb\" border=\"0\"  cellpadding=\"0\" cellspacing=\"0\" style=\" ";
disableDiv += "position:absolute; ";
disableDiv += "z-index:1; ";
disableDiv += "left: 0px; ";
disableDiv += "top: 0px; ";
disableDiv += "background-color:"+fadeToColor+"; ";
disableDiv += "opacity: .0;";
disableDiv += "filter: alpha(opacity=0); ";
disableDiv += "-moz-opacity: .0; ";
disableDiv += "visibility:hidden; ";
disableDiv += "background-repeat: no-repeat; ";
disableDiv += "background-position: 50% 50%;\"> ";
disableDiv += "<tr> ";
disableDiv += "<td>&nbsp;</td> ";
disableDiv += "</tr> ";
disableDiv += "</table> ";
    
var containerDiv = "<div id=\"container_tb\"   ";
containerDiv += "onmousedown=\"DragObj(containerObj);\"  ";
containerDiv += "onmouseover=\"closeVar = false;\" ";
containerDiv += "onmouseout=\"closeVar = true;\" style=\" ";
containerDiv += "position:absolute; ";
containerDiv += "width:100px; ";
containerDiv += "height:100px; ";
containerDiv += "z-index:2; ";
containerDiv += "left: 0px; ";
containerDiv += "top: 0px; ";
containerDiv += "background-color:"+containerColor+"; ";
containerDiv += "visibility:hidden; ";
containerDiv += "\"> ";
containerDiv += "</div> ";

document.writeln(disableDiv+containerDiv);


var containerObj = document.getElementById("container_tb");
var disableObj = document.getElementById("disable_tb");
var imageTdObj = null;

var imgs = new Array();
function init(){
	onPageResize();
	var allImgs,i,counter = 0;
	allImgs = document.getElementsByTagName('img');
	for(i=0;i<allImgs.length;i++){
		if(allImgs[i].className == "dw_class"){
			allImgs[i].onclick=function(){startView(this);};
			imgs[counter] = allImgs[i];
			counter++;
			allImgs[i].style.cursor = "hand";
			allImgs[i].style.cursor = "pointer";
			allImgs[i].title = txtOut[lang][0];
		}
	}
}

function imgOver(e){}
function imgOut(e){}

////////////////////////////////////////////////////////////////////////////////////////////////////////////

window.onload = init;
window.onresize = onPageResize;
document.onclick = stopView;
document.onkeydown = keyboardAction;