

var SimpleLightbox = Class.create();

SimpleLightbox.prototype = {
    imageArray: [],
    activeImage: undefined,
	para: null, // added shbgr
	lightboxImage: null, // replacement builder-node shbgr
	infoContainer: null, // replacement builder-node shbgr
	animator: null, // added shbgr
    
    // initialize()
    // Constructor runs on completion of the DOM loading. Calls updateImageList and then
    // the function inserts html at the bottom of the page which is used to display the shadow 
    // overlay and the image container.
    //
    initialize: function() {    
        
        this.updateImageList();
        
    },

    //
    // updateImageList()
    // Loops through anchor tags looking for 'lightbox' references and applies onclick
    // events to appropriate links. You can rerun after dynamically adding images w/ajax.
    //
    updateImageList: function() {   
        this.updateImageList = Prototype.emptyFunction;

        document.observe('click', (function(event){
            var target = event.findElement('a[rel^=simplelightbox]') || event.findElement('area[rel^=simplelightbox]');
            if (target) {
                event.stop();
                this.start(target);
            }
        }).bind(this));
    },
    
    //
    //  start()
    //  Display overlay and lightbox. If image is part of a set, add siblings to imageArray.
    //
    start: function(imageLink) {   
		
		this.imageArray = [];
        var imageNum = 0;       

		this.para = imageLink.rel.replace(new RegExp("simplelightbox.(par[A-Fa-f0-9_]+).", "gi"), "$1");
		
		this.lightboxImage = $(this.para + "_Vergroesserung_Abbildung");
		this.infoContainer = $(this.para + "_Vergroesserung_Beschreibung");
		
		$(this.para + "_Vergroesserung").style.display = "block";
		$(this.para + "_Galerie").style.display = "none";
		document.fire("ib:resize_content");

		this.imageArray = 
			$$(imageLink.tagName + '[href][rel="' + imageLink.rel + '"]').
			collect(function(anchor){ return [anchor.href, anchor.id, anchor.title]; }).
			uniq();
		
		while (this.imageArray[imageNum][0] != imageLink.href) { imageNum++; }


        this.changeImage(imageNum);
    },

    changeImage: function(imageNum) {   
        
        this.activeImage = imageNum; // update global var

        //this.lightboxImage.hide();
        
        var imgPreloader = new Image();
        
        // once image is preloaded, resize image container


        imgPreloader.onload = (function(){
            this.lightboxImage.src = this.imageArray[this.activeImage][0];
			this.updateDetails();
			this.preloadNeighborImages();
        }).bind(this);
        imgPreloader.src = this.imageArray[this.activeImage][0];
    },

    next: function() {   
        this.changeImage((this.activeImage+1) % this.imageArray.length);
    },
    prev: function() {   
        this.changeImage((this.activeImage-1+this.imageArray.length) % this.imageArray.length);
    },
	
	animate: function(pmIntervall) {
		if(pmIntervall && pmIntervall > 0) {
			this.animator = new PeriodicalExecuter(this.next.bind(this), pmIntervall/1000); 
		}
		else {
			if(this.animator) {
				this.animator.stop();
				this.animator = null;
			}
		}
	},

    //
    //  updateDetails()
    //  Display caption, image number, and bottom nav.
    //
    updateDetails: function() {
		for(var i=0; i<this.infoContainer.childNodes.length; i++) {
			if(this.infoContainer.childNodes[i].style) {
				this.infoContainer.childNodes[i].style.display = "none";
			}
		}
	
		var infobox;
		if(this.imageArray[this.activeImage][1]) {
			infobox = document.getElementById("Vergroesserung_" + this.imageArray[this.activeImage][1]);
		}
        if(infobox) {
			this.infoContainer.appendChild(infobox);
			infobox.style.display = "block";
		}
		document.fire("ib:resize_content");
    },

    //
    //  preloadNeighborImages()
    //  Preload previous and next images.
    //
    preloadNeighborImages: function(){
        var preloadNextImage, preloadPrevImage;
        if (this.imageArray.length > this.activeImage + 1){
            preloadNextImage = new Image();
            preloadNextImage.src = this.imageArray[this.activeImage + 1][0];
        }
        if (this.activeImage > 0){
            preloadPrevImage = new Image();
            preloadPrevImage.src = this.imageArray[this.activeImage - 1][0];
        }
    
    },

    //
    //  end()
    //
    end: function() {
		this.animate(0);
		$(this.para + "_Vergroesserung").style.display = "none";
		$(this.para + "_Galerie").style.display = "block";
		document.fire("ib:resize_content");
    }

}

var SimpleLightboxInstance;

document.observe('dom:loaded', function () {
		SimpleLightboxInstance = new SimpleLightbox();
	}
);
