var id_array = new Array("overlay","Bild_copy","inlay1","Bild","overlay2","overlay3","titel1","exit1","mehr1","next1","pref1","Loading")

var loading = '../Includes/PicBox/loading.gif';
var more = '../Includes/PicBox/mehr.jpg';
var next = '../Includes/PicBox/next.jpg';
var pref = '../Includes/PicBox/pref.jpg';
var exit = '../Includes/PicBox/beenden.jpg';
var border = 5;

var galeriename = "";
var aktives_bild = "";
var aktive_id = 0;
var preloadImage = new Image();
var imageArray = new Array;
var speed = 7;

function divlayer(galerie, pfad) {

	//(window.scroll(0,0);
	galeriename = galerie;
	load_img();
	//alert(pfad);
	
	aktives_bild = pfad;

	aktive_id = array_search(aktives_bild, imageArray);
	//alert(aktive_id);
	var arrayPageSize = getPageSize();
	var arrayPageScroll = getPageScroll();
	var objBody = document.getElementsByTagName("body").item(0);
		
	var objOverlay = document.createElement("div");
	objOverlay.setAttribute('id','overlay');
	//objOverlay.onclick = function() { Ende(100); return false; };
	objOverlay.style.position = 'absolute';
	objOverlay.style.left = '0px';
	objOverlay.style.top = '0px';
	objOverlay.style.opacity = (60 / 100);
	objOverlay.style.MozOpacity = (60 / 100);
	objOverlay.style.KhtmlOpacity = (60 / 100);
	objOverlay.style.filter = "alpha(opacity=" + 60 + ")";
	objOverlay.style.backgroundColor = '#000000';
	objBody.appendChild(objOverlay);
	objOverlay.style.width=arrayPageSize[0]-21;
	objOverlay.style.height=arrayPageSize[1];

	var objBild_copy = document.createElement("img");
	objBild_copy.setAttribute('src','../Includes/PicBox/pixelproductions.gif');
	objBild_copy.setAttribute('id','Bild_copy');
	objBild_copy.style.position = 'absolute';
	objBild_copy.style.width = 50;
	objBild_copy.style.height = 25;
	objBild_copy.style.right = border;
	objBild_copy.style.top = border;
	objBild_copy.style.opacity = (20 / 100);
	objBild_copy.style.MozOpacity = (20 / 100);
	objBild_copy.style.KhtmlOpacity = (20 / 100);
	objBild_copy.style.filter = "alpha(opacity=" + 20 + ")";
	objOverlay.appendChild(objBild_copy);

	preloadImage.src = imageArray[aktive_id][0];

	var objInlay1 = document.createElement("div");
	objInlay1.setAttribute('id','inlay1');
	objInlay1.style.position = 'absolute';
	objInlay1.style.backgroundColor = '#FFFFFF';
	objBody.appendChild(objInlay1);

	var objBild = document.createElement("img");
	objBild.setAttribute('src',imageArray[aktive_id][0]);
	objBild.setAttribute('id','Bild');
	objBild.style.position = 'absolute';
	objBild.style.left = border;
	objBild.style.top = border;
	objBild.style.backgroundColor = '#ffffff';
	objInlay1.appendChild(objBild);
	objBild.style.display = 'none';
	
	objInlay1.style.left = (arrayPageSize[0]/2);
	objInlay1.style.top = arrayPageScroll[1]+50;

	var objOverlay2 = document.createElement("div");
	objOverlay2.setAttribute('id','overlay2');
	objOverlay2.style.position = 'absolute';
	objOverlay2.style.left = '0px';
	objOverlay2.style.top = '0px';
	objOverlay2.style.opacity = (0 / 100);
	objOverlay2.style.MozOpacity = (0 / 100);
	objOverlay2.style.KhtmlOpacity = (0 / 100);
	objOverlay2.style.filter = "alpha(opacity=" + 0 + ")";
	objOverlay2.style.backgroundColor = '#ffffff';
	objOverlay2.style.display = 'none';
	objInlay1.appendChild(objOverlay2);

	var objOverlay3 = document.createElement("div");
	objOverlay3.setAttribute('id','overlay3');
	objOverlay3.style.position = 'absolute';
	objOverlay3.style.left = '0px';
	objOverlay3.style.top = '0px';
	objInlay1.appendChild(objOverlay3);
	objOverlay3.style.display = 'none';
	objOverlay3.innerHTML= '<table align="center" width="100%" height="100%"><tr><td align="center">&nbsp;</td></tr></table>'

	if ((preloadImage.height+135)>document.getElementById("overlay").offsetHeight) {
		document.getElementById("overlay").style.height=preloadImage.height+135;
	}


	var objTitel = document.createElement("div");
	objTitel.setAttribute('id','titel1');
	objTitel.style.position = 'absolute';
	objTitel.style.left = '2px';
	objTitel.style.bottom = '2px';
	objInlay1.appendChild(objTitel);
	objTitel.style.display = 'none';
	objTitel.style.height="30px";		
	objTitel.innerHTML= '<table border="0" cellpadding="0" cellspacing="0" align="left"><tr><td align="center"><font style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; "><strong>Titel</strong></font></td></tr></table>'

	var objExit = document.createElement("div");
	objExit.setAttribute('id','exit1');
	objExit.onclick = function() { Ende(0); return false; };
	objExit.style.position = 'absolute';
	objExit.style.right = '2px';
	objExit.style.bottom = '2px';
	objExit.style.backgroundImage = 'url('+exit+')';
	objExit.style.cursor = 'pointer';
	objInlay1.appendChild(objExit);
	objExit.style.display = 'none';
	objExit.style.width="30px";
	objExit.style.height="30px";		


	var objMore = document.createElement("div");
	objMore.setAttribute('id','mehr1');
	//objMore.onclick = function() { aktive_id++; next_img(); return false; };
	objMore.style.position = 'absolute';
	objMore.style.right = '32px';
	objMore.style.bottom = '2px';
	objMore.style.backgroundImage = 'url('+more+')';
	//objMore.style.cursor = 'pointer';
	objInlay1.appendChild(objMore);
	objMore.style.width="30px";
	objMore.style.height="30px";		
	objMore.style.display = 'none';

	var objNext = document.createElement("div");
	objNext.setAttribute('id','next1');
	objNext.onclick = function() { aktive_id++; next_img(); return false; };
	objNext.style.position = 'absolute';
	objNext.style.right = '62px';
	objNext.style.bottom = '2px';
	objNext.style.backgroundImage = 'url('+next+')';
	objNext.style.cursor = 'pointer';
	objInlay1.appendChild(objNext);
	objNext.style.width="30px";
	objNext.style.height="30px";		
	objNext.style.display = 'none';

	var objPref = document.createElement("div");
	objPref.setAttribute('id','pref1');
	objPref.onclick = function() { aktive_id--; next_img(); return false; };
	objPref.style.position = 'absolute';
	objPref.style.right = '92px';
	objPref.style.bottom = '2px';
	objPref.style.backgroundImage = 'url('+pref+')';
	objPref.style.cursor = 'pointer';
	objInlay1.appendChild(objPref);
	objPref.style.width="30px";
	objPref.style.height="30px";		
	objPref.style.display = 'none';

	resize()
}

function array_search(src, array) {
	for (var i = 0 ; i < array.length ; i++) {
		if (array[i][0]==src) { return i; }
	//alert(array[i][0] + " - " + src);
	}
	return 0; 
}

function resize() {
	if ((preloadImage.height+(border*2)) > document.getElementById("inlay1").offsetHeight || (preloadImage.height+(border*2)+(speed*2)) < document.getElementById("inlay1").offsetHeight || (preloadImage.width+(border*2)) > document.getElementById("inlay1").offsetWidth || (preloadImage.width+(border*2)+(speed*2)) < document.getElementById("inlay1").offsetWidth) {
		if ((preloadImage.height+135)>document.getElementById("overlay").offsetHeight) {
			document.getElementById("overlay").style.height=preloadImage.height+135;
		}
		if ((preloadImage.width+(border*2)) > document.getElementById("inlay1").offsetWidth) {
			document.getElementById("inlay1").style.left = document.getElementById("inlay1").offsetLeft - speed;
			document.getElementById("inlay1").style.width = document.getElementById("inlay1").offsetWidth + (speed*2);
		}
		if ((preloadImage.width+(border*2)+(speed*2)) < document.getElementById("inlay1").offsetWidth) {
			document.getElementById("inlay1").style.left = document.getElementById("inlay1").offsetLeft + speed;
			document.getElementById("inlay1").style.width = document.getElementById("inlay1").offsetWidth - (speed*2);
		}
		if ((preloadImage.height+(border*2)) > document.getElementById("inlay1").offsetHeight) {
			document.getElementById("inlay1").style.height = document.getElementById("inlay1").offsetHeight + (speed*2);
		}
		if ((preloadImage.height+(border*2)+(speed*2)) < document.getElementById("inlay1").offsetHeight) {
			document.getElementById("inlay1").style.height = document.getElementById("inlay1").offsetHeight - (speed*2);
		}

		setTimeout("resize()",10);
		//setTimeout("resize()",100);
	} else {
		if (preloadImage.height == 0 && preloadImage.width == 0) {
			setTimeout("resize()",10);
		} else {
			document.getElementById("overlay2").style.display = 'block';
			document.getElementById("overlay2").style.width = document.getElementById("inlay1").offsetWidth;
			document.getElementById("overlay2").style.height = document.getElementById("inlay1").offsetHeight;
			document.getElementById("overlay3").style.display = 'block';
			document.getElementById("overlay3").style.width = document.getElementById("inlay1").offsetWidth;
			document.getElementById("overlay3").style.height = document.getElementById("inlay1").offsetHeight;
			document.getElementById("titel1").innerHTML= '<table border="0" cellpadding="0" cellspacing="0" align="left"><tr><td align="center"><font style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; "><strong>'+imageArray[aktive_id][1]+'</strong></font></td></tr></table>'
			document.getElementById("Bild").setAttribute('src',preloadImage.src);
			document.getElementById("Bild").width = preloadImage.width;
			document.getElementById("Bild").height = preloadImage.height;
			show_pic(0,"Bild");
		}
	}
}

function show_pic(opacity, id) {

		var object = document.getElementById(id).style; 
		object.opacity = (opacity / 100);
		object.MozOpacity = (opacity / 100);
		object.KhtmlOpacity = (opacity / 100);
		object.filter = "alpha(opacity=" + opacity + ")";
		object.display = 'block';
		if (opacity < 100) {

			setTimeout("show_pic("+(opacity+(speed/2))+", '"+id+"')",10);
		} else {
			resize2();
		}

}

function resize2() {
	if ((preloadImage.height+(border*2)+35) > document.getElementById("inlay1").offsetHeight) {
		document.getElementById("inlay1").style.height = document.getElementById("inlay1").offsetHeight + 2;
		setTimeout("resize2()",10);
	} else {
		document.getElementById("titel1").style.display = 'block';
		document.getElementById("exit1").style.display = 'block';
		//document.getElementById("mehr1").style.display = 'block';
		if (aktive_id != (imageArray.length-1)) {
			document.getElementById("next1").style.display = 'block';
		}
		if (aktive_id != 0) {
			document.getElementById("pref1").style.display = 'block';
		}
	}
}

function next_img() {
	document.getElementById("titel1").style.display = 'none';
	document.getElementById("exit1").style.display = 'none';
	document.getElementById("mehr1").style.display = 'none';
	document.getElementById("next1").style.display = 'none';
	document.getElementById("pref1").style.display = 'none';
	document.getElementById("overlay2").style.display = 'none';
	document.getElementById("overlay3").style.display = 'none';
	preloadImage.src = imageArray[aktive_id][0];
	fadeout(100,"Bild");
}

function fadeout(opacity, id) {

		var object = document.getElementById(id).style; 
		object.opacity = (opacity / 100);
		object.MozOpacity = (opacity / 100);
		object.KhtmlOpacity = (opacity / 100);
		object.filter = "alpha(opacity=" + opacity + ")";
		object.display = 'block';
		if (opacity > 0) {
			setTimeout("fadeout("+(opacity-(speed/2))+", '"+id+"')",10);
		} else {
			resize();
		}

}

function load_img() {
	imageArray = [];
	if (!document.getElementsByTagName){ return; }
	var anchors = document.getElementsByTagName('img');

	for (var i=0; i<anchors.length; i++){
		var anchor = anchors[i];
		if (anchor.getAttribute('src') && anchor.getAttribute('picbox') &&  anchor.getAttribute('picbox') == galeriename){
			imageArray.push(new Array(anchor.getAttribute('gross'), anchor.getAttribute('title')));
		}
	}
	//while(imageArray[imageNum][0] != aktives_bild) { imageNum++;}
}

function Ende(opacity){

		var object = document.getElementById("inlay1").style; 
		object.opacity = (opacity / 100);
		object.MozOpacity = (opacity / 100);
		object.KhtmlOpacity = (opacity / 100);
		object.filter = "alpha(opacity=" + opacity + ")";
		object.display = 'block';
		if (opacity > 0) {
			setTimeout("Ende("+(opacity-5)+")",10);
		} else {
			for (var i = 0 ; i < id_array.length ; i++) {
				var merker = document.getElementById(id_array[i]);
				if(merker) {
					document.getElementById(id_array[i]).style.display = "none";
					var objOverlay = document.getElementById(id_array[i]);
					objOverlay.setAttribute('id', id_array[i]+'_close');
				}
			}
//			Ende2(60);
		}

}

function Ende2(opacity){

		var object = document.getElementById("overlay").style; 
		object.opacity = (opacity / 100);
		object.MozOpacity = (opacity / 100);
		object.KhtmlOpacity = (opacity / 100);
		object.filter = "alpha(opacity=" + opacity + ")";
		object.display = 'block';
		if (opacity > 0) {
			setTimeout("Ende2("+(opacity-5)+")",10);
		} else {
			for (var i = 0 ; i < id_array.length ; i++) {
				var merker = document.getElementById(id_array[i]);
				if(merker) {
					document.getElementById(id_array[i]).style.display = "none";
					var objOverlay = document.getElementById(id_array[i]);
					objOverlay.setAttribute('id', id_array[i]+'_close');
				}
			}
		}

}

function getPageScroll(){

	var yScroll;

	if (self.pageYOffset) {
		yScroll = self.pageYOffset;
	} else if (document.documentElement && document.documentElement.scrollTop){	 // Explorer 6 Strict
		yScroll = document.documentElement.scrollTop;
	} else if (document.body) {// all other Explorers
		yScroll = document.body.scrollTop;
	}

	arrayPageScroll = new Array('',yScroll) 
	return arrayPageScroll;
}


function getPageSize(){
	
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}

	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){	
		pageWidth = windowWidth;
	} else {
		pageWidth = xScroll;
	}


	arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) 
	return arrayPageSize;
}
