//var loadingImage = '/lightbox/loading.gif';
//var closeButton = '/lightbox/close.gif';
var lastBox = '';		

// getPageScroll()
// Returns array with x,y page scroll values.
// Core code from - quirksmode.org
function getPageScroll() {
    var yScroll;
    if (self.pageYOffset) {
        yScroll = self.pageYOffset;
    } else if (document.documentElement && document.documentElement.scrollTop) {	 // Explorer 6 Strict
        yScroll = document.documentElement.scrollTop;
    } else if (document.body) {// all other Explorers
        yScroll = document.body.scrollTop;
    }

    arrayPageScroll = new Array('', yScroll)
    return arrayPageScroll;
}

// getPageSize()
// Returns array with page width, height and window width, height
// Core code from - quirksmode.org
// Edit for Firefox by pHaez
function getPageSize() {
    var xScroll, yScroll;

    if (window.innerHeight && window.scrollMaxY) {
        xScroll = document.body.scrollWidth;
        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
        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 = windowWidth;
    } else {
        pageWidth = xScroll;
    }


    arrayPageSize = new Array(pageWidth, pageHeight, windowWidth, windowHeight)
    return arrayPageSize;
}


// pause(numberMillis)
// Pauses code execution for specified time. Uses busy code, not good.
// Code from http://www.faqts.com/knowledge_base/view.phtml/aid/1602
function pause(numberMillis) {
    var now = new Date();
    var exitTime = now.getTime() + numberMillis;
    while (true) {
        now = new Date();
        if (now.getTime() > exitTime)
            return;
    }
}

// getKey(key)
// Gets keycode. If ESC is pressed then it hides the lightbox.
function getKey(e) {
    var keycode = (window.event) ? event.keyCode : e.keyCode;  // MSIE:Firefox
    var escape = (window.event) ? 27 : e.DOM_VK_ESCAPE;  // MSIE:Firefox
    if (keycode == escape) { hideLightbox(); }
}

// listenKey()
function listenKey () {	document.onkeypress = getKey; }

// showLightbox()
// Preloads images. Pleaces new image in lightbox then centers and displays.
function showLightbox(objLink) {
    // prep objects
    var objOverlay = document.getElementById('overlay');
    var objLightbox = document.getElementById('lightbox');
    var objCaption = document.getElementById('lightboxCaption');
    var objImage = document.getElementById('lightboxImage');
    //var objLoadingImage = document.getElementById('loadingImage');
    var objLightboxDetails = document.getElementById('lightboxDetails');


    var arrayPageSize = getPageSize();
    var arrayPageScroll = getPageScroll();

    // center loadingImage if it exists
    //if (objLoadingImage) {
    //    objLoadingImage.style.top = (arrayPageScroll[1] + ((arrayPageSize[3] - 35 - objLoadingImage.height) / 2) + 'px');
    //    objLoadingImage.style.left = (((arrayPageSize[0] - 20 - objLoadingImage.width) / 2) + 'px');
    //    objLoadingImage.style.display = 'block';
    //}

    // set height of Overlay to take up whole page and show
    objOverlay.onclick = function() { hideLightbox(); return false; }
    objOverlay.style.height = (arrayPageSize[1] + 'px');
    objOverlay.style.display = 'block';

    // preload image
    imgPreload = new Image();

    imgPreload.onload = function() {
        objImage.src = objLink.href;

        // center lightbox and make sure that the top and left values are not negative
        // and the image placed outside the viewport
        var lightboxTop = arrayPageScroll[1] + ((arrayPageSize[3] - 35 - imgPreload.height) / 2);
        var lightboxLeft = ((arrayPageSize[0] - 20 - imgPreload.width) / 2);

        objLightbox.style.top = (lightboxTop < 0) ? "0px" : lightboxTop + "px";
        objLightbox.style.left = (lightboxLeft < 0) ? "0px" : lightboxLeft + "px";


        objLightboxDetails.style.width = imgPreload.width + 'px';

        if (objLink.getAttribute('title')) {
            objCaption.style.display = 'block';
            //objCaption.style.width = imgPreload.width + 'px';
            objCaption.innerHTML = objLink.getAttribute('title');
        } else {
            objCaption.style.display = 'none';
        }

        // A small pause between the image loading and displaying is required with IE,
        // this prevents the previous image displaying for a short burst causing flicker.
        if (navigator.appVersion.indexOf("MSIE") != -1) {
            pause(250);
        }

        //if (objLoadingImage) { objLoadingImage.style.display = 'none'; }
        objLightbox.style.display = 'block';

        // After image is loaded, update the overlay height as the new image might have
        // increased the overall page height.
        arrayPageSize = getPageSize();
        objOverlay.style.height = (arrayPageSize[1] + 'px');

        // Check for 'x' keypress
        listenKey();

        return false;
    }

    imgPreload.src = objLink.href;
}

// showVideobox()
function showVideobox(objLink) {
    // prep objects
    var objOverlay = document.getElementById('overlay');
    var objVideobox = document.getElementById('videobox');

    var arrayPageSize = getPageSize();
    var arrayPageScroll = getPageScroll();

    // set height of Overlay to take up whole page and show
    objOverlay.onclick = function() { hideLightbox(); return false; }
    objOverlay.style.height = (arrayPageSize[1] + 'px');
    objOverlay.style.display = 'block';

    // center lightbox and make sure that the top and left values are not negative
    // and the image placed outside the viewport
    var videoboxTop = arrayPageScroll[1] + ((arrayPageSize[3] - 35 - 355) / 2);
    var videoboxLeft = ((arrayPageSize[0] - 20 - 425) / 2);
    objVideobox.style.top = (videoboxTop < 0) ? "0px" : videoboxTop + "px";
    objVideobox.style.left = (videoboxLeft < 0) ? "0px" : videoboxLeft + "px";

    var url = objLink.href; // + '?rel=0&autoplay=1&egm=0';
    objVideobox.innerHTML = '<object width="425" height="355"><param name="movie" value="' + url + '" /><param name="rel" value="false" /><param name="autoplay" value="true" /><param name="egm" value="false" /><embed src="' + url + '" rel="false" autoplay="true" egm="false" type="application/x-shockwave-flash" width="425" height="355" /></object><br />press <kbd>x</kbd> to close';
    objVideobox.style.display = 'block';
    listenKey();
}

/// showPostbackBox()
function showPostbackbox(objId) {
    var objOverlay = document.getElementById('overlay');
    var objPostbackbox = document.getElementById(objId);
    var arrayPageSize = getPageSize();
    var arrayPageScroll = getPageScroll();

    objOverlay.onclick = function() { return false; }
    objOverlay.style.height = (arrayPageSize[1] + 'px');
    objOverlay.style.display = 'block';

    var postbackboxTop = arrayPageScroll[1] + ((arrayPageSize[3] - 35 - 355) / 2);
    var postbackboxLeft = ((arrayPageSize[0] - 20 - 425) / 2);
    objPostbackbox.style.top = (postbackboxTop < 0) ? "0px" : postbackboxTop + "px";
    objPostbackbox.style.left = (postbackboxLeft < 0) ? "0px" : postbackboxLeft + "px";
    objPostbackbox.style.zIndex = '100';
    objPostbackbox.style.display = 'block';
    lastBox = objId;
    listenKey();
}

/// showHtmlBox()
function showHtmlbox(html) {
    var objOverlay = document.getElementById('overlay');
    var objVideobox = document.getElementById('videobox');
    var arrayPageSize = getPageSize();
    var arrayPageScroll = getPageScroll();

    objOverlay.onclick = function() { return false; }
    objOverlay.style.height = (arrayPageSize[1] + 'px');
    objOverlay.style.display = 'block';

    var videoboxTop = arrayPageScroll[1] + ((arrayPageSize[3] - 35 - 355) / 2);
    var videoboxLeft = ((arrayPageSize[0] - 20 - 425) / 2);
    objVideobox.style.top = (videoboxTop < 0) ? "0px" : videoboxTop + "px";
    objVideobox.style.left = (videoboxLeft < 0) ? "0px" : videoboxLeft + "px";

    objVideobox.innerHTML = html;
    objVideobox.style.display = 'block';
    listenKey();
}

/// updateHtmlBox
function updateHtmlbox(html) {
    var objVideobox = document.getElementById('videobox');
    objVideobox.innerHTML = html;
}

// hideLightbox()
function hideLightbox() {
    // get objects
    objOverlay = document.getElementById('overlay');
    objLightbox = document.getElementById('lightbox');
    objVideobox = document.getElementById('videobox');

    // hide lightbox and overlay
    objOverlay.style.display = 'none';
    objLightbox.style.display = 'none';
    objVideobox.style.display = 'none';
    objVideobox.innerHTML = '';

    if (lastBox != '') {
        objLastbox = document.getElementById(lastBox);
        objLastbox.style.display = 'none';
        lastBox = '';
    }

    // disable keypress listener
    document.onkeypress = '';
}

// initLightbox()
// Function runs on window load, going through link tags looking for rel="lightbox".
// These links receive onclick events that enable the lightbox display for their targets.
// The function also inserts html markup at the top of the page which will be used as a
// container for the overlay pattern and the inline image.
function initLightbox() {

    if (!document.getElementsByTagName) { return; }
    var anchors = document.getElementsByTagName("a");

    // loop through all anchor tags
    for (var i = 0; i < anchors.length; i++) {
        var anchor = anchors[i];

        if (anchor.getAttribute("href") && (anchor.getAttribute("rel") == "lightbox")) {
            anchor.onclick = function() { showLightbox(this); return false; }
        }


        if (anchor.getAttribute("href") && (anchor.getAttribute("rel") == "videobox")) {
            anchor.onclick = function() { showVideobox(this); return false; }
        }
    }

    // the rest of this code inserts html at the top of the page that looks like this:
    //
    // <div id="overlay">
    //	<a href="#" onclick="hideLightbox(); return false;"><img id="loadingImage" /></a>
    // </div>
    // <div id="lightbox">
    //	<a href="#" onclick="hideLightbox(); return false;" title="Click anywhere to close image">
    //		<img id="closeButton" />		
    //		<img id="lightboxImage" />
    //	</a>
    //	<div id="lightboxDetails">
    //		<div id="lightboxCaption"></div>
    //		<div id="keyboardMsg"></div>
    //	</div>
    // </div>
    // <div id="videobox">
    // </div>

    var objBody = document.getElementsByTagName("body").item(0);

    // create overlay div and hardcode some functional styles (aesthetic styles are in CSS file)
    var objOverlay = document.createElement("div");
    objOverlay.setAttribute('id', 'overlay');
    objOverlay.style.display = 'none';
    objOverlay.style.position = 'absolute';
    objOverlay.style.top = '0';
    objOverlay.style.left = '0';
    objOverlay.style.zIndex = '90';
    objOverlay.style.width = '100%';
    objBody.insertBefore(objOverlay, objBody.firstChild);

    var arrayPageSize = getPageSize();
    var arrayPageScroll = getPageScroll();

    // preload and create loader image
    //var imgPreloader = new Image();

    // if loader image found, create link to hide lightbox and create loadingimage
    //imgPreloader.onload = function() {

    //    var objLoadingImageLink = document.createElement("a");
    //    objLoadingImageLink.setAttribute('href', '#');
    //    objLoadingImageLink.onclick = function() { hideLightbox(); return false; }
    //    objOverlay.appendChild(objLoadingImageLink);

    //    var objLoadingImage = document.createElement("img");
    //    objLoadingImage.src = loadingImage;
    //    objLoadingImage.setAttribute('id', 'loadingImage');
    //    objLoadingImage.style.position = 'absolute';
    //    objLoadingImage.style.zIndex = '150';
    //    objLoadingImageLink.appendChild(objLoadingImage);

    //    imgPreloader.onload = function() { }; //	clear onLoad, as IE will flip out w/animated gifs

    //    return false;
    //}

    //imgPreloader.src = loadingImage;

    // create lightbox div, same note about styles as above
    var objLightbox = document.createElement("div");
    objLightbox.setAttribute('id', 'lightbox');
    objLightbox.style.display = 'none';
    objLightbox.style.position = 'absolute';
    objLightbox.style.zIndex = '100';
    objBody.insertBefore(objLightbox, objOverlay.nextSibling);

    // create link
    var objLink = document.createElement("a");
    objLink.setAttribute('href', '#');
    objLink.setAttribute('title', 'Click to close');
    objLink.onclick = function() { hideLightbox(); return false; }
    objLightbox.appendChild(objLink);

    // preload and create close button image
    //var imgPreloadCloseButton = new Image();

    // if close button image found, 
    //imgPreloadCloseButton.onload = function() {

    //    var objCloseButton = document.createElement("img");
    //    objCloseButton.src = closeButton;
    //    objCloseButton.setAttribute('id', 'closeButton');
    //    objCloseButton.style.position = 'absolute';
    //    objCloseButton.style.zIndex = '200';
    //    objLink.appendChild(objCloseButton);

    //    return false;
    //}

    //imgPreloadCloseButton.src = closeButton;

    // create image
    var objImage = document.createElement("img");
    objImage.setAttribute('id', 'lightboxImage');
    objLink.appendChild(objImage);

    // create details div, a container for the caption and keyboard message
    var objLightboxDetails = document.createElement("div");
    objLightboxDetails.setAttribute('id', 'lightboxDetails');
    objLightbox.appendChild(objLightboxDetails);

    // create caption
    var objCaption = document.createElement("div");
    objCaption.setAttribute('id', 'lightboxCaption');
    objCaption.style.display = 'none';
    objLightboxDetails.appendChild(objCaption);

    // create keyboard message
    var objKeyboardMsg = document.createElement("div");
    objKeyboardMsg.setAttribute('id', 'keyboardMsg');
    objKeyboardMsg.innerHTML = '<a href="javascript:hideLightbox();">close</a>';
    objLightboxDetails.appendChild(objKeyboardMsg);

    // create videobox div, same note about styles as above
    var objVideobox = document.createElement("div");
    objVideobox.setAttribute('id', 'videobox');
    objVideobox.style.display = 'none';
    objVideobox.style.position = 'absolute';
    objVideobox.style.zIndex = '100';
    objBody.insertBefore(objVideobox, objOverlay.nextSibling);
}

// addLoadEvent()
function addLoadEvent(func) {
    var onload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            onload();func();
        }
    }
}

// addUnloadEvent()
function addUnloadEvent(func) {
    var onunload = window.onunload;
    if (typeof window.onunload != 'function') {
        window.onunload = func;
    } else {
        window.onunload = function() {
            onunload();func();
        }
    }
}

addLoadEvent(initLightbox);	// run initLightbox onLoad