From 39a484b631d4a53820c60c1c5c388fd33fcf8ddd Mon Sep 17 00:00:00 2001 From: Marco Gaido Date: Wed, 10 Jan 2018 17:00:55 +0100 Subject: [PATCH] NIFI-4764: Add tooltips to status bar icons add tooltip to process groups cleanup This closes #2394 --- nifi-docs/src/main/asciidoc/user-guide.adoc | 8 ++- .../WEB-INF/partials/canvas/flow-status.jsp | 30 +++++----- .../webapp/js/nf/canvas/nf-process-group.js | 60 +++++++++++++++---- 3 files changed, 69 insertions(+), 29 deletions(-) diff --git a/nifi-docs/src/main/asciidoc/user-guide.adoc b/nifi-docs/src/main/asciidoc/user-guide.adoc index e34ed2c64d..1a3877edf0 100644 --- a/nifi-docs/src/main/asciidoc/user-guide.adoc +++ b/nifi-docs/src/main/asciidoc/user-guide.adoc @@ -149,7 +149,13 @@ image::nifi-toolbar-components.png["NiFi Components Toolbar"] The Components Toolbar runs across the top left portion of your screen. It consists of the components you can drag onto the canvas to build your dataflow. Each component is described in more detail in link:building-dataflow.html[Building a Dataflow]. -The Status Bar is under the Components Toolbar. The Status bar provides information about the number of threads that are currently active in the flow, the amount of data that currently exists in the flow, how many Remote Process Groups exist on the canvas in each state (Transmitting, Not Transmitting), how many Processors exist on the canvas in each state (Stopped, Running, Invalid, Disabled), how many versioned Process Groups exist on the canvas in each state (Up to date, Locally modified, Stale, Locally modified and stale, Sync failure) and the timestamp at which all of this information was last refreshed. Additionally, if the instance of NiFi is clustered, the Status bar shows how many nodes are in the cluster and how many are currently connected. +The Status Bar is under the Components Toolbar. The Status bar provides information about the number of threads that are +currently active in the flow, the amount of data that currently exists in the flow, how many Remote Process Groups exist +on the canvas in each state (Transmitting, Not Transmitting), how many Processors exist on the canvas in each state +(Stopped, Running, Invalid, Disabled), how many versioned Process Groups exist on the canvas in each state (Up to date, +Locally modified, Stale, Locally modified and stale, Sync failure) and the timestamp at which all of this information +was last refreshed. Additionally, if the instance of NiFi is clustered, the Status bar shows how many nodes are in the +cluster and how many are currently connected. The Operate Palette sits to the left-hand side of the screen. It consists of buttons that are used by DFMs to manage the flow, as well as by administrators who manage user access diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flow-status.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flow-status.jsp index 9cb0ab9967..5edfe102b6 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flow-status.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flow-status.jsp @@ -17,23 +17,23 @@ <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %>
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.connectedNodesCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.activeThreadCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.totalQueued}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerTransmittingCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerNotTransmittingCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerRunningCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerStoppedCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerInvalidCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerDisabledCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerUpToDateCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerLocallyModifiedCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerStaleCount}}
-
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.connectedNodesCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.activeThreadCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.totalQueued}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerTransmittingCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerNotTransmittingCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerRunningCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerStoppedCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerInvalidCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerDisabledCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerUpToDateCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerLocallyModifiedCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerStaleCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerLocallyModifiedAndStaleCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerSyncFailureCount}}
-
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.statsLastRefreshed}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.controllerSyncFailureCount}}
+
{{appCtrl.serviceProvider.headerCtrl.flowStatusCtrl.statsLastRefreshed}}
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group.js index 50a38182da..dc7034ae9f 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group.js @@ -308,7 +308,10 @@ 'class': 'process-group-transmitting process-group-contents-icon', 'font-family': 'FontAwesome' }) - .text('\uf140'); + .text('\uf140') + .append("title") + .text("Transmitting Remote Process Groups"); + // transmitting count details.append('text') @@ -324,7 +327,9 @@ 'class': 'process-group-not-transmitting process-group-contents-icon', 'font-family': 'flowfont' }) - .text('\ue80a'); + .text('\ue80a') + .append("title") + .text("Not Transmitting Remote Process Groups"); // not transmitting count details.append('text') @@ -340,7 +345,9 @@ 'class': 'process-group-running process-group-contents-icon', 'font-family': 'FontAwesome' }) - .text('\uf04b'); + .text('\uf04b') + .append("title") + .text("Running Components"); // running count details.append('text') @@ -356,7 +363,9 @@ 'class': 'process-group-stopped process-group-contents-icon', 'font-family': 'FontAwesome' }) - .text('\uf04d'); + .text('\uf04d') + .append("title") + .text("Stopped Components"); // stopped count details.append('text') @@ -372,7 +381,9 @@ 'class': 'process-group-invalid process-group-contents-icon', 'font-family': 'FontAwesome' }) - .text('\uf071'); + .text('\uf071') + .append("title") + .text("Invalid Components"); // invalid count details.append('text') @@ -388,7 +399,9 @@ 'class': 'process-group-disabled process-group-contents-icon', 'font-family': 'flowfont' }) - .text('\ue802'); + .text('\ue802') + .append("title") + .text("Disabled Components"); // disabled count details.append('text') @@ -407,7 +420,9 @@ 'class': 'process-group-up-to-date process-group-contents-icon', 'font-family': 'FontAwesome' }) - .text('\uf00c'); + .text('\uf00c') + .append("title") + .text("Up to date Versioned Process Groups"); // up to date count details.append('text') @@ -427,7 +442,9 @@ 'class': 'process-group-locally-modified process-group-contents-icon', 'font-family': 'FontAwesome' }) - .text('\uf069'); + .text('\uf069') + .append("title") + .text("Locally modified Versioned Process Groups"); // locally modified count details.append('text') @@ -447,7 +464,9 @@ 'class': 'process-group-stale process-group-contents-icon', 'font-family': 'FontAwesome' }) - .text('\uf0aa'); + .text('\uf0aa') + .append("title") + .text("Stale Versioned Process Groups"); // stale count details.append('text') @@ -467,7 +486,9 @@ 'class': 'process-group-locally-modified-and-stale process-group-contents-icon', 'font-family': 'FontAwesome' }) - .text('\uf06a'); + .text('\uf06a') + .append("title") + .text("Locally modified and stale Versioned Process Groups"); // locally modified and stale count details.append('text') @@ -487,7 +508,9 @@ 'class': 'process-group-sync-failure process-group-contents-icon', 'font-family': 'FontAwesome' }) - .text('\uf128'); + .text('\uf128') + .append("title") + .text("Sync failure Versioned Process Groups"); // sync failure count details.append('text') @@ -847,6 +870,7 @@ .text(function (d) { return d.activeRemotePortCount; }); + transmittingCount.append("title").text("Transmitting Remote Process Groups"); // update not transmitting var notTransmitting = details.select('text.process-group-not-transmitting') @@ -868,6 +892,7 @@ .text(function (d) { return d.inactiveRemotePortCount; }); + notTransmittingCount.append("title").text("Not transmitting Remote Process Groups") // update running var running = details.select('text.process-group-running') @@ -889,6 +914,7 @@ .text(function (d) { return d.runningCount; }); + runningCount.append("title").text("Running Components"); // update stopped var stopped = details.select('text.process-group-stopped') @@ -910,6 +936,7 @@ .text(function (d) { return d.stoppedCount; }); + stoppedCount.append("title").text("Stopped Components"); // update invalid var invalid = details.select('text.process-group-invalid') @@ -931,6 +958,7 @@ .text(function (d) { return d.invalidCount; }); + invalidCount.append("title").text("Invalid Components"); // update disabled var disabled = details.select('text.process-group-disabled') @@ -944,7 +972,7 @@ var invalidX = parseInt(invalidCount.attr('x'), 10); return invalidX + Math.round(invalidCount.node().getComputedTextLength()) + CONTENTS_SPACER; }); - details.select('text.process-group-disabled-count') + var disabledCount = details.select('text.process-group-disabled-count') .attr('x', function () { var disabledCountX = parseInt(disabled.attr('x'), 10); return disabledCountX + Math.round(disabled.node().getComputedTextLength()) + CONTENTS_VALUE_SPACER; @@ -952,6 +980,7 @@ .text(function (d) { return d.disabledCount; }); + disabledCount.append("title").text("Disabled Components"); // up to date current var upToDate = details.select('text.process-group-up-to-date') @@ -969,6 +998,7 @@ .text(function (d) { return d.upToDateCount; }); + upToDateCount.append("title").text("Up to date Versioned Process Groups"); // update locally modified var locallyModified = details.select('text.process-group-locally-modified') @@ -990,6 +1020,7 @@ .text(function (d) { return d.locallyModifiedCount; }); + locallyModifiedCount.append("title").text("Locally modified Versioned Process Groups"); // update stale var stale = details.select('text.process-group-stale') @@ -1011,6 +1042,7 @@ .text(function (d) { return d.staleCount; }); + staleCount.append("title").text("Stale Versioned Process Groups"); // update locally modified and stale var locallyModifiedAndStale = details.select('text.process-group-locally-modified-and-stale') @@ -1032,6 +1064,7 @@ .text(function (d) { return d.locallyModifiedAndStaleCount; }); + locallyModifiedAndStaleCount.append("title").text("Locally modified and stale Versioned Process Groups"); // update sync failure var syncFailure = details.select('text.process-group-sync-failure') @@ -1045,7 +1078,7 @@ var syncFailureX = parseInt(locallyModifiedAndStaleCount.attr('x'), 10); return syncFailureX + Math.round(locallyModifiedAndStaleCount.node().getComputedTextLength()) + CONTENTS_SPACER - 2; }); - details.select('text.process-group-sync-failure-count') + var syncFailureCount = details.select('text.process-group-sync-failure-count') .attr('x', function () { var syncFailureCountX = parseInt(syncFailure.attr('x'), 10); return syncFailureCountX + Math.round(syncFailure.node().getComputedTextLength()) + CONTENTS_VALUE_SPACER; @@ -1053,6 +1086,7 @@ .text(function (d) { return d.syncFailureCount; }); + syncFailureCount.append("title").text("Sync failure Versioned Process Groups"); // update version control information var versionControl = processGroup.select('text.version-control')