jdescopingtool/OLD/WebInterface/Views/Search/Index.cshtml

@using WebInterface.Helpers
@{
    ViewBag.Title = "Searches";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@Scripts.Render("~/Scripts/kendoHelpers.js")
@Scripts.Render("~/Scripts/model/models.js")
@Scripts.Render("~/Scripts/jquery.signalR-2.2.1.js")
<script src="~/signalr/hubs"></script>

<h2>
    @ViewBag.Title

    <span class="btn-group" style="padding-left: 25px;">
        @Html.ActionLink("Start New Search", "Create", null, new { @class = "btn btn-sm btn-primary", target = "_blank" })
        @Html.ActionLink("View Search Queue", "Queue", null, new { @class = "btn btn-sm btn-default", target = "_blank" })
    </span>
</h2>

<div id="sessionsGrid"
     data-role="grid"
     data-editable="false"
     data-sortable="{ 'mode' : 'multiple', 'allowUnsort' : true}"
     data-scrollage="true"
     data-pageable="{ 'pagesize' : 10 }"
     data-pagesize="10"
     data-bind="source: sessions"
     data-columns="[
                        { 'field': 'Name' },
                        { 'field': 'SubmitDT', 'title': 'Submitted', 'template': kendo.template($('#submitDTTemplate').html()) },
                        { 'field': 'Status' },
                        { 'command' : [ { 'name' : 'viewSearch', 'text': 'View', 'click': viewModel.ViewSearch} ], 'title': 'Actions', 'width': '100px'}
                   ]"
     style="min-height: 450px;"></div>

<script type="text/x-kendo-template" id="submitDTTemplate">
    #= SubmitDT != null ? kendo.toString(kendo.parseDate(SubmitDT), 'MM/dd/yyyy hh:mm:ss tt') : '' #
</script>

<script type="text/javascript">
    var statusHub = $.connection.statusHub;
    statusHub.client.searchUpdate = function (searchUpdate) {
        viewModel.processUpdate(searchUpdate);
    };
    window.hubReady = $.connection.hub.start().done(function () {
    });

    $.connection.hub.disconnected(function () {
        setTimeout(function() {
            $.connection.hub.start();
        }, 5000); // Restart connection after 5 seconds.
    });

    var viewModel = kendo.observable({
        sessions: new kendo.data.DataSource({
            pageSize: 10,
            sort: { field: "SubmitDT", dir: "desc" },
            schema: {
                model: {
                    id: 'ID'
                }
            }
        }),
        setData: function (data) {
            this.sessions.data(data);
            kendo.ui.progress($('#sessionsGrid'), false);
        },
        processUpdate: function (searchUpdate) {
            if (searchUpdate.UserName !== '@(Html.CurrentUser().Username)') {
                return;
            }
            var ds = this.get('sessions');
            var existing = ds.get(searchUpdate.ID);
            if (existing) {
                ds.pushUpdate(searchUpdate);
            } else {
                ds.pushCreate(searchUpdate);
            }
        },
        ViewSearch: function (e) {
            e.preventDefault();

            //Open search window
            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
            var url = '@Url.Action("Create","Search")?id=' + dataItem.ID;
            window.open(url, '_blank').focus();
        }
    });

    $(document).ready(function () {
        $.ajaxSetup({ cache: false });

        //Find grid container
        var sessionsGrid = $('#sessionsGrid');

        //Bind data model
        kendo.bind(sessionsGrid, viewModel);

        //Display loading indicator
        kendo.ui.progress(sessionsGrid, true);

        //Handle row double clicks
        kendoHelpers.grid.eventRowDoubleClick($('#sessionsGrid').data('kendoGrid'),
            function (dataItem) {
                //Open session setup window
                var url = '@Url.Action("Create","Search")?id=' + dataItem.ID;
                window.open(url, '_blank').focus();
            });

        //Load sessions data
        $.getJSON('@Url.Action("GetSearches", "Search")',
            null,
            function (results) {
                viewModel.setData(results);
            });
    });
</script>