﻿

function initModalImages() {
    $(".modal_image").click(function() {


        if (navigator.userAgent.match(/iPad/i) != null || navigator.userAgent.match(/iPhone/i) != null) {
            $("#modalimage_overlay").css("height", $(getScrollElement()).height());
        }


        $("#modalimage_overlay").fadeIn(250);
        $("#modalimage_holder").html('<img id="active-modal-image" src=""/>');

        $('#active-modal-image').attr('src', $(this).attr('src').replace("-small.", "-big.")).load(function() {
            $("#modalimage_container").fadeIn(250);


            var width = parseFloat(document.getElementById("active-modal-image").clientWidth) / 2;
            var height = parseFloat(document.getElementById("active-modal-image").clientHeight) / 2;
            if (navigator.userAgent.match(/iPad/i) != null || navigator.userAgent.match(/iPhone/i) != null) {

                height = 0 - parseFloat(document.getElementById("active-modal-image").clientHeight) / 2 + parseFloat($(window).scrollTop());
                $("#modalimage_holder").css("left", "-" + width + "px");
                $("#modalimage_holder").css("top", height + "px");
                $("#modalimage_close").css("left", "-" + parseFloat(width + 10) + "px");
                $("#modalimage_close").css("top", parseFloat(height + 10) + "px");
            }
            else {
                $("#modalimage_holder").css("left", "-" + width + "px");
                $("#modalimage_holder").css("top", "-" + height + "px");
                $("#modalimage_close").css("left", "-" + parseFloat(width + 10) + "px");
                $("#modalimage_close").css("top", "-" + parseFloat(height - 10) + "px");
            }




        });

    });
    $("#modalimage_overlay").click(function() {
        $("#modalimage_overlay").fadeOut(250);
        $("#modalimage_container").fadeOut(250);
    });

    $(document).keyup(function(e) {
        if (e.keyCode == 27) {// esc
            $("#modalimage_overlay").fadeOut(250);
            $("#modalimage_container").fadeOut(250);
        }
    });
    $("#modalimage_close").click(function() {
        $("#modalimage_overlay").fadeOut(250);
        $("#modalimage_container").fadeOut(250);
    });


}
