var imageH;
var imageW;
var currenImage;

$(document).ready(function () {

    var h = $(window).height();
    var w = $(window).width();
    if (h < 935) {
        h -= 40;
        w = h;
        imageW = w - 150;
        imageH = h - 100

    }
    else {
        h = (h < 935) ? h : 935;
        w = (w < 935) ? w : 935;
        h -= 40;
        w = h;
        imageW = w - 150;
        imageH = h - 100
    }
    if (h < 350) {
        h = 350;
        w = h;
        imageW = w - 150;
        imageH = h - 100
        $(".imagezoomlayer").css("top", '0px');
    }
    else {
        $(".imagezoomlayer").css("top", (Math.round($(window).height() - h) / 2) + 'px');
    }
    $(".imagezoomlayer").css("left", (Math.round($(window).width() - w) / 2) + 'px');
    $(".imagezoomlayer").css("height", h);
    $(".imagezoomlayer").css("width", w);
    $("#imageholder").css("height", imageH);
    $("#customModal").css('height', $(window).height());
    $("#customModal").css('width', $(window).width());
    $("#customModal").css('top', 0);
    $("#customModal").css('left', 0);

    $("#customModal").css({ position: "absolute" });

    $('#imglargeimg').click(function () {
        $(".imagezoomlayer").show();
        $(".modalBackground").show();
        var newImage = $('#imglargeimg').attr('src');
        newImage = newImage.substring(0, newImage.indexOf('&'))
        $(".customodalpicture").attr('src', newImage + '&special=0&maxheight=' + imageH + '&maxwidth=' + imageW + '&reflection=50');
        currenImage = newImage;
    });

    $('.smallimage').click(function () {
        var newImage = $(this).attr('src');
        newImage = newImage.substring(0, newImage.indexOf('&'))
        $(".customodalpicture").attr('src', newImage + '&special=0&maxheight=' + imageH + '&maxwidth=' + imageW + '&reflection=50');
        currenImage = newImage;
    });

    $('.close').click(function () {
        $(".imagezoomlayer").hide();
        $(".modalBackground").hide();
    });

    $('.miniimage').click(function () {
        var newImage = $(this).attr('src');
        newImage = newImage.substring(0, newImage.indexOf('&'));
        var sizeURL = $("#imglargeimg").attr('src');
        sizeURL = sizeURL.substring(sizeURL.indexOf('&'), sizeURL.length);
        $("#imglargeimg").attr('src', newImage + sizeURL);
    });

});

$(window).resize(function () {

    $(".customodalpicture").attr('src', currenImage + '&special=0&maxheight=' + imageH + '&maxwidth=' + imageW + '&reflection=50');
    var h = $(window).height();
    var w = $(window).width();
    if (h < 935) {
        h -= 40;
        w = h;
        imageW = w - 150;
        imageH = h - 100

    }
    else {
        h = (h < 935) ? h : 935;
        w = (w < 935) ? w : 935;
        h -= 40;
        w = h;
        imageW = w - 150;
        imageH = h - 100
    }
    if (h < 350) {
        h = 350;
        w = h;
        imageW = w - 150;
        imageH = h - 100
        $(".imagezoomlayer").css("top", '0px');
    }
    else {
        $(".imagezoomlayer").css("top", (Math.round($(window).height() - h) / 2) + 'px');
    }
    $(".imagezoomlayer").css("left", (Math.round($(window).width() - w) / 2) + 'px');
    $(".imagezoomlayer").css("height", h);
    $(".imagezoomlayer").css("width", w);
    $("#imageholder").css("height", imageH);
    $("#customModal").css('height', $(window).height());
    $("#customModal").css('width', $(window).width());
    $("#customModal").css('top', 0);
    $("#customModal").css('left', 0);
    $("#customModal").css('position', 'absolute');
});


$('.smallimage').click(function () {
    var newImage = $(this).attr('src');
    newImage = newImage.substring(0, newImage.indexOf('&'))
    $(".customodalpicture").attr('src', newImage + '&special=0&maxheight=' + imageH + '&maxwidth=' + imageW + '&reflection=50');
    currenImage = newImage;
});

$(window).scroll(function () {
    $(".imagezoomlayer").css("top", $(window).scrollTop())
    $("#customModal").css("top", $(window).scrollTop());
    $("#customModal").css("left", $(window).scrollLeft());
});