Ekina.Events.register(window, "ondomready", function() {

    // Create Lightbox DIV Image markup
    var divImg = $('<div id="lightbox"></div>').appendTo(document.body);
    var divGalleryItem = $('<img id="lightbox_img" alt=""/>').appendTo(divImg);

    var divControls = $('<div id="largeImg_controls"></div>').appendTo(divImg);
    $('<a href="#" onclick="return hideImage();"></a>').appendTo(divControls).innerHTML = "CLOSE";    

    var anchors = document.getElementsByTagName("a");
    for (var i = 0; i < anchors.length; i++) {
        var a = anchors[i];
        if ($string(a.rel)) {
            switch (a.rel) {
                case "lightbox":
                    a.onclick = function() {
                        //showImage(this.href, span[0].innerHTML);

                        return false;
                    };
                    break;

            }
        }
    }


    //            if (dhtmlHistory.isFirstLoad())
    //                loadXMLDoc(dhtmlHistory.getCurrentLocation(), true);   

});

var ll = null;

function showLockLayer(showHandler, clickHandler) {
    ll = Ekina.UI.createLockLayer(80, "black", function() {
        if (clickHandler) clickHandler();
    }, function() {
        if (showHandler) showHandler();
    }, true, .25);

};

function hideLockLayer() {
    if (!ll) return;

    ll.hide(.25);
};

function positionLightbox() {
    var div = $("lightbox");
    div.style.left = (($window().width / 2) - (div.offsetWidth / 2)) + "px";
    div.style.top = (($window().height / 2) - (div.offsetHeight / 2)) + "px";
};

function hideImage() {
    $("lightbox").fadeOut(0, .25, function() {
        $("lightbox").hide();
        hideLockLayer();
    });
    return false;
};

function showImage(el) {
    showLockLayer(function() {
        _showImage(el);
    }, hideImage);
    return false;
}

function _showImage(el) {

    var span = el.getElementsByTagName("span");

    var div = $("lightbox");
    div.style.display = "block";

    var img = $("lightbox_img");
    img.src = el.href;
    img.onload = positionLightbox;

    div.fadeIn(100, .25);

    var p = div.parentNode;

    positionLightbox();

    window.onresize = function() {
        position(div);
    };

};