/**
 *  a very simple lightbox implementation that allows you to
 *  put any content in a modal style backed out window.  it
 *  inits itself automatically, to use just call...
 *
 *  lightbox.show( content, width, height );
 *
 */

var lightbox = new function() {

    var lightboxOverlay, lighboxContent;
    var width, height;
    var self = this;

    /**
     *  main access method, shows some content in the lightbox
     *
     *  @param HTMLElement content
     *
     */

    self.show = function( content, width, height ) {

        var pageSize = self.getPageSize();
        var close = $( '<a/>' )
                        .addClass( 'lightbox-close' )
                        .html( 'CLOSE' )
                        .attr({ href: 'javascript:;' })
                        .click( self.hide );

        self.width = width;
        self.height = height;

        lightboxContent
            .empty()
            .append( close )
            .append( content );

        // hide some objects to stop problems in IE
        $( 'embed, object, select' ).css({ 'visibility' : 'hidden' });

        self.positionLightbox( pageSize );

        lightboxOverlay.fadeIn(function(){
            lightboxContent.fadeIn(function(){
                // can't get this to appear after the main content has
                // faded in without this Timeout...
                setTimeout(function(){
                    close.css({ visibility: 'visible' })
                }, 1000 );
            });
        });

    };

    function detectMacXFF() {
        var userAgent = navigator.userAgent.toLowerCase();
        if (/firefox[\/\s](\d+\.\d+)/.test(userAgent)) {
          var ffversion = new Number(RegExp.$1);
          if (ffversion < 3 && userAgent.indexOf('mac') != -1) {
            return true;
          }
        }
        return false;
    };

    /**
     *  inits the lightbox ready for use
     *
     */

    self.init = function() {

        if ( detectMacXFF() ) {
            lightboxOverlay = $('<div/>')
                        .addClass( 'lightbox-overlay')
                        .css({
                            position: 'absolute',
                            top: 0,
                            left: 0,
                            backgroundImage: 'url(../custom/iwm/img/tme/opacity.png)',
                            backgroundRepeat: 'repeat'
                        })
                        .click( self.hide )
                        .hide();
        }
        else {
            lightboxOverlay = $('<div/>')
                        .addClass( 'lightbox-overlay')
                        .css({
                            position: 'absolute',
                            top: 0,
                            left: 0,
                            opacity: '0.7',
                            backgroundColor: '#000000'
                        })
                        .click( self.hide )
                        .hide();
        }

        lightboxContent = $( '<div/>' )
                        .addClass( 'lightbox-content')
                        .css({
                            position: 'absolute'
                        })
                        .hide();

        $( 'body' )
            .append( lightboxOverlay )
            .append( lightboxContent );

        // keep lightbox filling screen
        $( window ).resize(function(){
            var pageSize = self.getPageSize();
            self.positionLightbox( pageSize );
        });

    };

    /**
     *  hides the lightbox
     *
     */

    self.hide = function() {

        lightboxContent.hide();
        lightboxOverlay.fadeOut();
        lightboxContent.empty();

        $( 'embed, object, select' ).css({ 'visibility' : 'visible' });

    };

    /**
     *  resizes the lightbox to fill the screen
     *
     */

    self.positionLightbox = function( pageSize ) {

        lightboxOverlay.css({
            width: pageSize[0],
            height: pageSize[1]
        });

        var width = self.width;
        var height = self.height;
        var left = (pageSize[0] / 2) - (self.width / 2);
        var top = document.documentElement.scrollTop
                    ? document.documentElement.scrollTop
                    : document.body.scrollTop;

        if ( height && left )
            lightboxContent.css({
                width: width,
                height: height,
                left: left,
                top: top
            });

    };

    /**
     *  returns an array of page width and height
     *  (from quirksmode.com)
     *
     *  @return Array( width, height )
     *
     */

    self.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;
        }
        arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight);
        return arrayPageSize;
    };

};

$(function(){
    lightbox.init();
});