//***********************************************************************************************************************************/
//    LyteBox v3.22
//
//     Author: Markus F. Hay
//  Website: http://www.dolem.com/lytebox
//       Date: October 2, 2007
//    License: Creative Commons Attribution 3.0 License (http://creativecommons.org/licenses/by/3.0/)
// Browsers: Tested successfully on WinXP with the following browsers (using no DOCTYPE and Strict/Transitional/Loose DOCTYPES):
//                * Firefox: 2.0.0.7, 1.5.0.12
//                * Internet Explorer: 7.0, 6.0 SP2, 5.5 SP2
//                * Opera: 9.23
//
// Releases: For up-to-date and complete release information, visit http://www.dolem.com/forum/showthread.php?tid=62
//                * v3.22 (10/02/07)
//                * v3.21 (09/30/07)
//                * v3.20 (07/12/07)
//                * v3.10 (05/28/07)
//                * v3.00 (05/15/07)
//                * v2.02 (11/13/06)
//
//   Credit: LyteBox was originally derived from the Lightbox class (v2.02) that was written by Lokesh Dhakar. For more
//             information please visit http://huddletogether.com/projects/lightbox2/
//***********************************************************************************************************************************/

String.prototype.trim = function () { return this.replace(/^\s+|\s+$/g, ''); }

myLytebox = null;

function LyteBox() {
    /*** Start Global Configuration ***/
        this.theme                = 'grey'; // themes: grey (default), red, green, blue, gold
        this.defaultStyles        = 'width: 400px; height: 400px; scrolling: auto;'; // werden genutzt, wenn der Funktion start keine styles fuer das iFrame uebergeben werden
        this.outerBorder          = false;  // controls whether to show the outer grey (or theme) border
        this.resizeSpeed          = 8;      // controls the speed of the image resizing (1=slowest and 10=fastest)
        this.maxOpacity           = 80;     // higher opacity = darker overlay, lower opacity = lighter overlay
        this.doAnimations         = true;   // controls whether or not "animate" Lytebox, i.e. resize transition between images, fade in/out effects, etc.
        this.closeOnOverlayClick  = false;   // controls wether a click on the overlay area closes the lytebox
        this.closeOnMainClick     = true;   // controls wether a click on the main area closes the lytebox
        this.borderSize           = 0;      // if you adjust the padding in the CSS, you will need to update this variable -- otherwise, leave this alone...
        this.doPageReload         = false;  // Reload der aufrufenden Seite ausfuehren, nachdem die Lytebox geschlossen wird (globale Einstellung, kann bei closeLytebox ind. mitgegeben werden)
        this.ie6BodyHack          = true;   // erweitert das Overlay auf Window-Breite, falls body eine width kleiner als Fensterbreite hat
        this.methodsToCallOnClose = null;   // Ueber showLytebox uebergebene Methodenreferenzen (Array), die aufgerufen werden, wenn die Lytebox geschlossen wird
    /*** End Global Configuration ***/

    if(this.resizeSpeed > 10) { this.resizeSpeed = 10; }
    if(this.resizeSpeed < 1) { resizeSpeed = 1; }
    this.resizeDuration        = (11 - this.resizeSpeed) * 0.15;
    this.resizeWTimerArray     = new Array();
    this.resizeWTimerCount     = 0;
    this.resizeHTimerArray     = new Array();
    this.resizeHTimerCount     = 0;
    this.showContentTimerArray = new Array();
    this.showContentTimerCount = 0;
    this.overlayTimerArray     = new Array();
    this.overlayTimerCount     = 0;
    this.timerIDArray          = new Array();
    this.timerIDCount          = 0;
    this.frameArray            = new Array();
    this.activeFrame           = null;
    /*@cc_on
        /*@if (@_jscript)
            this.ie = (document.all && !window.opera) ? true : false;
        /*@else @*/
            this.ie = false;
        /*@end
    @*/
    this.ie7 = (this.ie && window.XMLHttpRequest);
    this.doc = document;
}

function showLytebox(link, styles, methodsToCallOnClose) {
    if (!styles) {
        style = this.defaultStyles;
    }

    // Initialize
    if (!myLytebox) {
        this.myLytebox = new LyteBox();
    }
    this.myLytebox.initialize();

    this.myLytebox.methodsToCallOnClose = methodsToCallOnClose;

    // Start Lytebox
    this.myLytebox.start(link, styles);
}

function closeLytebox(doPageReload, focusOnId) {
    // Falls vorhanden, Element mit der uebergebenen ID den Focus zuweisen
    if (document.getElementById(focusOnId)) {
         document.getElementById(focusOnId).focus();
    }
    this.myLytebox.end(doPageReload);
}

LyteBox.prototype.initialize = function() {
    var objBody = this.doc.getElementsByTagName("body").item(0);

    if (this.doc.getElementById('lbOverlay')) {
        objBody.removeChild(this.doc.getElementById("lbOverlay"));
        objBody.removeChild(this.doc.getElementById("lbMain"));
    }

    var objOverlay = this.doc.createElement("div");
        objOverlay.setAttribute('id','lbOverlay');
        objOverlay.setAttribute((this.ie ? 'className' : 'class'), this.theme);
        // hier kommt der Hack fuer die Breitenkorrektur des Overlays in IE6
        if (this.ie6BodyHack){
                var theWidth = document.documentElement.clientWidth;
                objOverlay.style.width = theWidth + "px";
            }
        // Ende des Hacks
        if ((this.ie && !this.ie7) || (this.ie7 && this.doc.compatMode == 'BackCompat')) {
            objOverlay.style.position = 'absolute';
        }
        objOverlay.style.display = 'none';
        objBody.appendChild(objOverlay);
    var objLytebox = this.doc.createElement("div");
        objLytebox.setAttribute('id','lbMain');
        objLytebox.style.display = 'none';
        objBody.appendChild(objLytebox);
    var objOuterContainer = this.doc.createElement("div");
        objOuterContainer.setAttribute('id','lbOuterContainer');
        objOuterContainer.setAttribute((this.ie ? 'className' : 'class'), this.theme);
        objLytebox.appendChild(objOuterContainer);
    var objIframeContainer = this.doc.createElement("div");
        objIframeContainer.setAttribute('id','lbIframeContainer');
        objIframeContainer.style.display = 'none';
        objOuterContainer.appendChild(objIframeContainer);
    var objIframe = this.doc.createElement("iframe");
        objIframe.setAttribute('id','lbIframe');
        objIframe.setAttribute('name','lbIframe');
        objIframe.style.display = 'none';
        objIframeContainer.appendChild(objIframe);
    var objLoading = this.doc.createElement("div");
        objLoading.setAttribute('id','lbLoading');
        objOuterContainer.appendChild(objLoading);
};

LyteBox.prototype.start = function(link, styles) {
    if (this.ie && !this.ie7) {
        this.toggleSelects('hide');
    }

    var pageSize    = this.getPageSize();
    var objOverlay    = this.doc.getElementById('lbOverlay');
    var objBody        = this.doc.getElementsByTagName("body").item(0);

    objOverlay.style.height = pageSize[1] + "px";
    objOverlay.style.display = '';
    this.appear('lbOverlay', (this.doAnimations ? 0 : this.maxOpacity));

    // lyteframe init
    this.frameArray = [];
    this.frameNum = 0;
    this.frameArray.push(new Array(link, styles));

    var object = this.doc.getElementById('lbMain');
        object.style.top = (this.getPageScroll() + (pageSize[3] / 15)) + "px";
        object.style.display = '';
    if (!this.outerBorder) {
        this.doc.getElementById('lbOuterContainer').style.border = 'none';
    } else {
        this.doc.getElementById('lbOuterContainer').style.borderBottom = '';
        this.doc.getElementById('lbOuterContainer').setAttribute((this.ie ? 'className' : 'class'), this.theme);
    }

    // Close on main or overlay click
    if (this.closeOnOverlayClick) {
        this.doc.getElementById('lbOverlay').onclick = function() { myLytebox.end(this.doPageReload); return false; }
    }
    if (this.closeOnMainClick) {
        this.doc.getElementById('lbMain').onclick = function(e) {
            var e = e;
            if (!e) {
                if (window.parent.frames[window.name] && (parent.document.getElementsByTagName('frameset').length <= 0)) {
                    e = window.parent.window.event;
                } else {
                    e = window.event;
                }
            }
            var id = (e.target ? e.target.id : e.srcElement.id);
            if (id == 'lbMain') { myLytebox.end(this.doPageReload); return false; }
        }
    }

    this.changeContent(this.frameNum);
};

LyteBox.prototype.end = function(doPageReload) {
    this.doc.getElementById('lbMain').style.display = 'none';
    this.fade('lbOverlay', (this.doAnimations ? this.maxOpacity : 0));
    if (this.ie && !this.ie7) {
        this.toggleSelects('visible');
    }
    if (doPageReload){
        document.location.href=document.location.href;
    }
    if (this.methodsToCallOnClose != null && this.methodsToCallOnClose.length > 0) {
        for (var i = 0; i < this.methodsToCallOnClose.length; ++i) {
            eval(this.methodsToCallOnClose[i]);
        }
    }
};

LyteBox.prototype.changeContent = function(frameNum) {
    this.activeFrame = frameNum;

    if (!this.outerBorder) {
        this.doc.getElementById('lbOuterContainer').style.border = 'none';
    } else {
        this.doc.getElementById('lbOuterContainer').style.borderBottom = '';
        this.doc.getElementById('lbOuterContainer').setAttribute((this.ie ? 'className' : 'class'), this.theme);
    }
    this.doc.getElementById('lbLoading').style.display = '';
    this.doc.getElementById('lbIframe').style.display = 'none';
    this.doc.getElementById('lbIframeContainer').style.display = 'none';

    var iframe = myLytebox.doc.getElementById('lbIframe');
    var styles = this.frameArray[this.activeFrame][1];
    var aStyles = styles.split(';');
    for (var i = 0; i < aStyles.length; i++) {
        if (aStyles[i].indexOf('width:') >= 0) {
            var w = aStyles[i].replace('width:', '');
            iframe.width = w.trim();
        } else if (aStyles[i].indexOf('height:') >= 0) {
            var h = aStyles[i].replace('height:', '');
            iframe.height = h.trim();
        } else if (aStyles[i].indexOf('scrolling:') >= 0) {
            var s = aStyles[i].replace('scrolling:', '');
            iframe.scrolling = s.trim();
        }
    }
    this.resizeContainer(parseInt(iframe.width), parseInt(iframe.height));
};

LyteBox.prototype.resizeContainer = function(iframeWidth, iframeHeight) {
    this.wCur = this.doc.getElementById('lbOuterContainer').offsetWidth;
    this.hCur = this.doc.getElementById('lbOuterContainer').offsetHeight;
    this.xScale = ((iframeWidth  + (this.borderSize * 2)) / this.wCur) * 100;
    this.yScale = ((iframeHeight  + (this.borderSize * 2)) / this.hCur) * 100;
    var wDiff = (this.wCur - this.borderSize * 2) - iframeWidth;
    var hDiff = (this.hCur - this.borderSize * 2) - iframeHeight;

    if (!(hDiff == 0)) {
        this.hDone = false;
        this.resizeH('lbOuterContainer', this.hCur, iframeHeight + this.borderSize*2, this.getPixelRate(this.hCur, iframeHeight));
    } else {
        this.hDone = true;
    }
    if (!(wDiff == 0)) {
        this.wDone = false;
        this.resizeW('lbOuterContainer', this.wCur, iframeWidth + this.borderSize*2, this.getPixelRate(this.wCur, iframeWidth));
    } else {
        this.wDone = true;
    }
    if ((hDiff == 0) && (wDiff == 0)) {
        if (this.ie){ this.pause(250); } else { this.pause(100); }
    }

    this.showContent();
};

LyteBox.prototype.showContent = function() {
    if (this.wDone && this.hDone) {
        for (var i = 0; i < this.showContentTimerCount; i++) { window.clearTimeout(this.showContentTimerArray[i]); }
        if (this.outerBorder) {
            this.doc.getElementById('lbOuterContainer').style.borderBottom = 'none';
        }
        this.doc.getElementById('lbLoading').style.display = 'none';

        this.doc.getElementById('lbIframe').style.display = '';
        this.appear('lbIframe', (this.doAnimations ? 0 : 100));

        this.doc.getElementById('lbIframeContainer').style.display = '';
        try {
            this.doc.getElementById('lbIframe').src = this.frameArray[this.activeFrame][0];
        } catch(e) {
        }
    } else {
        this.showContentTimerArray[this.showContentTimerCount++] = setTimeout("myLytebox.showContent()", 200);
    }
};

LyteBox.prototype.appear = function(id, opacity) {
    var object = this.doc.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + (opacity + 10) + ")";

    if (opacity == 100 && (id == 'lbImage' || id == 'lbIframe')) {
        try { object.removeAttribute("filter"); } catch(e) {}    /* Fix added for IE Alpha Opacity Filter bug. */
    } else if (opacity >= this.maxOpacity && id == 'lbOverlay') {
        for (var i = 0; i < this.overlayTimerCount; i++) { window.clearTimeout(this.overlayTimerArray[i]); }
        return;
    } else {
        this.overlayTimerArray[this.overlayTimerCount++] = setTimeout("myLytebox.appear('" + id + "', " + (opacity+20) + ")", 1);
    }
};

LyteBox.prototype.fade = function(id, opacity) {
    var object = this.doc.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
    if (opacity <= 0) {
        try {
            object.display = 'none';
        } catch(err) { }
    } else if (id == 'lbOverlay') {
        this.overlayTimerArray[this.overlayTimerCount++] = setTimeout("myLytebox.fade('" + id + "', " + (opacity-20) + ")", 1);
    } else {
        this.timerIDArray[this.timerIDCount++] = setTimeout("myLytebox.fade('" + id + "', " + (opacity-10) + ")", 1);
    }
};

LyteBox.prototype.resizeW = function(id, curW, maxW, pixelrate, speed) {
    if (!this.hDone) {
        this.resizeWTimerArray[this.resizeWTimerCount++] = setTimeout("myLytebox.resizeW('" + id + "', " + curW + ", " + maxW + ", " + pixelrate + ")", 100);
        return;
    }
    var object = this.doc.getElementById(id);
    var timer = speed ? speed : (this.resizeDuration/2);
    var newW = (this.doAnimations ? curW : maxW);
    object.style.width = (newW) + "px";
    if (newW < maxW) {
        newW += (newW + pixelrate >= maxW) ? (maxW - newW) : pixelrate;
    } else if (newW > maxW) {
        newW -= (newW - pixelrate <= maxW) ? (newW - maxW) : pixelrate;
    }
    this.resizeWTimerArray[this.resizeWTimerCount++] = setTimeout("myLytebox.resizeW('" + id + "', " + newW + ", " + maxW + ", " + pixelrate + ", " + (timer+0.02) + ")", timer+0.02);
    if (parseInt(object.style.width) == maxW) {
        this.wDone = true;
        for (var i = 0; i < this.resizeWTimerCount; i++) { window.clearTimeout(this.resizeWTimerArray[i]); }
    }
};

LyteBox.prototype.resizeH = function(id, curH, maxH, pixelrate, speed) {
    var timer = speed ? speed : (this.resizeDuration/2);
    var object = this.doc.getElementById(id);
    var newH = (this.doAnimations ? curH : maxH);
    object.style.height = (newH) + "px";
    if (newH < maxH) {
        newH += (newH + pixelrate >= maxH) ? (maxH - newH) : pixelrate;
    } else if (newH > maxH) {
        newH -= (newH - pixelrate <= maxH) ? (newH - maxH) : pixelrate;
    }
    this.resizeHTimerArray[this.resizeHTimerCount++] = setTimeout("myLytebox.resizeH('" + id + "', " + newH + ", " + maxH + ", " + pixelrate + ", " + (timer+.02) + ")", timer+.02);
    if (parseInt(object.style.height) == maxH) {
        this.hDone = true;
        for (var i = 0; i < this.resizeHTimerCount; i++) { window.clearTimeout(this.resizeHTimerArray[i]); }
    }
};

LyteBox.prototype.getPageScroll = function() {
    if (self.pageYOffset) {
        return self.pageYOffset;
    } else if (this.doc.documentElement && this.doc.documentElement.scrollTop){
        return this.doc.documentElement.scrollTop;
    } else if (document.body) {
        return this.doc.body.scrollTop;
    }
};

LyteBox.prototype.getPageSize = function() {
    var xScroll, yScroll, windowWidth, windowHeight;
    if (window.innerHeight && window.scrollMaxY) {
        xScroll = this.doc.scrollWidth;
        yScroll = self.innerHeight + self.scrollMaxY;
    } else if (this.doc.body.scrollHeight > this.doc.body.offsetHeight){
        xScroll = this.doc.body.scrollWidth;
        yScroll = this.doc.body.scrollHeight;
    } else {
        xScroll = this.doc.getElementsByTagName("html").item(0).offsetWidth;
        yScroll = this.doc.getElementsByTagName("html").item(0).offsetHeight;
        xScroll = (xScroll < this.doc.body.offsetWidth) ? this.doc.body.offsetWidth : xScroll;
        yScroll = (yScroll < this.doc.body.offsetHeight) ? this.doc.body.offsetHeight : yScroll;
    }
    if (self.innerHeight) {
        windowWidth = self.innerWidth;
        windowHeight = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) {
        windowWidth = this.doc.documentElement.clientWidth;
        windowHeight = this.doc.documentElement.clientHeight;
    } else if (document.body) {
        windowWidth = this.doc.getElementsByTagName("html").item(0).clientWidth;
        windowHeight = this.doc.getElementsByTagName("html").item(0).clientHeight;
        windowWidth = (windowWidth == 0) ? this.doc.body.clientWidth : windowWidth;
        windowHeight = (windowHeight == 0) ? this.doc.body.clientHeight : windowHeight;
    }
    var pageHeight = (yScroll < windowHeight) ? windowHeight : yScroll;
    var pageWidth = (xScroll < windowWidth) ? windowWidth : xScroll;
    return new Array(pageWidth, pageHeight, windowWidth, windowHeight);
};

LyteBox.prototype.getPixelRate = function(cur, img) {
    var diff = (img > cur) ? img - cur : cur - img;
    if (diff >= 0 && diff <= 100) { return 10; }
    if (diff > 100 && diff <= 200) { return 15; }
    if (diff > 200 && diff <= 300) { return 20; }
    if (diff > 300 && diff <= 400) { return 25; }
    if (diff > 400 && diff <= 500) { return 30; }
    if (diff > 500 && diff <= 600) { return 35; }
    if (diff > 600 && diff <= 700) { return 40; }
    if (diff > 700) { return 45; }
};

LyteBox.prototype.toggleSelects = function(state) {
    var selects = this.doc.getElementsByTagName("select");
    for (var i = 0; i < selects.length; i++ ) {
        selects[i].style.visibility = (state == "hide") ? 'hidden' : 'visible';
    }
};


