cu_notify.prg

<?php
/**
 * Manages the emails that the CU uses for particular functions.
 */
require_once("$sharedLibrary/sFeatureMnu.i");
require_once(dirname(__FILE__) . "/cu_notify.data");

$main = $menu_link;
$self = "$menu_link?ft=$ft";

$parameters = array("a" => array("role" => "", "email" => ""));
$string = array("filter" => FILTER_SANITIZE_STRING);
$array = array("filter" => FILTER_DEFAULT);
HCU_ImportVars($parameters, "a", array("role" => $string, "email" => $string, "emailList" => $array));
extract($parameters["a"]); // dms_import doesn't work anymore because this isn't in global scope anymore.

if ($operation != "") {
    switch($operation) {
        case "readEmailNotify":
            $returnArray = ReadEmailNotify($dbh, $Cu);
            break;
        case "updateEmailNotify":
            $returnArray = UpdateEmailNotify($dbh, $Cu, $Cn, $role, $email, false);
            break;
        case "readVerifiedEmailList":
            $returnArray = ReadVerifiedEmailList($dbh, $Cu);
            break;
        case "updateVerifiedEmailList":
            $returnArray = UpdateVerifiedEmailList($dbh, $Cu, $emailList);
            break;
        case "resendEmail":
            $returnArray = ResendEmail($dbh, $Cu, $email);
            break;
        default: $returnArray = array("sql" => array(), "error" => array("Operation not recognized: $operation."), "record" => array());
            break;
    }

    header('Content-type: application/json');
    print HCU_JsonEncode($returnArray);
} else {
    PrintNotifyPage($self);
}

/**
 * function printPage($self)
 * Prints the page.  Slightly different: edits incell rather than a popup like usual.  This works better for this grid.
 *
 * @param string $self          The URL of the page
 */
function PrintNotifyPage($self) { ?>
    <style>
        .removeTD, .resendTD {
            cursor: pointer;
        }

        .statusRow {
            padding-left: 0;
        }

        .statusRow .col-xs-1 {
            padding-left: 5px;
        }

        .statusRow .col-xs-11 {
            padding-left: 0;
        }

        [name='emailInput'] {
            text-indent: 5px !important;
        }

        #gridContainer {
            max-width: 1000px;
        }
    </style>
    <script type="text/javascript">

        <?php
        // Library javascript functions
        getShowWaitFunctions();
        ?>

        var activeWindows = [];
        var usedEmailList = {};
        var mainGridChanged = false;
        var previousVerifiedEmailData = null;
        var noSESRole = false;
        var ddlCounter = 0;
        var multiCounter = 0;
        var mainInitialized = false;
        var emailDDLDataSource = null;
        var emailNotifyDataSource = null;
        var fromEmailDDLs = [];

        <?php
        /**
         * function InitEmailNotify()
         * This function initializes all controls dealing with the main grid.
         */
        ?>
        function InitEmailNotify() {
            $.homecuValidator.setup({formValidate:'mainForm', formStatusField: 'formValidateMainDiv',
                homecuCustomRules: {
                    customEmail: function(input) {
                        if (!$(input).is(".emailMultiCheck")) {
                            return true;
                        }
                        var value = $(input).val().trim();
                        if (value == "") {
                            if ($(input).data("hademail").trim() == "Y") {
                                $(input).attr("data-customEmail-msg", "Cannot clear email.");
                                return false;
                            } else {
                                return true;
                            }
                        }
                        var emails = value.split(/[;\s,]/);
                        var numEmails = 0; <?php // If the semicolon is at the end of the email string then no effect. ?>
                        for(var i = 0; i != emails.length; i++) {
                            var email = emails[i].trim();
                            if (email != "") {
                                if (!/^[A-Za-z0-9._-]*@[A-Za-z0-9._-]*\.[A-Za-z0-9_-]*$/.test(emails[i].trim())) {
                                    $(input).attr("data-customEmail-msg", "One of the emails is not valid.");
                                    return false;
                                }
                                numEmails++;
                            }
                        }

                        if (numEmails == 0) {
                            $(input).attr("data-customEmail-msg", "Email is required.");
                            return false;
                        }

                        return true;
                    }
                }
            });

            emailDDLDataSource = new kendo.data.DataSource({
                data: []
            });

            emailNotifyDataSource = new kendo.data.DataSource({
                batch: true,
                transport: {
                    read: {
                        url: "<?php echo $self; ?>&operation=readEmailNotify",
                        dataType: "json",
                        type: "POST"
                    },
                    <?php // Shouldn't be called.  As far as kendo is concerned, all these notifications are updates but they really aren't.
                    // I determine at the data level whether it is an insert or update. ?>
                    create: {
                        url: "<?php echo $self; ?>&operation=updateEmailNotify",
                        dataType: "json",
                        type: "POST"
                    },
                    update: {
                        url: "<?php echo $self; ?>&operation=updateEmailNotify",
                        dataType: "json",
                        type: "POST"
                    },
                    parameterMap: function(data, type) {
                        showWaitWindow();
                        if (type == "read") {
                            return {};
                        } else if (type == "update") {
                            var record = data.models[0];
                            return {role: record.roleId, email: record.email};
                        }
                    }
                },
                schema: {
                    parse: function(results) {
                        hideWaitWindow();
                        if (results.status != "000") {
                            $.homecuValidator.displayMessage(results.error, $.homecuValidator.settings.statusError );
                            return false;
                        } else if (results.info != "") {
                            $.homecuValidator.displayMessage(results.info, $.homecuValidator.settings.statusInfo );
                        }

                        if (results.action == "update") {
                            mainGridChanged = true;

                            var updateInput = $(".roleTextLabel:contains("
                                                + results.record[0].roleText.split("<br>")[0] + ")").closest(".mockTr").find("[name^='emailMulti_']");
                            $(updateInput).val(results.record[0].email);

                            <?php // Reset deletable flag based on changes here. ?>
                            var distinctFromEmails = {};
                            var fromEmailData = emailNotifyDataSource.data();
                            for(var i = 0, length = fromEmailData.length; i != length; i++) {
                                var record = fromEmailData[i];

                                if (record.single && $("[data-index='" + i + "'].unknownEmail").length == 0) {
                                    distinctFromEmails[record.email.trim()] = true;
                                }
                            }

                            <?php // Apply flag to manage email grid. ?>
                            var manageEmailGrid = $("#manageEmailGrid").data("kendoGrid");
                            var manageEmailData = manageEmailGrid.dataSource.data();
                            for(var i = 0, length = manageEmailData.length; i != length; i++) {
                                var record = manageEmailData[i];
                                manageEmailData[i].used = distinctFromEmails[record.email.trim()] === true;
                            }
                            manageEmailGrid.dataSource.data(manageEmailData);

                            return results.record;
                        } else if (results.action == "read") {

                            var template = kendo.template($("#gridTemplate").html());
                            $("#mainForm").append(template({gridData: results.data.gridData}));

                            emailDDLDataSource.data(results.data.approvedEmails);

                            $("[id^='emailDDL_']").each(function() { <?php // Destroy all custom DDLs that are created on the grid. ?>
                                var ddlDiv = this;
                                var email = $(ddlDiv).closest(".mockTr").data("email");
                                var ddl = $(ddlDiv).kendoDropDownList({
                                    dataSource: emailDDLDataSource,
                                    value: email,
                                    dataTextField: "email",
                                    dataValueField: "email",
                                    optionLabel: "Select an email...",
                                    select: function(e) {

                                        if (e.dataItem.email.trim() == "") {
                                            $.homecuValidator.displayMessage("Email cannot be cleared.", $.homecuValidator.settings.statusError );
                                            e.preventDefault();
                                        } else {
                                            $(ddlDiv).closest(".mockTr").removeClass("unknownEmail");
                                            var tr = $(this.wrapper).closest(".mockTr");
                                            var index = $(tr).data("index");
                                            emailNotifyDataSource.at(index).set("email", e.dataItem.email);
                                            emailNotifyDataSource.sync();
                                        }
                                    }
                                }).data("kendoDropDownList");

                                if (email != "" && ddl.value() == "") {
                                    $(ddlDiv).closest(".mockTr").addClass("unknownEmail");
                                }

                                fromEmailDDLs.push(ddl);
                            });

                            return results.data.gridData;
                            mainGridChanged = true;
                        }
                    },
                    model: {
                        id: "roleId",
                        fields: {
                            roleId: {type: "string"},
                            roleText: {type: "string"},
                            email: {type: "string"},
                            required: {type: "boolean"},
                            single: {type: "boolean"}
                        }
                    }
                }
            });

            emailNotifyDataSource.read();

            $("#mainForm").on("change", "[name^='emailMulti_']", function() {

                $(this).addClass("emailMultiCheck");

                var passed = $.homecuValidator.validate();

                if (passed) {
                    $(this).removeClass("emailMultiCheck");
                    var value = $(this).val().trim();
                    var tr = $(this).closest(".mockTr");
                    var index = $(tr).data("index");
                    emailNotifyDataSource.at(index).set("email", value);
                    emailNotifyDataSource.sync();
                }
            });
        }

        <?php
        /**
         * function InitEmailVerify()
         * Initializes all the controls associated with the popup.
         */
        ?>
        function InitEmailVerify() {
            var emailListBtn = $("#emailListBtn").kendoButton({
                enable: false,
                click: function(e) {
                    emailVerifyWindow.center().open();
                }
            }).data("kendoButton");

            var emailResendDataSource = new kendo.data.DataSource({
                transport: {
                    read: {
                        url: "<?php echo $self; ?>&operation=resendEmail",
                        dataType: "json",
                        type: "POST"
                    },
                    parameterMap: function(data, type) {
                        showWaitWindow();
                        return data;
                    }
                },
                schema: {
                    parse: function(data) {
                        hideWaitWindow();
                        if (data.status !== "000") {
                            $.homecuValidator.displayMessage(data.error, $.homecuValidator.settings.statusError );
                        } else {
                            if (data.info != "") {
                                $.homecuValidator.displayMessage(data.info, $.homecuValidator.settings.statusInfo );
                            }

                            <?php // Update grid so that status is pending and there is no resend button anymore. ?>
                            var email = data.email;
                            var grid = $("#manageEmailGrid").data("kendoGrid");
                            var gridData = grid.dataSource.data();

                            for (var i = 0; i != gridData.length; i++) {
                                var record = gridData[i];
                                var recordEmail = record.email.trim();
                                if (recordEmail == email) {
                                    gridData[i].status = "Pending";
                                    gridData[i].resend = false;
                                    break;
                                }
                            }

                            grid.dataSource.data(gridData);
                        }

                        return []; <?php // Save nothing in the datasource. ?>
                    }
                }
            });

            var emailVerifyValidator = {formValidate:'emailVerifyWindowForm', formStatusField: 'formValidatePopupDiv', homecuCustomRules: {
                emailInput: function(input) {
                    if (!$(input).is("[name='emailInput']")) {
                        return true;
                    }
                    var value = $(input).val().trim();

                    if (value == "") {
                        if ($.homecuValidator.isRequired) {
                            $(input).attr("data-emailInput-msg", "Email is required.");
                            return false;
                        }
                    } else {
                        if (value.toLowerCase() == "<?php echo GetTemporaryEmail(); ?>") {
                            $(input).attr("data-emailInput-msg", "Cannot add temporary email.");
                            return false;
                        }
                        if (!/^[A-Za-z0-9._-]*@[A-Za-z0-9._-]*\.[A-Za-z0-9_-]*$/.test(value)) {
                            $(input).attr("data-emailInput-msg", "Email is not valid.");
                            return false;
                        }

                        var emailRegExp = new RegExp ("\\b" + value + "\\b", "i");
                        if ($("#manageEmailGrid").text().match(emailRegExp) != null) {
                            $(input).attr("data-emailInput-msg", "Email is a duplicate.");
                            return false;
                        }
                    }

                    return true;
                }
            }};
            var emailVerifyWindow = $("<div id='emailVerifyWindow'></div>").appendTo("body").kendoWindow({
                modal: true,
                title: "Manage Email List",
                visible: false,
                maxWidth: 600,
                content: {
                    template: $("#emailVerifyWindowTemplate").html()
                },
                open: function() {
                    $("#emailVerifyWindow").data("resolved", false);
                    if ($("#emailVerifyWindow").data("first")) {
                        $("#emailVerifyWindow").data("first", false);
                    }

                    $("#emailVerifyWindow").data("isUpdate", false);

                    if (window.activeWindows != null) {
                        window.activeWindows.push(this);
                    }
                    $.homecuValidator.setup(emailVerifyValidator);
                    $.homecuValidator.validate(); <?php // Clear the red around the input. ?>
                },
                close: function(e) {
                    var resolved = $("#emailVerifyWindow").data("resolved");

                    if (!resolved) {
                        var manageEmailGrid = $("#manageEmailGrid").data("kendoGrid");
                        var isUpdate = $("#emailVerifyWindow").data("isUpdate");
                        var hasChanges = $("#emailVerifyWindow").data("hasChanges");
                        var isNew = $("#emailVerifyWindow").data("isNew");
                        if (isNew) {
                            $("#emailVerifyWindow .prepopulatedMsg").show();
                        } else {
                            $("#emailVerifyWindow .prepopulatedMsg").hide();
                        }
                        if ((!hasChanges && !isNew) || (isNew && manageEmailGrid.dataSource.data().length == 0)) {
                        <?php // Close then.  "Cancel" and "update" are the same at this instance. ?>
                            $("[name='emailInput']").val(null);
                            if (window.activeWindows != null) {
                                window.activeWindows.pop();
                            }
                            $.homecuValidator.setup({formValidate:'mainForm', formStatusField: 'formValidateMainDiv'});
                        } else {
                            if (isUpdate) {
                                manageEmailGrid.dataSource.read({operation: "updateVerifiedEmailList"}); <?php // Trigger update ?>
                                e.preventDefault(); <?php // Prevent it from closing until it can be verified that the grid updated. ?>
                            } else {
                                e.preventDefault();
                                $("[name='emailInput']").val(null);
                                var discardChangesDialog = $("#discardChangesDialog").data("kendoDialog");
                                if (discardChangesDialog == null) {
                                    discardChangesDialog = $("<div id='discardChangesDialog'></div>").appendTo("body").kendoDialog({
                                        title: "Discard Changes",
                                        content: "<p>Changes have been made to the CU email list.</p><p>Do you wish to discard your changes?</p>",
                                        actions: [
                                          {text: "No"},
                                          {text: "Yes", primary: true, action: function() {
                                            var isNew = $("#emailVerifyWindow").data("isNew");
                                            var hasChanges = $("#emailVerifyWindow").data("hasChanges");

                                            if (isNew) { <?php // Here, do not get the previous data on cancel.  It is already created. ?>
                                                if (hasChanges) {
                                                    mainGridChanged = true; <?php // Force a reread of the used emails on reopen. ?>
                                                }
                                                if (window.activeWindows != null) {
                                                    window.activeWindows.pop();
                                                }
                                                $.homecuValidator.setup({formValidate:'mainForm', formStatusField: 'formValidateMainDiv'});
                                            } else {
                                                manageEmailGrid.dataSource.data(previousVerifiedEmailData);
                                                manageEmailGrid.dataSource.sync();


                                                $.homecuValidator.setup({formValidate:'mainForm', formStatusField: 'formValidateMainDiv'});
                                            }

                                            $("#emailVerifyWindow").data("hasChanges", false);
                                            $("#emailVerifyWindow").data("resolved", true);
                                            $("#emailVerifyWindow").data("kendoWindow").close();
                                          }}
                                        ],
                                        visible: false,
                                        open: function() {
                                          if (window.activeWindows != null) {
                                            window.activeWindows.push(this);
                                          }
                                        },
                                        close: function() {
                                          if (window.activeWindows != null) {
                                            window.activeWindows.pop();
                                          }

                                        }
                                    }).data("kendoDialog");
                                }

                                discardChangesDialog.open();
                            }
                        }
                    }

                },
            }).data("kendoWindow");
            $("#emailVerifyWindow").data("first", true);

            var iconWidth = 35;
            var manageEmailGrid = $("#manageEmailGrid").kendoGrid({
                dataSource: {
                    schema: {
                        parse: function(data) {
                            hideWaitWindow();
                            if (data.status != "000") {
                                $.homecuValidator.displayMessage(data.error, $.homecuValidator.settings.statusError );
                                $("#emailVerifyWindow").data("hasChanges", false);
                            } else {
                                noSESRole = false;
                                $("#emailVerifyWindow").data("isNew", false);

                                if ($("#emailVerifyWindow:visible").length > 0) {
                                    $("#emailVerifyWindow").data("hasChanges", false);
                                    $("#emailVerifyWindow").data("kendoWindow").close();
                                } else {
                                    $("#emailListBtn").data("kendoButton").enable(true);

                                    if (data.isNew === true) {
                                        $("#emailVerifyWindow").data("isNew", true);

                                        if (data.verifiedEmailList.length > 0) {
                                            $("#emailVerifyWindow .prepopulatedMsg").show();
                                        }
                                        noSESRole = true;
                                    }
                                }

                                if (data.info && data.info.length > 0) {
                                    $.homecuValidator.displayMessage(data.info, $.homecuValidator.settings.statusInfo );
                                }
                            }
                            previousVerifiedEmailData = data.verifiedEmailList.slice(0);

                            <?php // Update list for DDLs and Multiselects. ?>
                            var replacementList = [];
                            for(var i = 0; i != data.verifiedEmailList.length; i++) {
                                var record = data.verifiedEmailList[i];
                                if (record.status == "Success") {
                                    replacementList.push({email: record.email});
                                }
                            }

                            <?php // Add temporary email. ?>
                            replacementList.push({email: "<?php echo GetTemporaryEmail(); ?>"});

                            emailDDLDataSource.data(replacementList);

                            for(var i = 0; i != fromEmailDDLs.length; i++) {
                                fromEmailDDLs[i].refresh();
                            }

                            return data.verifiedEmailList;
                        },
                        model: {
                            id: "email",
                            fields: {
                                email: {type: "string"},
                                status: {type: "string", defaultValue: ""},
                                deleted: {type: "boolean", defaultValue: false},
                                used: {type: "boolean", defaultValue: false},
                                itsNew: {type: "boolean", defaultValue: true},
                                isDirty: {type: "boolean", defaultValue: true},
                                resend: {type: "boolean", defaultValue: false}
                            }
                        }
                    },
                    transport: {
                        read: {
                            url: "<?php echo $self; ?>",
                            dataType: "json",
                            type: "POST",
                            data: {
                                operation: "readVerifiedEmailList"
                            }
                        },
                        parameterMap: function(data, type) {
                            showWaitWindow();
                            emailDDLDataSource.data(data.approvedEmails);
                            if (data.operation == "readVerifiedEmailList") {
                                return data;
                            } else if (data.operation == "updateVerifiedEmailList") {
                                var gridData = $("#manageEmailGrid").data("kendoGrid").dataSource.data();
                                gridData = $.grep(gridData, function (n, i) {
                                    return !(n.itsNew === true && n.deleted === true);
                                });
                                data.emailList = kendo.stringify(gridData);
                                return data;
                            }
                        }
                    },
                    filter: {field: "deleted", operator: "neq", value: true}
                },
                columns: [
                    {field: "email", title: "Address"},
                    {field: "status", width: iconWidth, title: "Status"},
                    {width: iconWidth},
                    {width: iconWidth}
                ],
                rowTemplate: $("#manageEmailRowTemplate").html(),
                noRecords: {
                  template: "<tr class='noRecordsDiv'><td colspan='4'>No Records Found</td></tr>"
                },
            }).data("kendoWindow");

            $("#manageEmailGrid .k-grid-header th:eq(2)").remove();
            $("#manageEmailGrid .k-grid-header th:eq(1)").attr("colSpan", 2);

            <?php // Click events ?>

            $("#manageEmailGrid").on("click", ".removeTD", function() {
                var removeDialog = $("#removeDialog").data("kendoDialog");

                if (removeDialog == null) {
                    removeDialog = $("<div id='removeDialog'></div>").appendTo("body").kendoDialog({
                        title: "Confirm Deletion",
                        content: "Are you sure you want to delete this email?",
                        actions: [
                            {text: "No"},
                            {text: "Yes", primary: true, action: function() {
                                $("#emailVerifyWindow").data("hasChanges", true);
                                var thisTr = $("#removeDialog").data("thisTr");
                                var grid = $("#manageEmailGrid").data("kendoGrid");
                                var dataItem = grid.dataItem($(thisTr));
                                dataItem.deleted = true;
                                grid.dataSource.sync();
                            }}
                        ],
                        open: function (e) {
                            if (window.activeWindows != null) {
                                window.activeWindows.push(this);
                            }
                        },
                        close: function (e) {
                            if (window.activeWindows != null) {
                                window.activeWindows.pop();
                            }
                        }
                    }).data("kendoDialog");
                }

                $("#removeDialog").data("thisTr", $(this).closest("tr"));
                removeDialog.open();
            });

            $("#manageEmailGrid").on("click", ".resendTD", function() {
                var email = $(this).closest("tr").find("td:eq(0)").text().trim();
                emailResendDataSource.read({email: email});
            });

            $("#emailVerifyWindow").on("click", ".cancelBtn", function() {
                $("#emailVerifyWindow").data("kendoWindow").close();
            });

            $("#emailVerifyWindow").on("click", ".updateBtn", function() {
                if ($.homecuValidator.validate()) {

                    <?php // If there is an email in the input, go ahead and add it to the grid because that was the user's intention. ?>
                    var newEmail = $("[name='emailInput']").val().trim();
                    if (newEmail != "") {
                        $("#emailVerifyWindow").data("hasChanges", true);
                        $("#manageEmailGrid").data("kendoGrid").dataSource.add({email: newEmail, status: "", used: false, itsNew: true,
                                                                               isDirty: true, resend: false});
                        <?php // ASSUME that it is not in use. ?>
                        $("[name='emailInput']").val(null); <?php // Clear for next email. ?>
                    }

                    $("#emailVerifyWindow").data("isUpdate", true);
                    $("#emailVerifyWindow").data("kendoWindow").close();
                }

            });

            $("[name='emailInput']").on("keyup", function(e) { <?php // Needs the name attribute so it validates correctly. ?>
                var code = e.which;
                var enterCode = 13;
                var commaCode = 188;

                if (code == enterCode) {
                    e.preventDefault();
                } else if (code == commaCode) {
                    $(this).val($(this).val().trim().replace(",", ""));
                }

                if (code == enterCode || code == commaCode) {
                    $.homecuValidator.isRequired = true;
                    if ($.homecuValidator.validate()) {
                        $("#emailVerifyWindow").data("hasChanges", true);
                        $("#manageEmailGrid").data("kendoGrid").dataSource.add({email: $(this).val(), status: "", used: false, itsNew: true,
                                                                               isDirty: true, resend: false});
                        <?php // ASSUME that it is not in use. ?>
                        $(this).val(null); <?php // Clear for next email. ?>
                    }
                    $.homecuValidator.isRequired = false;

                }

            });

            <?php // Tooltips ?>

            <?php printExtendShowOverflown(); ?>

            var toolTipProps = homecuTooltip.defaults;
            toolTipProps.filter = ".showEllipsis:visible:overflown";
            toolTipProps.content = function(e) {
                return $(e.target).text().trim();
            };

            $("#manageEmailGrid").kendoTooltip(toolTipProps);

            toolTipProps.filter = ".statusTD";
            toolTipProps.content = function(e) {
                return $(e.target).data("status").trim();
            }

            $("#manageEmailGrid").kendoTooltip(toolTipProps);
        }

        $(document).ready(function() {
            InitEmailNotify();
            InitEmailVerify();
            <?php printClickOverlayEvent(); ?>
        });
    </script>

    <script type="text/x-kendo-template" id="gridTemplate">
        # var index = 0; #
            <div class="row hcuSpacer h3">
                <div class="col-xs-12">
                    CU Feature Emails
                </div>
            </div>
            <div class="row hcuSpacer">
                <div class="col-xs-12 hcu-secondary">
                    <div class="vsgSecondary">
                        Select an email address for each type of notification message shown below.
                    </div>
                </div>
            </div>
            <div id="gridContainerFrom"><div class="container-fluid well well-sm">
                # for (index; index != gridData.length; index++) { #
                    # var record = gridData[index]; #
                    # if (!record.single) { <?php // Records are sorted with the email that must be single at the top.  Treat the singles differently. ?>
                        break;
                    } #
                    <div class="row hcuSpacer mockTr" data-index="#:index#" data-email="#:record.email#">
                        <div class="col-xs-12 col-sm-4 col-md-4">
                            <label>#= record.roleText #</label>
                        </div>
                        <div class="col-xs-12 col-sm-8 col-md-8">
                            <div id='emailDDL_#:index#' class='hcu-all-100'></div>
                        </div>
                    </div>
                # } #
            </div></div>

            <div class="row hcuSpacer h3">
                <div class="col-xs-12">
                    Notification Emails From Homecu
                </div>
            </div>
            <div class="row hcuSpacer">
                <div class="col-xs-12 hcu-secondary">
                    <div class="vsgSecondary">
                        Select an email address for each type of notification message shown below.
                        To enter a list of addresses, use a semicolon (;) to separate multiple addresses.
                    </div>
                </div>
            </div>
            <div class="row hcuSpacer">
                <div class="col-xs-12 hcu-secondary">
                    <div class="vsgSecondary">
                        Existing addresses can be changed, but they cannot be left blank.
                    </div>
                </div>
            </div>
            <div id="gridContainerTo"><div class="container-fluid well well-sm">
                # for (index; index != gridData.length; index++) { #
                    # var record = gridData[index]; #
                    <div class="row hcuSpacer mockTr" data-index="#:index#">
                        <div class="col-xs-12 col-sm-4 col-md-4">
                            <label class='roleTextLabel'>#= record.roleText #</label>
                        </div>
                        <div class="col-xs-12 col-sm-8 col-md-8">
                            <input type='text' name='emailMulti_#:index#' class='hcu-all-100 k-input k-textbox' placeholder='Separate email addresses with semicolons.'
                                value="#:record.email#" data-hademail="# if (record.email.trim() == '') { # N # } else { # Y # } #">
                        </div>
                    </div>
                # } #
        </div></div>
    </script>
    <script type="text/x-kendo-template" id="emailVerifyWindowTemplate">
        <div class="container-fluid hcu-template" id="emailVerifyWindowForm">
            <div id="formValidatePopupDiv"></div>
            <div class="row hcuSpacer">
                <div class="col-xs-12 hcu-secondary">
                    <div class="vsgSecondary">
                        Add new emails to be verified here.  Pressing update will start the email verification process.
                        Each address will receive an email with a web link to verify the address.
                        After verification, email addresses can be used as the notification from address.
                        <span class="prepopulatedMsg" style="display:none;">List was prepopulated from emails currently used.  They are not verified.</span>
                    </div>
                </div>
            </div>
            <div class="row hcuSpacer">
                <div class="col-xs-12">
                    <input type="text" name="emailInput" class="k-textbox hcu-all-100" placeholder="Separate email addresses with commas.">
                </div>
            </div>
            <div class="row hcuSpacer">
                <div class="col-xs-12">
                    <div id="manageEmailGrid"></div>
                </div>
            </div>
            <div class="row hcuSpacer">
                <div class="col-xs-12">
                    &nbsp;
                </div>
            </div>
            <div class="row hcuSpacer">
                <div class="col-xs-12">
                    <div class="k-block k-shadow k-display-block container-fluid">
                        <span class="hcu-secondary col-xs-12 statusRow">
                            <span class="col-xs-1"><i class="fa fa-plus"></i></span>
                            <span class="vsgSecondary col-xs-11">New address, not verified</span>
                        </span>
                        <span class="hcu-secondary col-xs-12 statusRow">
                            <span class="col-xs-1"><i class="fa fa-times"></i></span>
                            <span class="vsgSecondary col-xs-11">Removes email from list</span>
                        </span>
                        <span class="hcu-secondary col-xs-12 statusRow">
                            <span class="col-xs-1"><i class="fa fa-paper-plane"></i></span>
                            <span class="vsgSecondary col-xs-11">Resends verification email (1 hour wait)</span>
                        </span>
                        <span class="hcu-secondary col-xs-12 statusRow">
                            <span class="col-xs-1 vsgSecondary">
                                <span class="restriction pending readonly hcu-all-100">
                                    <i class="fa fa-circle"></i>
                                </span>
                            </span>
                            <span class="vsgSecondary col-xs-11">Verification pending</span>
                        </span>
                        <span class="hcu-secondary col-xs-12 statusRow">
                            <span class="col-xs-1 vsgSecondary">
                                <span class="restriction ban readonly hcu-all-100">
                                    <i class="fa fa-ban"></i>
                                </span>
                            </span>
                            <span class="vsgSecondary col-xs-11">Verification failed</span>
                        </span>
                        <span class="hcu-secondary col-xs-12 statusRow">
                            <span class="col-xs-1 vsgSecondary">
                                <span class="restriction allow readonly hcu-all-100">
                                    <i class="fa fa-check"></i>
                                </span>
                            </span>
                            <span class="vsgSecondary col-xs-11">Verification passed</span>
                        </span>
                    </div>
                </div>
            </div>

            <div class="hcu-edit-buttons k-state-default">
                <a class="cancelBtn" href="\\#">Cancel</a>
                &nbsp;&nbsp;&nbsp;
                <a class="updateBtn k-button k-primary" href="\\#"><i class="fa fa-check"></i>Update</a>
            </div>
        </div>
    </script>

    <script type="text/x-kendo-template" id="manageEmailRowTemplate">
        # var statusImg = ""; var statusDescr = ""; #
        # switch (status) {
            case "Success":
                statusDescr = "Verification passed";
                statusImg = '<span class="vsgSecondary"> <div class="restriction allow readonly hcu-all-100"><i class="fa fa-check"></i></div> </span>';
                break;
            case "Pending":
            case "NotStarted":
                statusDescr = "Verification pending";
                statusImg = '<span class="vsgSecondary"> <div class="restriction pending readonly hcu-all-100"><i class="fa fa-circle"></i></div> </span>';
                break;
            case "Failed":
            case "TemporaryFailure":
                statusDescr = "Verification failed";
                statusImg = '<span class="vsgSecondary"> <div class="restriction ban readonly hcu-all-100"><i class="fa fa-ban"></i></div> </span>';
                break;
            case "":
            default:
                statusImg = '<span class="vsgSecondary"> <div class="readonly hcu-all-100"><i class="fa fa-plus"></i></div> </span>';
                statusDescr = "New address, not verified";
                break;
        } #
        # var dirtyClass = isDirty ? "k-dirty-cell" : ""; #
        # var dirtySpan = isDirty ? "<span class='k-dirty'></span>" : ""; #

        <tr data-uid="#= uid #">
            <td class="showEllipsis #= dirtyClass #">#= dirtySpan # #: email #</td>
            <td class="statusTD" data-status="#: statusDescr #"> #= statusImg # </td>

            # if (resend) { #
            <td class="resendTD"><i class="fa fa-paper-plane"></i></td>
            # } else { #
            <td></td>
            # } #

            # if (!used) { #
            <td class="removeTD"><i class="fa fa-times"></i></td>
            # } else { #
            <td></td>
            # } #
        </tr>
    </script>
    <div class="container-fluid" id="mainForm">
        <div id="formValidateMainDiv"></div>
        <div class="row hcuSpacer">
            <div class="col-xs-12">
                <a href="#" id="emailListBtn">Manage Email List</a>
            </div>
        </div>
    </div>

<?php }