﻿/**
* customized lightbox for div element
* GSP
* http://chenz101tutorials.blogspot.com/
*/

function showLightboxId(fadeid, lightid) {
    // Get page sizes
    var arrPageSizes = currentPageSize();
    // Get page scroll
    var arrPageScroll = currentPageScroll();

    // Style overlay and show it
    $('#' + fadeid).css({
        'background-color': '#000',
        'opacity': 0.8,
        width: arrPageSizes[0] + 'px',
        height: (arrPageSizes[1] + 100) + 'px'
    }).fadeIn();

    // calculate top and left offset for the jquery-lightbox div object and show it
    $('#' + lightid).css({
        top: (arrPageScroll[1] + (arrPageSizes[3] / 10)) + 'px',
        left: arrPageScroll[0] + 'px'
    }).show();

    $(window).resize(function() {
        // Get page sizes
        var arrPageSizes = currentPageSize();
        // Get page scroll
        var arrPageScroll = currentPageScroll();

        // Style overlay and show it
        $('#' + fadeid).css({
            width: arrPageSizes[0] + 'px',
            height: (arrPageSizes[1] + 100) + 'px'
        });
        // Calculate top and left offset for the jquery-lightbox div object and show it
        $('#' + lightid).css({
            top: (arrPageScroll[1] + (arrPageSizes[3] / 10)) + 'px',
            left: arrPageScroll[0] + 'px'
        });

    });

    //Enable a support to keyboard navigation
    $(document).keydown(function(objEvent) {
        _keyboard_action(objEvent);
    });
}

function showLightbox() {

    // Get page sizes
    var arrPageSizes = currentPageSize();
    // Get page scroll
    var arrPageScroll = currentPageScroll();

    // Style overlay and show it
    $('#fade').css({
        'background-color': '#000',
        'opacity': 0.8,
        width: arrPageSizes[0] + 'px',
        height: (arrPageSizes[1] + 100) + 'px'
    }).fadeIn();
    
    // calculate top and left offset for the jquery-lightbox div object and show it
    $('#light').css({
        top: (arrPageScroll[1] + (arrPageSizes[3] / 10)) + 'px',
        left: arrPageScroll[0] + 'px'
    }).show();

    $(window).resize(function() {
        // Get page sizes
        var arrPageSizes = currentPageSize();
        // Get page scroll
        var arrPageScroll = currentPageScroll();

        // Style overlay and show it
        $('#fade').css({
            width: arrPageSizes[0] + 'px',
            height: (arrPageSizes[1] + 100) + 'px'
        });
        // Calculate top and left offset for the jquery-lightbox div object and show it
        $('#light').css({
            top: (arrPageScroll[1] + (arrPageSizes[3] / 10)) + 'px',
            left: arrPageScroll[0] + 'px'
        });

    });

    //Enable a support to keyboard navigation
    $(document).keydown(function(objEvent) {
        _keyboard_action(objEvent);
    });
}

//$(function() {

//    // Assigning click events in elements to close overlay
//    $('#fade').click(function() {
//        closeLightbox();
//    });

//    //close button
//    $('#btnClose').click(function() { closeLightbox() });

//});

//get PageSize
function currentPageSize() {
    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 currentPageScroll() {
    var xScroll, yScroll;
    if (self.pageYOffset) {
        yScroll = self.pageYOffset;
        xScroll = self.pageXOffset;
    } else if (document.documentElement && document.documentElement.scrollTop) {	 // Explorer 6 Strict
        yScroll = document.documentElement.scrollTop;
        xScroll = document.documentElement.scrollLeft;
    } else if (document.body) {// all other Explorers
        yScroll = document.body.scrollTop;
        xScroll = document.body.scrollLeft;
    }
    arrayPageScroll = new Array(xScroll, yScroll);
    return arrayPageScroll;
};

//close LightBox
function closeLightbox() {
      $('#light').css('display', 'none');
      $('#fade').fadeOut(function() { $('#fade').css('display', 'none'); });
      
    //$('#light').remove();
    //$('#fade').fadeOut(function() { $('#fade').remove(); });

    // Show some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
    $('embed, object, select').css({ 'visibility': 'visible' });
}

function closeLightboxId(fadeId, lightId) {
    $('#' + lightId).css('display', 'none');
    $('#' + fadeId).fadeOut(function() { $('#' + fadeId).css('display', 'none'); });

    //$('#light').remove();
    //$('#fade').fadeOut(function() { $('#fade').remove(); });

    // Show some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
    $('embed, object, select').css({ 'visibility': 'visible' });
}



/**
* Perform the keyboard actions
*
*/
function _keyboard_action(objEvent) {
    // To ie
    if (objEvent == null) {
        keycode = event.keyCode;
        escapeKey = 27;
        // To Mozilla
    } else {
        keycode = objEvent.keyCode;
        escapeKey = objEvent.DOM_VK_ESCAPE;
    }
    // Get the key in lower case form
    key = String.fromCharCode(keycode).toLowerCase();
    // Verify the keys to close the ligthBox
    if ((key == 'c') || (key == 'x') || (keycode == escapeKey)) {
        closeLightbox();
    }
}