﻿/*-------------------------------GLOBAL VARIABLES------------------------------------*/

var detect = navigator.userAgent.toLowerCase();
var OS, browser, version, total, thestring;

/*-----------------------------------------------------------------------------------------------*/

//Browser detect script origionally created by Peter Paul Koch at http://www.quirksmode.org/
function getBrowserInfo() {
    if (checkIt('konqueror')) {
        browser = "Konqueror";
        OS = "Linux";
    }
    else if (checkIt('safari')) browser = "Safari"
    else if (checkIt('omniweb')) browser = "OmniWeb"
    else if (checkIt('opera')) browser = "Opera"
    else if (checkIt('webtv')) browser = "WebTV";
    else if (checkIt('icab')) browser = "iCab"
    else if (checkIt('msie')) browser = "Internet Explorer"
    else if (!checkIt('compatible')) {
        browser = "Netscape Navigator"
        version = detect.charAt(8);
    }
    else browser = "An unknown browser";
    if (!version) version = detect.charAt(place + thestring.length);

    if (!OS) {
        if (checkIt('linux')) OS = "Linux";
        else if (checkIt('x11')) OS = "Unix";
        else if (checkIt('mac')) OS = "Mac"
        else if (checkIt('win')) OS = "Windows"
        else OS = "an unknown operating system";
    }
}

function checkIt(string) {
    place = detect.indexOf(string) + 1;
    thestring = string;
    return place;
}

/*-----------------------------------------------------------------------------------------------*/
Event.observe(window, 'unload', Event.unloadCache, false);
var lightbox = Class.create();

lightbox.prototype = {

    yPos: 0,
    xPos: 0,

    initialize: function(ctrl) {
        this.content = ctrl.href;
        Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
        ctrl.onclick = function() { return false; };
    },

    // Turn everything on - mainly the IE fixes
    activate: function(iframeSrc) {
        if (browser == 'Internet Explorer') {
            this.getScroll();
            this.prepareIE('100%', 'hidden');
            this.setScroll(0, 0);
            this.hideSelects('hidden');
        }
        this.displayLightbox("block", iframeSrc);
    },

    // Ie requires height to 100% and overflow hidden or else you can scroll down past the lightbox
    prepareIE: function(height, overflow) {
        bod = document.getElementsByTagName('body')[0];
        bod.style.height = height;
        bod.style.overflow = overflow;

        htm = document.getElementsByTagName('html')[0];
        htm.style.height = height;
        htm.style.overflow = overflow;
    },

    // In IE, select elements hover on top of the lightbox
    hideSelects: function(visibility) {
        selects = document.getElementsByTagName('select');
        for (i = 0; i < selects.length; i++) {
            selects[i].style.visibility = visibility;
        }
    },

    // Taken from lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
    getScroll: function() {
        if (self.pageYOffset) {
            this.yPos = self.pageYOffset;
        } else if (document.documentElement && document.documentElement.scrollTop) {
            this.yPos = document.documentElement.scrollTop;
        } else if (document.body) {
            this.yPos = document.body.scrollTop;
        }
    },

    setScroll: function(x, y) {
        window.scrollTo(x, y);
    },

    displayLightbox: function(display, iframeSrc) {
        var content = '<div class="lbCloseBar"><a href="#" id="btnClose" rel="deactivate" ><img src="http://' + location.host + '/Assets/Images/close.gif" border="0"/></a></div><div>' +
        '<iframe src="' + iframeSrc + '" frameborder="0"  height="483" width="862" marginwidth="0" marginheight="0" scrolling="no" style="background-color:white;"></iframe></div>';
        info = '<div id="lbPPLContent">' + content + '</div>';

        $('lightbox').innerHTML = info;

        var IFRAME_WIDTH = 830;
        var DIALOG_WIDTH = IFRAME_WIDTH + 32; //16x2
        var IFRAME_HEIGHT = 483;
        var DIALOG_HEIGHT = IFRAME_HEIGHT;
        $('lightbox').style.top = (YAHOO.util.Dom.getViewportHeight() - DIALOG_HEIGHT) / 2 + "px";
        $('lightbox').style.left = (YAHOO.util.Dom.getViewportWidth() - DIALOG_WIDTH) / 2 + "px";

        $('lightbox').style.display = display;

        //Actions
        Event.observe($('btnClose'), 'click', this['deactivate'].bindAsEventListener(this), false);
        $('btnClose').onclick = function() { return false; };


        if (browser == 'Safari') {
            $('lightbox').style.width = IFRAME_WIDTH + "px";
            $('lightbox').style.height = IFRAME_HEIGHT + "px";

            $('lightbox').className = "done";
        }
        else {
            $('overlay').style.display = display;

            var attributes = { opacity: { from: 0, to: 0.3} };
            var darken = new YAHOO.util.Anim('overlay', attributes, .3);
            darken.animate();

            var wAnim = new YAHOO.util.Anim('lightbox', {
                width: { to: DIALOG_WIDTH }
            }, 1, YAHOO.util.Easing.easeOut);

            var hAnim = new YAHOO.util.Anim('lightbox', {
                height: { to: DIALOG_HEIGHT }
            }, 1, YAHOO.util.Easing.easeOut);

            hAnim.onComplete.subscribe(
				function() {
				    $('lightbox').className = "done";
				}
			);

            wAnim.onComplete.subscribe(
				function() {
				    hAnim.animate();
				}
			);

            wAnim.animate();
        }
    },

    // Example of creating your own functionality once lightbox is initiated
    deactivate: function() {
        Element.remove($('lbPPLContent'));

        if (browser == "Internet Explorer") {
            this.setScroll(0, this.yPos);
            this.prepareIE("auto", "auto");
            this.hideSelects("visible");
        }
        this.displayLightbox("none", '');
    },

    activator: function() {
        this.deactivate();
        window.open(surveyURL, '', 'width=700,height=500,left=200,top=200,resizable=1,scrollbars=1').blur();
        window.focus();
    }

}

/*-----------------------------------------------------------------------------------------------*/

// Onload, make all links that need to trigger a lightbox active
function initialize() {
    if (!document.getElementById('overlay')) {
        addLightboxMarkup();
    }
    lbox = document.getElementsByClassName('lbOn');
    for (i = 0; i < lbox.length; i++) {
        valid = new lightbox(lbox[i]);
    }
}

// Add in markup necessary to make this work. Basically two divs:
// Overlay holds the shadow
// Lightbox is the centered square that the content is put into.
function addLightboxMarkup() {
    bod = document.getElementsByTagName('body')[0];
    overlay = document.createElement('div');
    overlay.id = 'overlay';
    lb = document.createElement('div');
    lb.id = 'lightbox';
    lb.className = 'loading';
    lb.innerHTML = '<div id="lbLoadMessage">' +
						  '<p>Loading</p>' +
						  '</div>';
    bod.appendChild(overlay);
    bod.appendChild(lb);
}


/*-----------------------------------------------------------------------------------------------*/

// How it Works popup.
function showPopUp(divid, control, Xwidth, Yheight) {

    var elements = document.getElementsByClassName('popupcontent');
    for (var j = 0; j < elements.length; j++) {
        elements[j].style.display = "none";
    }
    // First, determine how much the visitor has scrolled
    var scrolledX, scrolledY;
    if (self.pageYOffset) {
        scrolledX = self.pageXOffset;
        scrolledY = self.pageYOffset;
    } else if (document.documentElement && document.documentElement.scrollTop) {
        scrolledX = document.documentElement.scrollLeft;
        scrolledY = document.documentElement.scrollTop;
    } else if (document.body) {
        scrolledX = document.body.scrollLeft;
        scrolledY = document.body.scrollTop;
    }

    // Next, determine the coordinates of the center of browser's window
    var centerX, centerY;
    if (self.innerHeight) {
        centerX = self.innerWidth;
        centerY = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) {
        centerX = document.documentElement.clientWidth;
        centerY = document.documentElement.clientHeight;
    } else if (document.body) {
        centerX = document.body.clientWidth;
        centerY = document.body.clientHeight;
    }

    // Xwidth is the width of the div, Yheight is the height of the
    // div passed as arguments to the function:
    var leftOffset = scrolledX + (centerX - Xwidth) / 2;
    var topOffset = scrolledY + (centerY - Yheight) / 2;
    // The initial width and height of the div can be set in the
    // style sheet with display:none; divid is passed as an argument to // the function
    var o = $(divid + '_content');
    var r = o.style;
    r.position = 'absolute';
    r.top = topOffset + 'px';
    r.top = '110px';
    r.left = '145px';
    
    r.display = "block";
    if (divid.match('feedback') == null) {
        $(divid + '_body').style.height = Yheight + "px";
    }
    $(divid + '_content').style.width = Xwidth + "px";

    return false;
}

function closePopUp(popUp) {
    $(popUp).style.display = "none";
}


// The createLightboxForPPL is used by Optimost to display the lightbox modal for PPL pages.
function createLightboxForPPL(iframeSrc) {
    if (iframeSrc != "0") {
        getBrowserInfo();
        initialize();
        lbox = document.createElement('a');
        lbox.setAttribute('href', '');
        pop = new lightbox(lbox);
        pop.activate(iframeSrc);
    }
}