var loadingImage = '/addons/lightbox/img/loading.gif';
var closeButton = '/addons/lightbox/img/close.gif';
imageArray = [];
activeImage = 0;
debug = 0;


function initLightbox()
{
	myLog('function initLightbox: start');

	if (!document.getElementsByTagName){ return; }

	// Liste der vorhandenen Thumbnails erstellen
	updateImageList();

	// the rest of this code inserts html at the top of the page that looks like this:
	//
	//overlay
	//lightbox
	//	outerImageContainer
	//		imageContainer
	//			lightboxImage
	//			hoverNav
	//				prevLink
	//				nextLink
	//			loading
	//	imageDataContainer
	//		imageData
	//			imageDetails
	//				caption
	//				numberDisplay
	//			bottomNav
	//				bottomNavClose

	var objBody = document.getElementsByTagName("body").item(0);

	// Erstelle "Overlay"
	var objOverlay = document.createElement("div");
	objOverlay.setAttribute('id','overlay');
	objOverlay.onclick = function () {hideLightbox(); return false;}
	objOverlay.style.display = 'none';
	objBody.appendChild(objOverlay, objBody);

	// Erstelle "Lightbox"
	var objLightbox = document.createElement("div");
	objLightbox.setAttribute('id','lightbox');
	objLightbox.style.display = 'none';
	objLightbox.onclick = function(event) { if (event.target.getAttribute('id') == 'lightbox') hideLightbox(); return false;}
	objBody.appendChild(objLightbox, objBody);

	// Erstelle "outerImageContainer"
	var objouterImageContainer = document.createElement("div");
	objouterImageContainer.setAttribute('id','outerImageContainer');
	objouterImageContainer.style.width = '1px';
	objouterImageContainer.style.height = '1px';
	objLightbox.appendChild(objouterImageContainer);

	// Erstelle "imageContainer"
	var objimageContainer = document.createElement("div");
	objimageContainer.setAttribute('id','imageContainer');
	objouterImageContainer.appendChild(objimageContainer);

	// Erstelle "lightboxImage"
	var objlightboxImage = document.createElement("img");
	objlightboxImage.setAttribute('id','lightboxImage');
	objimageContainer.appendChild(objlightboxImage);

	// Erstelle "hoverNav"
	var objhoverNav = document.createElement("div");
	objhoverNav.setAttribute('id','hoverNav');
	objimageContainer.appendChild(objhoverNav);

	// Erstelle "prevLink"
	var objprevLink = document.createElement("a");
	objprevLink.setAttribute('id','prevLink');
	objprevLink.href = 'javascript:void(0);';
	objprevLink.onclick = function () {changeImage(activeImage-1);return false;}
	objhoverNav.appendChild(objprevLink);

	// Erstelle "nextLink"
	var objnextLink = document.createElement("a");
	objnextLink.setAttribute('id','nextLink');
	objnextLink.href = 'javascript:void(0);';
	objnextLink.onclick = function () {changeImage(activeImage+1);return false;}
	objhoverNav.appendChild(objnextLink);

	//Brauche ich das überhaupt? Insbesondere den Preload für das Bild?
	// preload and create loader image
	var imgPreloader = new Image();
	imgPreloader.onload=function()
	{
		// Box für Loading-Img
		var objloading = document.createElement("div");
		objloading.setAttribute('id','loading');
		objimageContainer.appendChild(objloading);

		// Erstelle Link Loader-Img
		var objLoadingImageLink = document.createElement("a");
		objLoadingImageLink.setAttribute('id','loadingLink');
		objLoadingImageLink.setAttribute('href','javascript:void(0);');
		objLoadingImageLink.onclick = function () {hideLightbox(); return false;}
		objloading.appendChild(objLoadingImageLink);

		// Erstelle Bild für Loader
		var objLoadingImage = document.createElement("img");
		objLoadingImage.src = loadingImage;
		objLoadingImageLink.appendChild(objLoadingImage);

		imgPreloader.onload=function(){};	//	clear onLoad, as IE will flip out w/animated gifs

		return false;
	}
	imgPreloader.src = loadingImage;


	// Erstelle "imageDataContainer"
	var objimageDataContainer = document.createElement("div");
	objimageDataContainer.setAttribute('id','imageDataContainer');
	objLightbox.appendChild(objimageDataContainer);

	// Erstelle "imageData"
	var objimageData = document.createElement("div");
	objimageData.setAttribute('id','imageData');
	objimageDataContainer.appendChild(objimageData);

	// Erstelle "imageDetails"
	var objimageDetails = document.createElement("div");
	objimageDetails.setAttribute('id','imageDetails');
	objimageData.appendChild(objimageDetails);

	// Erstelle "caption"
	var objCaption = document.createElement("div");
	objCaption.setAttribute('id','caption');
	objCaption.style.display = 'none';
	objimageDetails.appendChild(objCaption);

	// Wozu brauche ich das?
	// create keyboard message
	var objKeyboardMsg = document.createElement("div");
	objKeyboardMsg.setAttribute('id','keyboardMsg');
	objKeyboardMsg.style.display = 'none';
	objKeyboardMsg.innerHTML = 'drücke <a href="javascript:void(0);" onclick="hideLightbox(); return false;"><kbd>x</kbd></a> zum Schließen';
	objimageData.appendChild(objKeyboardMsg);


	// Erstelle Link für Close-Button
	var objCloseLink = document.createElement("a");
	objCloseLink.setAttribute('id','closeLink');
	objCloseLink.setAttribute('href','javascript:void(0);');
	objCloseLink.setAttribute('title','Klicken zum Schließen');
	objCloseLink.style.display = 'none';
	objCloseLink.onclick = function () {hideLightbox(); return false;}
	objimageContainer.appendChild(objCloseLink);
	//objouterImageContainer.appendChild(objCloseLink);

	// preload and create close button image
	var imgPreloadCloseButton = new Image();
	imgPreloadCloseButton.onload=function()
	{
		var objCloseButton = document.createElement("img");
		objCloseButton.src = closeButton;
		objCloseButton.setAttribute('id','closeButton');
		objCloseLink.appendChild(objCloseButton);

		return false;
	}
	imgPreloadCloseButton.src = closeButton;
}

function updateImageList()
{
	myLog('function updateImageList: start');

	// OnClick an alle Links mit "rel=lightbox**" anhängen
	var anchors = document.getElementsByTagName("a");
	var anchors_length = anchors.length;

	// Durchlaufe alle Links innerhalb vom Thumbnail-Container
	for (var i=0; i<anchors_length; i++){
		var anchor = anchors[i];

		// Suche alle Links mit 'lightbox***' im rel-Attribut
		if (anchor.getAttribute("href") && anchor.getAttribute("rel") && anchor.getAttribute("rel").search(/lightbox/) != -1)
		{
			anchor.onclick = function ()
			{
				start(this);
				return false;
			}
		}
	}

	myLog('function updateImageList: ende');
}

function start(imageLink)
{
	myLog('-- function start: start');

	// Spezielle Elemente ausbleben, da sie im IE "durchscheinen" würden.
	var selects = document.getElementsByTagName("select");
	for (i = 0; i < selects.length; i++) {
		selects[i].style.visibility = "hidden";
	}
	var objects = document.getElementsByTagName("object");
	for (i = 0; i < objects.length; i++) {
		objects[i].style.visibility = "hidden";
	}
	var embeds = document.getElementsByTagName("embed");
	for (i = 0; i < embeds.length; i++) {
		embeds[i].style.visibility = "hidden";
	}





	// Größe des Overlay auf die komplette Seite ändern und anzeigen
	var arrayPageSize = getPageSize();
	var objOverlay = document.getElementById('overlay');
	objOverlay.style.width = arrayPageSize[0]+'px';
	objOverlay.style.height = arrayPageSize[1]+'px';
	objOverlay.style.display = 'block';


	imageArray = [];
	var imageNum = 0;


	// 0: URL
	// 1: Titel
	// 2: Beschreibung


	// Einzelbild

	if (imageLink.getAttribute("rel") == 'lightbox')
		imageArray.push([imageLink.href, imageLink.title, imageLink.getAttribute('fn_desc')]);

	// Bilderset
	else
	{
		// Bilder im Set ermitteln
		var anchors = document.getElementsByTagName("a");
		var anchors_length = anchors.length;

		// Durchlaufe alle Links innerhalb vom Thumbnail-Container
		for (var i=0; i<anchors_length; i++){
			var anchor = anchors[i];

			if (anchor.getAttribute("href") && anchor.getAttribute("rel") == imageLink.getAttribute("rel"))
				imageArray.push([anchor.href, anchor.title, anchor.getAttribute('fn_desc')]);
		}
		myLog('-- function start: übernehme bilder ins array');

		// Aktuelle Position ermitteln
		while (imageArray[imageNum][0] != imageLink.href) { imageNum++; }
		myLog('-- function start: Aktuelle Position ermitteln - Pos: '+imageNum);
	}

	// calculate top and left offset for the lightbox
	var arrayPageScroll = getPageScroll();
	var objLightbox = document.getElementById('lightbox');

	var LightboxTop = arrayPageScroll[1] + (arrayPageSize[3] / 10);
	objLightbox.style.top = LightboxTop+'px';
	objLightbox.style.left = arrayPageScroll[0]+'px';
	objLightbox.style.display = 'block';

	myLog('-- function start: vor funktion changeImage');
	changeImage(imageNum);
}


function changeImage(imageNum)
{
	myLog('-- -- function changeImage: start');

	activeImage = imageNum; // Globale Variable

	// Elemente erfassen
	var objlightboxImage = document.getElementById('lightboxImage');
	var objhoverNav = document.getElementById('hoverNav');
	var objprevLink = document.getElementById('prevLink');
	var objnextLink = document.getElementById('nextLink');
	var objLoading = document.getElementById('loading');

	// Loading-Image anzeigen
	myLog('-- -- function changeImage: loading');
	objLoading.style.display = 'block';


	// Elemente vorerst ausblenden
	//objlightboxImage.style.display = 'none';
	objhoverNav.style.display = 'none';
	objprevLink.style.display = 'none';
	objnextLink.style.display = 'none';

	myLog('-- -- function changeImage: imgPreload = new Image()');

	// preload image
	var imgPreload = new Image();
	imgPreload.onload=function()
	{
		myLog('-- -- function changeImage: Beginn ONLOAD-function');

		objlightboxImage.src = imageArray[activeImage][0];
		objlightboxImage.width = imgPreload.width;
		objlightboxImage.height = imgPreload.height;

		resizeImageContainer(imgPreload.width, imgPreload.height);

		myLog('-- -- function changeImage: ONLOAD-function ende');
		return false;
	}
	imgPreload.src = imageArray[activeImage][0];
}

function resizeImageContainer(imgWidth, imgHeight)
{
	var objouterImageContainer = document.getElementById('outerImageContainer');
	var objimageDataContainer = document.getElementById('imageDataContainer');
	var objprevLink = document.getElementById('prevLink');
	var objnextLink = document.getElementById('nextLink');

	myLog('-- -- -- function resizeImageContainer: start');

	var widthNew  = imgWidth  + 13 * 2;
	var heightNew = imgHeight + 13 * 2;
	objouterImageContainer.style.width = widthNew+'px';
	objouterImageContainer.style.height = heightNew+'px';

	// A small pause between the image loading and displaying is required with IE,
	// this prevents the previous image displaying for a short burst causing flicker.
	if (navigator.appVersion.indexOf("MSIE")!=-1){
		pause(250);
	}

	objprevLink.style.height = imgHeight+'px';
	objnextLink.style.height = imgHeight+'px';
	objimageDataContainer.style.width = widthNew+'px';

	showImage();
}

function showImage()
{
	var objLoading = document.getElementById('loading');
	objLoading.style.display = 'none';

	var objlightboxImage = document.getElementById('lightboxImage');
	objlightboxImage.style.display = 'block';

	updateDetails();

	preloadNeighborImages();
}


// Details einbinden
function updateDetails()
{
	myLog('-- -- -- -- -- function updateDetails: start');

	var objCaption = document.getElementById('caption');

	// Titel und Beschreibung
	if(imageArray[activeImage][1] || imageArray[activeImage][2])
	{
		var caption_text = '';

		// Titel
		if(imageArray[activeImage][1])
			caption_text += '<h1>'+imageArray[activeImage][1]+'</h1>';

		// Beschreibung
		if(imageArray[activeImage][2])
			caption_text += imageArray[activeImage][2];

		objCaption.style.display = 'block';
		objCaption.innerHTML = caption_text;
	}
	else
	{
		objCaption.style.display = 'none';
	}

	var objkeyboardMsg = document.getElementById('keyboardMsg');
	objkeyboardMsg.style.display = 'block';

	var objcloseLink = document.getElementById('closeLink');
	objcloseLink.style.display = 'block';


	var arrayPageSize = getPageSize();
	var objOverlay = document.getElementById('overlay');
	objOverlay.style.width = arrayPageSize[0]+'px';
	objOverlay.style.height = arrayPageSize[1]+'px';

	updateNav();
}


function updateNav()
{
	myLog('-- -- -- -- -- -- function updateNav: start');

	var objhoverNav = document.getElementById('hoverNav');
	var objprevLink = document.getElementById('prevLink');
	var objnextLink = document.getElementById('nextLink');

	objhoverNav.style.display = 'block';
	myLog('-- -- -- -- -- -- function updateNav: objhoverNav aktiviert');

     // Wenn nicht erste Bild, dann "prev" anzeigen
     if (activeImage > 0) objprevLink.style.display = 'block';

     // Wenn nicht letzte Bild, dann "next" anzeigen
     if (activeImage < (imageArray.length - 1)) objnextLink.style.display = 'block';

     myLog('-- -- -- -- -- -- function updateNav: Steuerelemente anzeigen');

     //objprevLink.style.border = "thin solid blue";
     //objnextLink.style.border = "thin solid red";

     // Check for 'x' keypress
	listenKey();

     myLog('-- -- -- -- -- -- function updateNav: ende');
}


function preloadNeighborImages()
{
	myLog('-- -- -- -- -- -- -- function preloadNeighborImages: start');

	var preloadNextImage, preloadPrevImage;
	if (imageArray.length > activeImage + 1){
		preloadNextImage = new Image();
		preloadNextImage.src = imageArray[activeImage + 1][0];
	}
	if (activeImage > 0){
		preloadPrevImage = new Image();
		preloadPrevImage.src = imageArray[activeImage - 1][0];
	}

	myLog('-- -- -- -- -- -- -- function preloadNeighborImages: ende');
}


//
// hideLightbox()
//
function hideLightbox()
{
	// get objects
	var objOverlay = document.getElementById('overlay');
	var objLightbox = document.getElementById('lightbox');

	// Damit beim Neustart nicht das alte Bild geladen wird... Ist nur ein Zusatz, müsste auch anders gehen
	var objImage = document.getElementById('lightboxImage');
	//objImage.src = '';

	// hide lightbox and overlay
	objOverlay.style.display = 'none';
	objLightbox.style.display = 'none';

	// make special boxes visible
	selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "visible";
	}
	objects = document.getElementsByTagName("object");
	for (i = 0; i != objects.length; i++) {
		objects[i].style.visibility = "hidden";
	}
	embeds = document.getElementsByTagName("embed");
	for (i = 0; i != embeds.length; i++) {
		embeds[i].style.visibility = "hidden";
	}


	// disable keypress listener
	document.onkeypress = '';
}


//
// addLoadEvent()
// Adds event to window.onload without overwriting currently assigned onload functions.
// Function found at Simon Willison's weblog - http://simon.incutio.com/
//
function addLoadEvent(func)
{
	var oldonload = window.onload;
	if (typeof window.onload != 'function'){
    	window.onload = func;
	} else {
		window.onload = function(){
		oldonload();
		func();
		}
	}

}


//
// getPageScroll()
// Returns array with x,y page scroll values.
// Core code from - quirksmode.org
//
function getPageScroll()
{
	var xScroll;

	if (self.pageXOffset) {
		xScroll = self.pageXOffset;
	} else if (document.documentElement && document.documentElement.scrollLeft){	 // Explorer 6 Strict
		xScroll = document.documentElement.scrollLeft;
	} else if (document.body) {// all other Explorers
		xScroll = document.body.scrollLeft;
	}

	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(xScroll,yScroll)
	return arrayPageScroll;
}



//
// getPageSize()
// Returns array with page width, height and window width, height
// Core code from - quirksmode.org
// Edit for Firefox by pHaez
//
function getPageSize(){

		var xScroll, yScroll;

		if (window.innerHeight && window.scrollMaxY) {
			xScroll = window.innerWidth + window.scrollMaxX; // zuvor 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
			if(document.documentElement.clientWidth){
				windowWidth = document.documentElement.clientWidth;
			} else {
				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 = xScroll;
		} else {
			pageWidth = windowWidth;
		}

		//return [pageWidth,pageHeight];


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


//
// pause(numberMillis)
// Pauses code execution for specified time. Uses busy code, not good.
// Code from http://www.faqts.com/knowledge_base/view.phtml/aid/1602
//
function pause(numberMillis) {
	var now = new Date();
	var exitTime = now.getTime() + numberMillis;
	while (true) {
		now = new Date();
		if (now.getTime() > exitTime)
			return;
	}
}

//
// getKey(key)
// Gets keycode. If 'x' is pressed then it hides the lightbox.
//

function getKey(e){
	if (e == null) { // ie
		keycode = event.keyCode;
	} else { // mozilla
		keycode = e.which;
	}
	key = String.fromCharCode(keycode).toLowerCase();

	if(key == 'x'){ hideLightbox(); }
}


//
// listenKey()
//
function listenKey () {	document.onkeypress = getKey; }


function myLog (msg)
{
	if(debug == 1)
	{
		if('console' in window && 'log' in window.console)
		{
	    		console.log(msg);
		}
	}
}


//addLoadEvent(initLightbox);	// run initLightbox onLoad
initLightbox();