//
//  Configurationl
//
InfoboxOptions = Object.extend({
    fileLoadingImage:        'images/loading.gif',
    fileBottomNavCloseImage: 'images/closelabel.gif',

    overlayOpacity: 0.8,   // controls transparency of shadow overlay

    animate: true,         // toggles resizing animations
    resizeSpeed: 7,        // controls the speed of the image resizing animations (1=slowest and 10=fastest)

    borderSize: 10,         //if you adjust the padding in the CSS, you will need to update this variable

	// When grouping images this is used to write: Image # of #.
	// Change it for non-english localization
	labelImage: "Image",
	labelOf: "of"
}, window.InfoOptions || {});


var Infobox = Class.create();

Infobox.prototype = {

    // 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() {

        var objBody = $$('body')[0];

		overlayObj = document.createElement("DIV");
		overlayObj.id = 'infobox_overlay_container';

		overlayContentObj = document.createElement("DIV");
		overlayContentObj.id = 'infobox_content_container';

		objBody.appendChild(overlayObj);
		objBody.appendChild(overlayContentObj);
		$('infobox_overlay_container').hide();
		$('infobox_content_container').hide();

        var arrayPageSize = this.getPageSize();

        $('infobox_overlay_container').setStyle({
								width: arrayPageSize[0] + 'px',
								height: arrayPageSize[1] + 'px',
						        'background' : 'url(images/opac_filter.png)',
        						'position' : 'absolute',
        						'left'		: '0px',
        						'top'		: '132px',
        						'z-index'	: '2'
        						});

        $('infobox_content_container').setStyle({
        						'background'	: '#ffffff',
        						'width'			: '400px',
        						'height'		: '300px',
        						'position' 		: 'absolute',
        						'left'			: '0px',
        						'z-index'		: '3',
        						'top'			: '133px'
						        });
	},

	showInfoBox: function(content, type, width, height) {
		$('infobox_overlay_container').hide();
		$('infobox_content_container').update('');

		var arrayPageSize = this.getPageSize();
        $('infobox_overlay_container').setStyle({
								width: arrayPageSize[0] + 'px',
								height: arrayPageSize[1] + 'px'
								});

		$('infobox_overlay_container').appear({from: 0.0, to: 0.8, duration: 0.05});
		$('top').scrollTo();

		var left = (arrayPageSize[0] / 2) - ($('infobox_content_container').getWidth() / 2);
		//center content container
		$('infobox_content_container').setStyle({
										'left'	: left
									});

		if(height !== undefined) {
				$('infobox_content_container').setStyle({
										'height'	: height+'px'
									});
		}
		if(width !== undefined) {
				$('infobox_content_container').setStyle({
										'width'	: width+'px'
									});
		}

		if (type == 'OK') {
			content = '<div class="center"><br/><br/>' + content + '</div><div class="center infoboxButtonBar"><button onclick="Infobox.close();">O.k.</button></div>';
			$('infobox_content_container').setStyle({
				'height': '140px'
			});
		}

		if(type == 'LOAD') {
			content = '<div class="center"><br/><br/><br/>Daten werden geladen!<br/><br/><img src="images/0/loading.gif"/><br/><br/>Bitte warten...</div>';
				$('infobox_content_container').setStyle({
										'height'	: '200px'
									});
		}

		$('infobox_content_container').hide();
		setTimeout("Effect.BlindDown('infobox_content_container', {duration: 0.5, scaleFrom: 0, scaleTo: 100})", 300);
		setTimeout("$('infobox_content_container').update('"+content+"')",800);
	},

	close: function() {
		$('infobox_content_container').update('');
		Effect.BlindUp('infobox_content_container', {duration: 0.5});
		setTimeout("$('infobox_overlay_container').fade({from: 0.8, to: 0.0, duration: 0.1})", 600);
	},

    //
    //  getPageSize()
    //
    getPageSize: function() {

	     var xScroll, yScroll;

		if (window.innerHeight && window.scrollMaxY) {
			xScroll = window.innerWidth + window.scrollMaxX;
			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];
	},

    //
    //  end()
    //
    end: function() {
        this.disableKeyboardNav();
        this.infobox.hide();
        new Effect.Fade(this.overlay, { duration: this.overlayDuration });
        $$('select', 'object', 'embed').each(function(node){ node.style.visibility = 'visible' });
    },

    //
    //  enableKeyboardNav()
    //
    enableKeyboardNav: function() {
        document.observe('keydown', this.keyboardAction);
    },

    //
    //  disableKeyboardNav()
    //
    disableKeyboardNav: function() {
        document.stopObserving('keydown', this.keyboardAction);
    },

    //
    //  keyboardAction()
    //
    keyboardAction: function(event) {
        var keycode = event.keyCode;

        var escapeKey;
        if (event.DOM_VK_ESCAPE) {  // mozilla
            escapeKey = event.DOM_VK_ESCAPE;
        } else { // ie
            escapeKey = 27;
        }

        var key = String.fromCharCode(keycode).toLowerCase();

        if (key.match(/x|o|c/) || (keycode == escapeKey)){ // close lightbox
            this.end();
        } else if ((key == 'p') || (keycode == 37)){ // display previous image
            if (this.activeImage != 0){
                this.disableKeyboardNav();
                this.changeImage(this.activeImage - 1);
            }
        } else if ((key == 'n') || (keycode == 39)){ // display next image
            if (this.activeImage != (this.imageArray.length - 1)){
                this.disableKeyboardNav();
                this.changeImage(this.activeImage + 1);
            }
        }
    }
}

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