﻿/*!
*
* PetsBest jQuery modal helper methods
* This file requires:
*   jquery.blockUI.js
*   jquery.scrollTo-1.4.2-min.js
*
*/

function DisablePanel(isDisabled, msgDisp) {
    var imgPath = GlobalAppVirtualDir + "/Images/ajax-loader.gif";
    if (isDisabled) {
        $.blockUI({
            css: {
                border:                     'none',
                padding:                    '15px',
                backgroundColor:            '#000',
                '-webkit-border-radius':    '10px',
                '-moz-border-radius':       '10px',
                opacity:                    .7,
                color:                      '#fff'
            },
            message: '<p style="text-align: center;"><img src="' + imgPath + '" /><br />' + msgDisp != null ? msgDisp : "" + '</p>'
        });
    }
    else {
        $.unblockUI();
    }
}

function DisableDiv(blockDiv, isDisabled, msgDisp, doScroll) {
    if (blockDiv == undefined || blockDiv == null || blockDiv == "") return;
    if (isDisabled == undefined || isDisabled == null || isDisabled == "") isDisabled = true;
    if (msgDisp == undefined || msgDisp == null) msgDisp = "Please wait...";
    if (doScroll == undefined || doScroll == null) doScroll = false;

    if (isDisabled == true) {
        blockDiv.block({
            fadeIn: 10,
            centerX: true,
            centerY: false,
            css: {
                top: '5%',
                backgroundColor: '#000',
                '-webkit-border-radius': '10px',
                '-moz-border-radius': '10px',
                color: '#fff',
                border: '0px',
                opacity: .4
            },
            message: '<p style="text-align: center;">' + msgDisp != null ? msgDisp : "" + '</p>'
        });
        if (doScroll)
            $.scrollTo(blockDiv, 800);
    }
    else {
        blockDiv.unblock();
    }
}

function DisablePageShowModal(modalDiv, theWidth, theHeight, showDuration) {
    if (modalDiv == undefined || modalDiv == null || modalDiv == "") {
        modalDiv = $("<div><div style='width: 100%; text-align: center;'><div>Thank you for your patience.</div></div></div>");
    }
    if (theWidth == undefined || theWidth == null) theWidth = 600;
    if (theHeight == undefined || theHeight == null) theWidth = 300;
    if (showDuration == undefined || showDuration == null) showDuration = 0;

    var closeBoxImgPath = GlobalAppVirtualDir + "/Images/closebox.png";
    var modDiv = $("<div class='ModalDisplay' style='padding: 14px;'>");
    modDiv = modDiv.prepend('<img style="float: right; margin-top: -25px; margin-right: -26px; cursor: pointer;" class="CloseModal" src="' + closeBoxImgPath + '" alt="close" title="Close" />');
    modDiv = modDiv.append(modalDiv.html());
    modDiv = modDiv.append("</div>");

    $.blockUI({
        css: {
            cursor: 'default',
            textAlign: 'left',
            border: 'none',
            padding: '10px',
            backgroundColor: '#FFF',
            '-webkit-border-radius': '10px',
            '-moz-border-radius': '10px',
            opacity: 1,
            color: '#000',
            overflow: 'hidden',
            top: ($(window).height() - theHeight) / 2 + 'px',
            width: theWidth,
            left: ($(window).width() - theWidth) / 2 + 'px',
            right: '10px'
        },
        message: modDiv
    });

    $(".CloseModal").click(function () {
        $.unblockUI();
    });

    // Only work with showing the blockDiv for a duration if the showDuration has a value (consider 0 as a non-value)
    if (showDuration > 0) {
        setTimeout(function () { $.unblockUI(); }, showDuration);
    }
}

// modalDivId is the string id of the div that has a style of "display: none" on it.
// The hidden div needs to be an outer div to the actual div that has the modal contents.
// showDuration is how many milliseconds to display the modal before it automatically goes away.  Enter nothing or 0 if you don't want it to close automatically.
// Here's an example of how to call it: DPModal('PerIncidentModal');
function DPModal(modalDivId, showDuration) {
    if (modalDivId == undefined || modalDivId == null || modalDivId == "") return;
    if (showDuration == undefined || showDuration == null) showDuration = 0;

    var modalDiv = $("#" + modalDivId);
    var closeBoxImgPath = GlobalAppVirtualDir + "/Images/closebox.png";
    var modDiv = $("<div class='ModalDisplay' style='padding: 14px;'>");
    modDiv = modDiv.prepend('<img style="float: right; margin-top: -25px; margin-right: -26px; cursor: pointer;" class="CloseModal" src="' + closeBoxImgPath + '" alt="close" title="Close" />');
    modDiv = modDiv.append(modalDiv.html());
    modDiv = modDiv.append("</div>");

    $.blockUI({
        css: {
            cursor: 'default',
            textAlign: 'left',
            border: 'none',
            padding: '10px',
            backgroundColor: '#FFF',
            '-webkit-border-radius': '10px',
            '-moz-border-radius': '10px',
            opacity: 1,
            color: '#000',
            overflow: 'hidden',
            top: (($(window).height() / 2) - 150) + 'px',
            right: '10px'
        },
        message: modDiv
    });

    $(".CloseModal").click(function () {
        $.unblockUI();
    });

    // Only work with showing the blockDiv for a duration if the showDuration has a value (consider 0 as a non-value)
    if (showDuration > 0) {
        setTimeout(function () { $.unblockUI(); }, showDuration);
    }
}

function ShowHTMLModal(blockDiv, modalDiv, doScroll, showDuration) {
    if (blockDiv == undefined || blockDiv == null || blockDiv == "") return;
    if (modalDiv == undefined || modalDiv == null || modalDiv == "") {
        modalDiv = $("<div><div style='width: 100%; text-align: center;'><div>Thank you for your patience.</div></div></div>");
    }
    if (doScroll == undefined || doScroll == null) doScroll = false;
    if (showDuration == undefined || showDuration == null) showDuration = 0;

    var modDiv = modalDiv;

    if (showDuration > 0) {
        modDiv = modDiv.add('<div style="margin-top: 10px; text-align: right;"><a href="" onclick="return false;" class="CloseModal">Close</a><div>');
    }

    blockDiv.block({
        centerX: true,
        centerY: false,
        css: {
            cursor: 'default',
            width: '300px',
            top: '5%',
            textAlign: 'left',
            border: 'none',
            padding: '15px',
            backgroundColor: '#FFF',
            '-webkit-border-radius': '10px',
            '-moz-border-radius': '10px',
            opacity: 1,
            color: '#000'
        },
        message: modDiv
    });

    $(".CloseModal").click(function () {
        blockDiv.unblock();
    });

    if (doScroll)
        $.scrollTo(blockDiv, 800);

    // Only work with showing the blockDiv for a duration if the showDuration has a value (consider 0 as a non-value)
    if (showDuration > 0) {
        setTimeout(
                    function () {
                        blockDiv.unblock();
                    }, showDuration);
    }
}

// This will POST an AJAX action to display the action View in a modal
function ShowModalBlockDiv(theAction, blockDiv, msg, theWidth) {
    if (theAction == undefined || theAction == null || theAction == "") return;
    if (blockDiv == undefined || blockDiv == null || blockDiv == "") return;
    if (msg == undefined || msg == null || msg == "") msg = "Please wait...";
    if (theWidth == undefined || theWidth == null || theWidth == "") theWidth = "500px";

    $.ajax({
        url: theAction,
        type: "POST",
        async: false,
        beforeSend: function () {
            DisableDiv(blockDiv, true, msg, false);
        },
        success: function (data) {
            var closeBoxImgPath = GlobalAppVirtualDir + "/Images/closebox.png";
            var modMsg = "<div class='ModalDisplay'>";
            modMsg += '<img style="float: right; margin-top: -17px; margin-right: -18px; cursor: pointer;" class="CloseModal" src="' + closeBoxImgPath + '" alt="close" title="Close" />';
            modMsg += data;
            modMsg += "</div>";

            blockDiv.block({
                centerX: true,
                centerY: false,
                css: {
                    cursor: 'default',
                    width: theWidth,
                    top: '5%',
                    textAlign: 'left',
                    border: 'none',
                    padding: '15px',
                    backgroundColor: '#FFF',
                    '-webkit-border-radius': '10px',
                    '-moz-border-radius': '10px',
                    opacity: 1,
                    color: '#000'
                },
                message: modMsg
            });

            $(".CloseModal").click(function () {
                $.unblockUI();
                blockDiv.unblock();
            });
        }
    });
}

// This will POST an AJAX action and display a message in a modal while the action is being posted
function ShowModalTextBlockDiv(theAction, blockDiv, msg, theWidth) {
    if (theAction == undefined || theAction == null || theAction == "") return;
    if (blockDiv == undefined || blockDiv == null || blockDiv == "") return;
    if (msg == undefined || msg == null || msg == "") msg = "Please wait...";
    if (theWidth == undefined || theWidth == null || theWidth == "") theWidth = "500px";

    $.ajax({
        url: theAction,
        type: "POST",
        async: false,
        beforeSend: function () {
            DisableDiv(blockDiv, true, msg, false);
        },
        success: function (data) {
            blockDiv.block({
                centerX: true,
                centerY: false,
                css: {
                    cursor: 'default',
                    width: theWidth,
                    top: '5%',
                    textAlign: 'left',
                    border: 'none',
                    padding: '15px',
                    backgroundColor: '#FFF',
                    '-webkit-border-radius': '10px',
                    '-moz-border-radius': '10px',
                    opacity: 1,
                    color: '#000'
                },
                message: msg
            });
        }
    });
}

function ShowRetrieveQuoteBlockDiv(theAction, blockDiv, msg) {
    if (theAction == undefined || theAction == null || theAction == "") return;
    if (blockDiv == undefined || blockDiv == null || blockDiv == "") return;
    if (msg == undefined || msg == null || msg == "") msg = "Please wait...";

    $.ajax({
        url: theAction,
        type: "POST",
        async: false,
        beforeSend: function () {
            DisableDiv(blockDiv, true, msg, false);
        },
        success: function (data) {
            var modMsg = data;

            blockDiv.block({
                centerX: true,
                centerY: false,
                css: {
                    cursor: 'default',
                    width: '640px',
                    top: '0',
                    textAlign: 'left',
                    border: 'none',
                    backgroundColor: 'transparent',
                    opacity: 1,
                    color: '#000'
                },
                message: modMsg
            });

            $("#modal-close").click(function () {
                $.unblockUI();
                blockDiv.unblock();
            });
        }
    });
}

function DoPostBlockDiv(theAction, blockDiv, msg, doScroll) {
    if (theAction == undefined || theAction == null || theAction == "") return;
    if (blockDiv == undefined || blockDiv == null || blockDiv == "") return;
    if (msg == undefined || msg == null || msg == "") msg = "Please wait...";
    if (doScroll == undefined || doScroll == null) doScroll = false;

    DisableDiv(blockDiv, true, msg, doScroll);

    $.ajax({
        url: theAction,
        type: "GET",
        async: true,
        success: function () {
            blockDiv.unblock();
        }
    });
}

function RefreshYourQuote() {
    $.ajax({
        url: GlobalAppVirtualDir + "/yourquote/?ts=" + new Date().getTime(),
        type: "GET",
        async: true,
        success: function (data) {
            $("#YourQuoteForm").text("");
            $("#YourQuoteForm").html(data);
            DisablePanel(false, null);
        }
    });
}

function ShowScrollModal(theUrl, theWidth, theHeight, theTitle, doScroll) {
    if (theUrl == undefined || theUrl == null) return;
    if (theWidth == undefined || theWidth == "") theWidth = "600";
    if (theHeight == undefined || theHeight == "") theHeight = "500";
    if (doScroll == undefined || doScroll == null) doScroll = false;
    if (theTitle == undefined || theTitle == "") theTitle = "&nbsp;";

    var closeBoxImgPath = GlobalAppVirtualDir + "/Images/closebox.png";
    var modTitle = '<div style="text-align: left; float: left; line-height: 30px; width:' + theWidth * .75 + 'px;">' + theTitle + '</div>';
    modTitle += '<div style="text-align: right; float: right; width:' + theWidth * .15 + 'px;">';
    modTitle += '<img style="float: right; margin-top: 0px; margin-right: 0px; cursor: pointer;" class="CloseModal" src="' + closeBoxImgPath + '" alt="close" title="Close" />';
    modTitle += '</div><div style="clear:both;"></div>';

    $.ajax({
        url: theUrl,
        type: "GET",
        success: function (data) {
            $.blockUI({
                css: {
                    cursor: 'default',
                    textAlign: 'left',
                    border: 'none',
                    padding: '10px',
                    backgroundColor: '#FFF',
                    '-webkit-border-radius': '10px',
                    '-moz-border-radius': '10px',
                    opacity: 1,
                    color: '#000',
                    overflow: 'auto',
                    top: '5%', 
                    left: '', 
                    right: '10px'
                },
                theme: true,
                themedCSS: {    // Style used when theme = true
                    width: theWidth + 'px',
                    height: theHeight + 'px',
                    left: ($(window).width() - theWidth) / 2 + 'px',
                    top: '5%',
                    overflow: 'auto'
                },
                draggable: false,
                title: modTitle,
                message: data + '<div style="margin-top: 10px; text-align: right;"><a href="" onclick="return false;" class="CloseModal">Close</a><div>'
            });

            $(".CloseModal").click(function () {
                $.unblockUI();
            });
        }
    });
}

