var GB_DONE = false;
var GB_HEIGHT = 400;
var GB_WIDTH = 400;
var GB_ANIMATION = true;

function LB_Show(url, dataType, height, width, templateid) {
    GB_HEIGHT = height || 400;
    GB_WIDTH = width || 400;
    if (!GB_DONE) {

        html = "<div id='lb-overlay'></div><div id='lb-container'><div id='lb-content-loader'><img src='/Images/ajax-loader.gif'/></div><div id='lb-close'><a href='javascript:LBHide();'><img src='/Images/lb-close.gif' alt='Close window'/></a></div><div id='lb-content'>";
      if (dataType == "image") {
          html += "<img class='lb-image' src='" + url + "' />";
      }
      html += "</div></div>";
      $(document.body).append(html);

      $("#lb-content").click(LBHide);
      $("#lb-overlay").click(LBHide);
      $(window).resize(LBPosition);
      GB_DONE = true;
    }

    $("#lb-overlay").show();
    LBPosition();
    $("#lb-container").show();
    if (dataType == "url") {
        $.ajax({
            type: "GET",
            url: url,
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) {
                $('#lb-content').setTemplateElement(templateid, null, { filter_data: false });
                $('#lb-content').processTemplate(msg);
                $('#lb-content-loader').hide();
                $('#lb-content').fadeIn("def");
            },
            beforeSend: function() {
                $('#lb-content-loader').show();
            }
        });
    } else {
        if (GB_ANIMATION)
            $("#lb-content").fadeIn("slow");
        else
            $("#lb-content").show();
    }   
}

function LBHide() {
    $("#lb-container,#lb-content,#lb-overlay").hide();
}

function LBPosition() {
    var de = document.documentElement;
    var w = self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;

    $("#lb-content").css({ width: GB_WIDTH + "px", height: GB_HEIGHT + "px"
    });

    $("#lb-container").css({ top: (de.scrollTop+50) + "px", width: GB_WIDTH + "px", height: GB_HEIGHT + "px",
        left: ((w - GB_WIDTH) / 2) + "px"
    });
    
    $("#lb-overlay").css({ height: $("body").height() });
}
