HPCC-9881 Add default context menu support

Add default context menu support for "Refresh" and "Open".
Add method for derived pages to enhance menu.
Add default messages for loading and no data.

Fixes HPCC-9881

Signed-off-by: Gordon Smith <gordon.smith@lexisnexis.com>

esp/files/css/hpcc.css

@@ -214,6 +214,12 @@ hr.dashedLine {
     top:56px !important;
 }
 
+.claro .dgridInfo {
+    background-position:left center;
+    background-repeat: no-repeat;
+    padding-left:25px;
+}
+
 #stubTitlebar :focus {
     outline: none;
 }

esp/files/scripts/ESPUtil.js

@@ -137,7 +137,7 @@ define([
         }),
 
         GridHelper: declare(null, {
-            workunitsGridObserver: [],
+            pagedGridObserver: [],
 
             onSelectionChanged: function (callback) {
                 this.on("dgrid-select", function (event) {
@@ -152,10 +152,10 @@ define([
                 var context = this;
                 this.on("dgrid-page-complete", function (event) {
                     callback();
-                    if (context.workunitsGridObserver[event.page]) {
-                        context.workunitsGridObserver[event.page].cancel();
+                    if (context.pagedGridObserver[event.page]) {
+                        context.pagedGridObserver[event.page].cancel();
                     }
-                    context.workunitsGridObserver[event.page] = event.results.observe(function (object, removedFrom, insertedInto) {
+                    context.pagedGridObserver[event.page] = event.results.observe(function (object, removedFrom, insertedInto) {
                         callback(object, removedFrom, insertedInto);
                     }, true);
                 });

esp/files/scripts/GridDetailsWidget.js

@@ -20,6 +20,10 @@ define([
     "dojo/store/Observable",
 
     "dijit/registry",
+    "dijit/Menu",
+    "dijit/MenuItem",
+    "dijit/MenuSeparator",
+    "dijit/PopupMenuItem",
 
     "hpcc/_TabContainerWidget",
 
@@ -33,7 +37,7 @@ define([
     "dijit/layout/ContentPane"
 
 ], function (declare, lang, Memory, Observable,
-                registry,
+                registry, Menu, MenuItem, MenuSeparator, PopupMenuItem,
                 _TabContainerWidget,
                 template) {
     return declare("GridDetailsWidget", [_TabContainerWidget], {
@@ -45,6 +49,7 @@ define([
 
         store: null,
         grid: null,
+        contextMenu: null,
 
         postCreate: function (args) {
             this.inherited(arguments);
@@ -53,6 +58,36 @@ define([
 
         startup: function (args) {
             this.inherited(arguments);
+            this.initGrid();
+            this.initContextMenu();
+        },
+
+        //  Hitched actions  ---
+        _onRefresh: function (event) {
+            this.refreshGrid();
+        },
+
+        _onOpen: function (event, params) {
+            var selections = this.grid.getSelected();
+            var firstTab = null;
+            for (var i = 0; i < selections.length; ++i) {
+                var tab = this.ensurePane(selections[i], params);
+                if (i == 0) {
+                    firstTab = tab;
+                }
+            }
+            if (firstTab) {
+                this.selectChild(firstTab);
+            }
+        },
+
+        _onRowDblClick: function (row) {
+            var tab = this.ensurePane(row);
+            this.selectChild(tab);
+        },
+
+        //  Implementation  ---
+        initGrid: function() {
             var context = this;
             var store = new Memory({
                 idProperty: this.idProperty,
@@ -77,31 +112,44 @@ define([
             this.grid.onContentChanged(function (object, removedFrom, insertedInto) {
                 context._refreshActionState();
             });
+            if (!this.grid.get("noDataMessage")) {
+                this.grid.set("noDataMessage", "<span class='dgridInfo'>Zero Rows...</span>");
+            }
+            if (!this.grid.get("loadingMessage")) {
+                this.grid.set("loadingMessage", "<span class='dgridInfo'>Loading...</span>");
+            }
             this.grid.startup();
         },
 
-        //  Hitched actions  ---
-        _onRefresh: function (event) {
-            this.refreshGrid();
+        appendMenuItem: function (menu, label, onClick) {
+            var menuItem = new MenuItem({
+                label: label,
+                onClick: onClick
+            });
+            menu.addChild(menuItem);
+            return menuItem;
         },
 
-        _onOpen: function (event, params) {
-            var selections = this.grid.getSelected();
-            var firstTab = null;
-            for (var i = 0; i < selections.length; ++i) {
-                var tab = this.ensurePane(selections[i], params);
-                if (i == 0) {
-                    firstTab = tab;
-                }
-            }
-            if (firstTab) {
-                this.selectChild(firstTab);
-            }
+        appendContextMenuItem: function (label, onClick) {
+            return this.appendMenuItem(this.contextMenu, label, onClick);
         },
 
-        _onRowDblClick: function (row) {
-            var tab = this.ensurePane(row);
-            this.selectChild(tab);
+        initContextMenu: function () {
+            var context = this;
+            this.contextMenu = new Menu({
+                targetNodeIds: [this.id + "Grid"]
+            });
+            this.appendContextMenuItem("Refresh", function () {
+                context._onRefresh();
+            });
+            this.contextMenu.addChild(new MenuSeparator());
+            this.appendContextMenuItem("Open", function () {
+                context._onOpen();
+            });
+            if (this.appendContextMenu) {
+                this.appendContextMenu();
+            }
+            this.contextMenu.startup();
         },
 
         initTab: function () {