var imageArray = new Array;


function divsErzeugen() {
	var oBody = document.getElementsByTagName('BODY').item(0);
	var div = document.createElement('div');
	
	div.style.filter = "alpha(opacity=50);";
	div.style.opacity = "0.50";// -moz-opacity:0.50;
	div.setAttribute('id', "bopbhg");
	div.style.position = "absolute";
	div.style.left = 0;
	div.style.top = 0;
	div.style.width = 100;
	div.style.height = 100;
	div.style.display = "none";
	div.style.backgroundColor = "#000000";
	div.style.zIndex= 100;

	oBody.appendChild(div);
	document.getElementById("bopbhg").onclick = function() {bopbHide(); return false;};
	
	var div = document.createElement('div');
	div.setAttribute('id', "bopb");

	div.style.position = "absolute";
	
	div.style.left = 0;
	div.style.top = 0;
	div.style.width = 33;
	div.style.height = 33;
	div.style.backgroundColor = "#fff";

	div.style.borderWidth = "0";
	div.style.padding = "20";
	div.style.zIndex= 101;
	
	div.style.borderStyle = "solid";
	div.style.display = "none";
	div.innerHTML = ""; 
	div.innerHTML += "<a href=\"\" id=\"bopbnachher2\"><img src=\"gfx/laden.gif\" border='0' id=\"bopbbild\"></a>";
	div.innerHTML += "<div style=\"position:relative;float:left;\" id=\"bopbvorherdiv\"><a href=\"\" id=\"bopbvorher\"><img src=\"gfx/pfeillinks.gif\" border=\"0\" alt=\"Vorheriges Foto\"></a></div>";
	div.innerHTML += "<div style=\"position:relative;float:left;\" id=\"bopbnachherdiv\"><a href=\"\" id=\"bopbnachher\"><img src=\"gfx/pfeilrechts.gif\" border=\"0\" alt=\"Naechstes Foto\"></a></div>";

	div.innerHTML += "<div style=\"float:left;\" id=\"bopbstatusdiv\"><div style=\"float:left;\" id=\"bopbvollbilddiv\"><a href=\"\" target=\"_blank\" id=\"bopbvollbild\"><img src=\"gfx/icons/photo.png\" border=\"0\" alt=\"Vollbild\"></a><a href=\"javascript:bopbHide();\"><img src=\"gfx/icons/door_open.png\" border=\"0\" alt=\"Schliessen\"></a>&nbsp;</div><div style=\"float:left;\" id=\"bopbstatus\"></div></div>";

	oBody.appendChild(div);
}

function bopbInit() {
	// Alle Fotos
	imageArray = [];
	image = 0;
	
	// Alle Link-Elemente ("<a href=...>") raussuchen
	var linkElemente = document.getElementsByTagName("a");
	
	// Alle Link-Elemente pruefen
	for (var i=0;i<linkElemente.length;i++){
		// Handelt es sich um einen Link auf ein Foto?

		if (linkElemente[i].getAttribute("href") && linkElemente[i].getAttribute("rel") == "bopb") {
			imageArray[image] = linkElemente[i];
			image++;
			// onclick-Methode setzen, die spaeter das DIV mit dem Foto anzeigt.
			linkElemente[i].onclick = function() {
				bopbShow(this);
				return false;
			};
		}

	}
	divsErzeugen();
	
	// PNG oder Transparenter Hintergrund je nach Browser
	/*
	var name = navigator.userAgent.toLowerCase();
	var divBopbHg = document.getElementById('bopbhg');

	if (name.indexOf("msie") ==-1) {
		divBopbHg.style.backgroundImage = "url(gfx/hg.png)";
		divBopbHg.style.backgroundColor = "";
	}
	*/
}


// Vorhandene Onload-Methode wird nicht ueberschrieben
function addOnload(funktion) {
	var altefunktion = window.onload;

	if (typeof window.onload != 'function') {
    	window.onload = funktion;
	}
	else
	{
		window.onload = function(){
			altefunktion();
			funktion();
		}
	}
}

if (document.getElementsByTagName) addOnload(bopbInit);
/*
function fade(src,a) {
	a+=10;
	b = a / 100;
	var div = document.getElementById(src);
	div.style.filter = "alpha(opacity="+a+");";
	div.style.opacity = b;
	
	if (a < 100) setTimeout("fade('" + src + "',"+a+")", 1);
}
*/
// Bild anzeigen, automatische Verkleinerung auf Bildschirmgroesse
function bopbShow(src) {

	if (src.href) src = src.href;

	var sichtbar = getSichtbar();

	var seite = getSeite();

	var xpos = getX();
	var ypos = getY();
	if (seite[0] < sichtbar[0]) seite[0] = sichtbar[0];
	if (seite[1] < sichtbar[1]) seite[1] = sichtbar[1];
	
	var divBopbBild = document.getElementById('bopbbild');
	divBopbBild.src = "gfx/laden.gif";
	divBopbBild.width = 33;
	divBopbBild.height = 33;

	var divBopb = document.getElementById('bopb');
	divBopb.style.width = 33;
	divBopb.style.height = 50;

//	fade('bopb',0);	
	var linkBopbvollbild = document.getElementById('bopbvollbild');
	bopbvollbild.href = src;

	var linkBopbvorher = document.getElementById('bopbvorher');
	var linkBopbnachher = document.getElementById('bopbnachher');
	var linkBopbnachher2 = document.getElementById('bopbnachher2');
	
	/* Vorheriges und naechstes Bild verlinken */
	var vorher = "";
	var nachher = "";
	var aktuelleFotoNummer = 0;
	for (var i = 0; i < imageArray.length;i++) {
		var aktuellesFoto = imageArray[i];

		if (aktuellesFoto == src) {
			/* Das vorherige Bild des ersten Bildes ist das letzte Bild :-) */
			if (i == 0) {
				vorher = imageArray[imageArray.length-1];
			}
			else
			{
				vorher = imageArray[i-1];
			}
			if (i == imageArray.length-1) {
				nachher = imageArray[0];
			}
			else
			{
				nachher = imageArray[i+1];
			}
			aktuelleFotoNummer = i;
			
		}
	
	}
	linkBopbvorher.onclick = function() {bopbHide();bopbShow(vorher);return false;};
	linkBopbnachher.onclick = function() {bopbHide();bopbShow(nachher);return false;};
	linkBopbnachher2.onclick = function() {bopbHide();bopbShow(nachher);return false;};
	

	/* Infobox */
	var linkBopbstatus = document.getElementById('bopbstatus');
	linkBopbstatus.innerHTML = aktuelleFotoNummer+1 + "/" + imageArray.length;
	
	var divBopbHg = document.getElementById('bopbhg');
	divBopbHg.style.width = sichtbar[0];
	divBopbHg.style.height = seite[1];
	divBopbHg.style.display = "block";

	var tempBopbBild = new Image();

	var oben = -20 + ypos + ((sichtbar[1] - divBopbBild.height) / 2);

	var links = xpos + ((sichtbar[0] - divBopbBild.width) / 2);

	divBopb.style.top = (oben < 0) ? "0px" : oben + "px";
	divBopb.style.left = (links < 0) ? "0px" : links + "px";
	divBopb.style.display = "block";
	
	tempBopbBild.onload = function(){
		vergleich = (tempBopbBild.width/tempBopbBild.height);

		var bildbreite = tempBopbBild.width;
		var bildhoehe = tempBopbBild.height;

		if (sichtbar[1] < bildhoehe) {
			bildhoehe = sichtbar[1]-80;
			bildbreite = bildhoehe * vergleich;
		}

		if (sichtbar[0] < bildbreite) {
			bildbreite  = sichtbar[0]-90;
			bildhoehe = bildbreite / vergleich;
		}
		
		//bildbreite = Math.round(bildbreite);
	//	bildhoehe = Math.round(bildhoehe);

		divBopbBild.width = bildbreite;
		divBopbBild.height = bildhoehe;

		divBopb.style.width = bildbreite;
		divBopb.style.height = bildhoehe;

		var oben = -30 + ypos + ((sichtbar[1] - divBopbBild.height) / 2);
		var links = -30 + xpos + ((sichtbar[0] - divBopbBild.width) / 2);
		
		divBopb.style.top = (oben < 0) ? "0px" : oben + "px";
		divBopb.style.left = (links < 0) ? "0px" : links + "px";

	
		var divBopbvorher = document.getElementById('bopbvorherdiv');
		divBopbvorher.style.top = "-"+(divBopbBild.height/2)+"px";
		divBopbvorher.style.left = "-18px";
		divBopbvorher.style.display = "";
		var divBopbnachher = document.getElementById('bopbnachherdiv');
		divBopbnachher.style.top = "-"+((divBopbBild.height/2))+"px";
		divBopbnachher.style.left = (divBopbBild.width-10)+"px";
		divBopbnachher.style.display = "";
		
		divBopbBild.src = src;		
	}
	
	tempBopbBild.src = src;
	return false;
}

function showPfeile() {
	var div = document.getElementById('bopbvorherdiv');
	div.style.display = "";
	var div = document.getElementById('bopbnachherdiv');
	div.style.display = "";
	var div = document.getElementById('bopbstatusdiv');
	div.style.display = "";
}

function hidePfeile() {
	var div = document.getElementById('bopbvorherdiv');
	div.style.display = "none";
	var div = document.getElementById('bopbnachherdiv');
	div.style.display = "none";
	var div = document.getElementById('bopbstatusdiv');
	div.style.display = "none";
}

// Versteckt Hintergrund und Foto
function bopbHide() {
	var divBopb = document.getElementById('bopb');
	var divBopbHg = document.getElementById('bopbhg');

	divBopb.style.display = "none";
	divBopbHg.style.display = "none";
	var divBopbvorher = document.getElementById('bopbvorherdiv');
	divBopbvorher.style.display = "none";
	var divBopbnachher = document.getElementById('bopbnachherdiv');
	divBopbnachher.style.display = "none";
}


// X-Scrollposition
function getX() {
	var xpos;
	if (document.body) {
		xpos = document.body.scrollLeft;
	}
	else if (self.pageXOffset) {
		xpos = self.pageXOffset;
	}
	else if (document.documentElement.scrollLeft) {
		xpos = document.documentElement.scrollLeft;
	}

	return xpos;
}

// Y-Scrollposition
function getY() {
	var ypos;
	if (document.body) {
		ypos = document.body.scrollTop;
	}
	else if (self.pageYOffset) {
		ypos = self.pageYOffset;
	}
	else if (document.documentElement.scrollTop) {
		ypos = document.documentElement.scrollTop;
	}

	return ypos;
}

// Seitenbreite und -hoehe
function getSichtbar() {
	var breite = 0;
	var hoehe = 0;

	if (self.innerHeight) {
		breite = self.innerWidth;
		hoehe = self.innerHeight;
	}
	else if (document.documentElement.clientWidth) {
		breite = document.documentElement.clientWidth;
		hoehe = document.documentElement.clientHeight;
	}
	else if (document.body.clientWidth) {
		breite = document.body.clientWidth;
		hoehe = document.body.clientHeight;
	}

	return new Array(breite,hoehe);
}


// Seitenbreite und -hoehe

function getSeite() {
	var breite = 0;
	var hoehe = 0;

	if (window.scrollMaxY) {	
		breite = document.body.scrollWidth + window.scrollMaxX;
		hoehe = window.innerHeight + window.scrollMaxY;
	}
	else
	{
		breite = document.body.offsetWidth+document.body.scrollWidth;
		hoehe = document.body.scrollHeight;
	}

	return new Array(breite,hoehe);
}
