$(function () {
    var dlg = new ModalDialog({overlayBgColor: "#aaa"});
    var modalDiv = $("#modal-div");
    if (!modalDiv.length) {
        modalDiv = $('<div id="modal-div" class="box-shadow"><img style="margin-bottom: 30px;" /><div style="margin: 10px; display: block; text-align: center;"><a class="clickable" id="close-modal">Close</a></div></div>');
        $(document.body).append (modalDiv);
    }
    $("#close-modal").click (function () { dlg.hide();});

    var img = $("img", modalDiv);
    var tn = null;
    img.load (function () {
        if (img.attr ("src")) {
            var css = {"width": img.attr ("width") + "px", "height": img.attr ("height") + + 35 + "px"};
            modalDiv.css (css);
            dlg.show (modalDiv /* , tn */);
        }
    });

    $("img.doc-tn").click (function () {
        tn = $(this);
        img.attr ("src", this.src.replace ("-tn.", "."));
    });
    
});