fleet-contractor/Site/Credentials/ManageJDNotifications.aspx

<%@ Page Title="" Language="C#" MasterPageFile="~/Credentials/Credentials.master" AutoEventWireup="true" CodeFile="ManageJDNotifications.aspx.cs" Inherits="ManageJDNotifications" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <style type="text/css">
        .dialog .dialog-title .dialog-close {
            float: right;
            margin-right: 6px;
            cursor: pointer;
        }

            .dialog .dialog-title .dialog-close:before {
                content: '\e600';
            }

        .dialog-content table {
            border-collapse: collapse;
            width: 100%;
        }

            .dialog-content table td {
                padding-top: 30px;
            }

                .dialog-content table td.label {
                    width: 130px;
                    text-align: right;
                    padding-right: 10px;
                    line-height: 24px;
                    height: 24px;
                    vertical-align: top;
                }

                .dialog-content table td input,
                .dialog-content table td textarea {
                    border: 1px solid #a9a9a9;
                    width: 200px;
                    height: 18px;
                    padding: 1px;
                }

                    .dialog-content table td input[type="checkbox"] {
                        border: none;
                    }

                .dialog-content table td textarea {
                    height: 100px;
                    max-width: 200px;
                }

        .icon {
            font-family: CalciteWebCoreIcons;
            cursor: default;
        }
    </style>

    <script type="text/javascript">
        var credentialList;
        var authdata = undefined;

        credentialquery = function (method, param, callback, error, nolog) {
            _network.request("Credentials/ManageJDNotifications.aspx?tp=ashx", -1, method, param, callback, error, nolog);
        }

        function OnAdd() {
            $('#requestCre').removeAttr("disabled");
            $('#dialog_Verifierd').attr("disabled", "disabled");
            $('#dialog_displayname').attr("disabled", "disabled");
            $('#saveCre').attr("disabled", "disabled");

            $('#dialog_Verifierd').val('');
            $('#dialog_displayname').val('');
            $('#dialog_password').val('');
            showmaskbg(true);
            $('#dialog_credential')
                .attr('act', 'add')
                .css({
                    'top': (document.documentElement.clientHeight - $('#dialog_credential').height()) / 3,
                    'left': (document.documentElement.clientWidth - $('#dialog_credential').width()) / 2
                })
                .showDialogfixed();
            $('#dialog_displayname').focus();
        }

        function OnRefresh() {
            showloading(true);
            credentialquery("GetJDNotificationCredentials", [], function (data) {
                showloading(false);
                credentialList = data;
                showCredentialList(credentialList);
            }, function (err) {
                showloading(false);
            });
        }


        function showCredentialList(data) {
            var rows = [];
            for (var i = 0; i < data.length; i++) {
                var r = data[i];
                for (var j in r) {
                    if (j === "ExpireDate")
                        r[j] = { DisplayValue: r["ExpireDateStr"], Value: r[j] };
                }

                var fr = { Values: r };
                rows.push(fr);
            }

            grid_dt.setData(rows);
        }

        var grid_dt;
        function InitGridData() {
            grid_dt = new GridView('#jdlinklist');
            grid_dt.lang = {
                all: GetTextByKey("P_GRID_ALL", "(All)"),
                ok: GetTextByKey("P_GRID_OK", "OK"),
                reset: GetTextByKey("P_GRID_RESET", "Reset")
            };
            var list_columns = [
                { name: 'UserName', caption: GetTextByKey("P_JDN_USERNAME", "User Name"), valueIndex: 'UserName', css: { 'width': 400, 'text-align': 'left' } },
                { name: 'DisplayName', caption: GetTextByKey("P_JDN_DISPLAYAME", "Display Name"), valueIndex: 'DisplayName', css: { 'width': 400, 'text-align': 'left' } },
                { name: 'ExpireDate', caption: GetTextByKey("P_JDN_EXPIRATIONDATE", "Expiration Date"), valueIndex: 'ExpireDate', css: { 'width': 150, 'text-align': 'left' } },
                { name: 'Delete', caption: "", css: { 'width': 30, 'text-align': 'center' } }
            ];
            var columns = [];
            // head
            for (var hd in list_columns) {
                var col = {};
                col.name = list_columns[hd].name;
                col.caption = list_columns[hd].caption;
                col.visible = true;
                col.sortable = true;
                col.width = list_columns[hd].css.width;
                col.align = list_columns[hd].css["text-align"]
                col.key = list_columns[hd].valueIndex;
                if (col.name === "Delete") {
                    col.isurl = true;
                    col.text = "\uf00d";
                    col.events = {
                        onclick: function () {
                            OnDelete(this);
                        }
                    };
                    col.classFilter = function (e) {
                        return "icon-col";
                    };
                    col.attrs = { 'title': GetTextByKey("P_JDN_DELETE", 'Delete') };
                }
                columns.push(col);
            }
            grid_dt.canMultiSelect = false;
            grid_dt.columns = columns;
            grid_dt.init();

            grid_dt.selectedrowchanged = function (rowindex) {
                var rowdata = grid_dt.source[rowindex];
                if (rowdata) {
                    creid = rowdata.Values.ID;
                }
            }
        }

        function RequestCreClick() {
            $('#requestCre').attr("disabled", "disabled");

            var alerttitle = GetTextByKey("P_JDN_AUTHORIZETHROUGHJOHNDEERE", "Authorize through John Deere");
            credentialquery("JDNotificationAuthorizeRequestToken", [], function (data) {
                if (typeof data === "string") {
                    showAlert(data, alerttitle);
                    $('#requestCre').removeAttr("disabled");
                    return;
                }
                authdata = data;
                if (authdata.AuthorizeRequestTokenUri != "") {
                    window.open(authdata.AuthorizeRequestTokenUri);
                    $('#dialog_displayname').removeAttr("disabled").val("").focus();
                    $('#dialog_Verifierd').removeAttr("disabled").val("");
                    $('#saveCre').removeAttr("disabled");
                }
                else {
                    $('#dialog_Verifierd').val("").attr("disabled", "disabled");
                    $('#dialog_displayname').val("").attr("disabled", "disabled");
                    showAlert(GetTextByKey("P_JDN_REQUESTFORVERIFIERFAILED", "Request for Verifier failed."), alerttitle);
                }
            }, function (err) {
                showAlert(GetTextByKey("P_JDN_FAILEDTOAUTHORIZETHROUGHJD", "Failed to authorize through John Deere this credential."), alerttitle);
            });
        }

        function SaveCre() {
            var alerttitle = GetTextByKey("P_JDN_AUTHORIZE", "Authorize");
            var verifier = $.trim($('#dialog_Verifierd').val());
            if (verifier.length == 0) {
                showAlert(GetTextByKey("P_JDN_PLEASEINPUTVERIFIER", 'Please input Verifier.'), alerttitle);
                return false;
            }
            var displayname = $.trim($('#dialog_displayname').val());
            credentialquery("FinishJDNotificationOAuthRequest", JSON.stringify(authdata) + String.fromCharCode(170) + verifier + String.fromCharCode(170) + displayname, function (data) {
                if (data !== 'OK') {
                    showAlert(data, alerttitle);
                } else {
                    $('#dialog_credential').hideDialog();
                    OnRefresh();
                }
            }, function (err) {
                showAlert(GetTextByKey("P_JDN_FAILEDTOAUTHORIZETHISCREDENTIAL", "Failed to authorize this credential."), alerttitle);
            });
        }

        function OnDelete(cr) {
            var cre = cr;
            if (!cre) {
                return;
            }
            var alerttitle = GetTextByKey("P_JDN_DELETECREDENTIAL", "Delete Credential");
            showConfirm(GetTextByKey("P_JDN_DELETETHECREDENTIALTIPS", 'Do you want to delete the credential?'), alerttitle, function () {
                credentialquery("DeleteSubscription", cre.ID, function (data) {
                    if (data !== 'OK') {
                        showAlert(data, alerttitle);
                        return;
                    }
                    OnRefresh();
                }, function (err) {
                    showAlert(GetTextByKey("GetTextByKey", 'Failed to delete this credential.'), alerttitle);
                });
            });
        }

        $(function () {
            setPageTitle(GetTextByKey("P_JOHNDEERENOTIFICATIONS", 'JohnDeere Notifications'), true);
            InitGridData();

            $('#dialog_credential').dialog(function () {
                showmaskbg(false);
            });
            OnRefresh();
            $(window).resize(function () {
                $("#jdlinklist").css("height", $(window).height() - $("#jdlinklist").offset().top - 4);
                grid_dt && grid_dt.resize();
            }).resize();
        });

    </script>
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <div style="min-width: 400px;">
        <div class="page_title" data-lgid="P_JOHNDEERENOTIFICATIONS">JohnDeere Notifications</div>
        <div class="function_title">
            <span class="sbutton iconadd" onclick="OnAdd();" data-lgid="P_JDN_ADD">Add</span>
            <span class="sbutton iconrefresh" onclick="OnRefresh();" data-lgid="P_JDN_REFRESH">Refresh</span>
        </div>
        <div class="clear"></div>
        <div id="jdlinklist"></div>
    </div>

    <div id="mask_bg">
        <div class="loading c-spin"></div>
    </div>
    <div class="dialog" id="dialog_credential" style="display: none; width: 600px;">
        <div class="dialog-title"><span class="title" data-lgid="P_JDN_REQUESTCREDENTIAL">Request Credential</span><em class="dialog-close"></em></div>
        <div class="dialog-content">
            <table>
                <tr>
                    <td class="label" data-lgid="P_JDN_DISPLAYAME_COLON">Display Name:</td>
                    <td>
                        <input id="dialog_displayname" maxlength="50" tabindex="2" style="width: 400px;" disabled="disabled" /></td>
                </tr>
                <tr>
                    <td class="label" data-lgid="P_JDN_VERIFIER_COLON">Verifier:</td>
                    <td>
                        <input id="dialog_Verifierd" maxlength="50" tabindex="2" style="width: 400px;" disabled="disabled" /></td>
                </tr>
            </table>
        </div>
        <div class="dialog-func" style="margin-top: 16px;">
            <input type="button" value="Cancel" data-lgid="P_JDN_CANCEL" class="dialog-close" tabindex="5" />
            <input type="button" id="saveCre" style="width: unset;" onclick="SaveCre(); return false;" disabled="disabled" value="Authorize" data-lgid="P_JDN_AUTHORIZE" tabindex="4" />
            <input type="button" id="requestCre" style="width: unset;" onclick="RequestCreClick(); return false;" value="Authorize through John Deere" data-lgid="P_JDN_AUTHORIZETHROUGHJOHNDEERE" tabindex="3" />
            <div class="clear"></div>
        </div>
    </div>
</asp:Content>