var Gal = {
  // Customization parameters
  imgPath : "/img/",
  imgs : [
         ["PICT0695.jpg", "Der Nachwuchs stärkt sich", "Verein"],
         ["PICT0702.jpg", "Der Chef kocht Kabelsalat", "Verein"],
         ["PICT0712.jpg", "Die Sitzbank im Vereinsheim wird neu gepolstert", "Verein"],
         ["PICT1286.jpg", "Modellbahn<br>Blick &uuml;ber Bahnhof Emsbr&uuml;gge", "Modellbahn"]
         ],
  imgContainerId : "dhe-img",
  imgTextContainerId : "dhe-img-text",
  previousLinkId : "previous-img",
  nextLinkId : "next-img",
  imgCounterId : "img-counter",
  thumbnailContainerId: "dhe-thumbnails",
  useImageText : true,
  useThumbnails : true,
  useKeyboardShortcuts : true,

  // Gal function parameters
  allImages : null,
  currentImages : null,
  imgContainer : null,
  imgTextContainer : null,
  previousLink : null,
  nextLink : null,
  imgCounter : null,
  thumbnailContainer : null,
  thumbnailCollection : [],
  currentThumbnailSelected : null,
  imgText : null,
  imgText : "",
  imgSource : "",
  imgIndex : 0,
  isInitialLoad : false,

  init : function (){
    if(document.getElementById){
      this.imgContainer = document.getElementById(this.imgContainerId);
      this.allImages = this.imgs;
      this.currentImages = this.imgs;
      if(this.useImageText){
	this.imgTextContainer = document.getElementById(this.imgTextContainerId);
	if(!this.imgTextContainer){
	    this.useImageText = false;
	}
      }

      this.previousLink = document.getElementById(this.previousLinkId);
      this.previousLink.onclick = function(oEvent){
	var oEvent = (typeof oEvent != "undefined")? oEvent : event;
	Gal.preventDefaultEventBehavior(oEvent);
	Gal.previousImage();
      };
      this.nextLink = document.getElementById(this.nextLinkId);
      this.nextLink.onclick = function(oEvent){
	var oEvent = (typeof oEvent != "undefined")? oEvent : event;
	Gal.preventDefaultEventBehavior(oEvent);
	Gal.nextImage();
      };
      this.imgCounter = document.getElementById(this.imgCounterId);

      if(this.useKeyboardShortcuts){
	document.onkeydown = function(oEvent){
	   var oEvent = (typeof oEvent != "undefined")? oEvent : event;
	   Gal.applyKeyboardNavigation(oEvent);
	};
      }

      this.thumbnailContainer = document.getElementById(this.thumbnailContainerId);
      if(this.useThumbnails && this.thumbnailContainer){
         this.createThumbnails();
      }

      this.isInitialLoad = true;
      this.setImage();
      this.isInitialLoad = false;
    }
  },

  setImage : function (){
     if(this.currentImages.length > 0){
        this.imgContainer.style.visibility = "visible";
        this.imgSource = this.currentImages[this.imgIndex][0];
        this.imgText = this.currentImages[this.imgIndex][1];
        this.displayImageCount();
        this.imgContainer.setAttribute("src", (this.imgPath + this.imgSource));
        this.setImageText();
        this.previousLink.style.visibility = (this.imgIndex > 0)? "visible" : "hidden";
        this.nextLink.style.visibility = (this.imgIndex < (this.currentImages.length - 1))? "visible" : "hidden";
        if(this.useThumbnails){
           this.markCurrentThumbnail();
        }
     }
     else{
        this.imgSource = "";
        this.imgText = "";
        this.displayImageCount();
        this.imgContainer.style.visibility = "hidden";
        this.setImageText();
     }
  },

  displayImageCount : function (){
     if(this.imgCounter){
        this.imgCounter.innerHTML = (((this.currentImages.length > 0)? this.imgIndex : -1) + 1) + " / " + this.currentImages.length;
     }
  },

  nextImage : function (){
     if(this.imgIndex < (this.currentImages.length - 1)){
        ++this.imgIndex;
        this.setImage();
     }
  },

  previousImage : function (){
     if(this.imgIndex > 0){
        --this.imgIndex;
        this.setImage();
     }
  },

  setImageText : function (){
     this.imgTextContainer.setAttribute("alt", this.imgText);
     if(this.useImageText && typeof this.imgText == "string"){
        this.imgTextContainer.innerHTML = this.imgText;
     }
  },

  createThumbnails : function (){
     this.thumbnailContainer.innerHTML = "";
     this.thumbnailCollection = [];
     var oThumbnailsList = document.createElement("ul");
     var oListItem;
     var oThumbnail;
     var oCurrentImage;
     for(var i=0; i<this.currentImages.length; i++){
        oCurrentImage = this.currentImages[i];
        oListItem = document.createElement("li");
        oThumbnail = document.createElement("img");
        oThumbnail.setAttribute("id", ("dhe-thumbnail-" + i));
        oThumbnail.setAttribute("src", (this.imgPath + oCurrentImage[0]));
        oThumbnail.setAttribute("alt", oCurrentImage[1]);
        oThumbnail.setAttribute("title", oCurrentImage[1]);
        oThumbnail.onclick = function (oEvent){
	  Gal.imgIndex = parseInt(this.getAttribute("id").replace(/\D*(\d+)$/, "$1"), 10);
	  Gal.setImage();
        };
        this.thumbnailCollection.push(oThumbnail);
        oListItem.appendChild(oThumbnail);
        oThumbnailsList.appendChild(oListItem);
     }
     this.thumbnailContainer.appendChild(oThumbnailsList);
     if(this.thumbnailCollection.length > 0){
        this.markCurrentThumbnail();
     }
  },

  markCurrentThumbnail : function (){
     if(this.currentThumbnailSelected){
        this.currentThumbnailSelected.className = "";
        // Sometimes, in IE, the img loses its reference to its parent
        if(this.currentThumbnailSelected.parentNode){
	  this.currentThumbnailSelected.parentNode.className = "";
        }
     }
     this.currentThumbnailSelected = this.thumbnailCollection[this.imgIndex];
     this.currentThumbnailSelected.className = "selected";
     this.currentThumbnailSelected.parentNode.className = "selected-parent";
  },

  closeSession : function (oEvent){
     Gal = null;
     delete Gal;
  },

  applyKeyboardNavigation : function (oEvent){
     var intKeyCode = oEvent.keyCode;
     if(!oEvent.altKey){
        	switch(intKeyCode){
	case 37:
	case 38:
		this.previousImage();
		this.preventDefaultEventBehavior(oEvent);
		break;
	case 39:
	case 40:
		this.nextImage();
		this.preventDefaultEventBehavior(oEvent);
		break;
	}
     }
  },

  preventDefaultEventBehavior : function (oEvent){
     if(oEvent){
        oEvent.returnValue = false;
        if(oEvent.preventDefault){
     	  oEvent.preventDefault();
        }
     }
  }
};
// ---
addEvent(window, "load", function(){Gal.init();}, false);
addEvent(window, "unload", function(){Gal.closeSession();}, false);
// ---
// Utility functions
function addEvent(oObject, strEvent, oFunction, bCapture){
   if(oObject){
      if(oObject.addEventListener){
      	oObject.addEventListener(strEvent, oFunction, bCapture);
      }
      else if(window.attachEvent){
	oObject.attachEvent(("on" + strEvent), oFunction)
      }
   }
}
// ---
if(typeof Array.prototype.push != "function"){
   Array.prototype.push = ArrayPush;
   function ArrayPush(value){
      this[this.length] = value;
   }
}