diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-framework-core/src/main/java/org/apache/nifi/remote/StandardRemoteProcessGroup.java b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-framework-core/src/main/java/org/apache/nifi/remote/StandardRemoteProcessGroup.java index c6bf2fc769..d04c393b8a 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-framework-core/src/main/java/org/apache/nifi/remote/StandardRemoteProcessGroup.java +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-framework-core/src/main/java/org/apache/nifi/remote/StandardRemoteProcessGroup.java @@ -439,6 +439,7 @@ public class StandardRemoteProcessGroup implements RemoteProcessGroup { if (!newPortIds.contains(entry.getKey())) { final StandardRemoteGroupPort port = entry.getValue(); port.setTargetExists(false); + port.setTargetRunning(false); // If port has incoming connection, it will be cleaned up when the connection is removed if (!port.hasIncomingConnection()) { @@ -509,6 +510,7 @@ public class StandardRemoteProcessGroup implements RemoteProcessGroup { if (!newPortIds.contains(entry.getKey())) { final StandardRemoteGroupPort port = entry.getValue(); port.setTargetExists(false); + port.setTargetRunning(false); // If port has connections, it will be cleaned up when connections are removed if (port.getConnections().isEmpty()) { diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/common-ui.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/common-ui.css index 011fa4bf35..0466df5b7a 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/common-ui.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/common-ui.css @@ -523,26 +523,6 @@ div.context-menu-item.hover { left: 2px; } -div.context-menu-item.hover > div.context-menu-item-img.fa.fa-play { - color:#5cb85c; -} - -.running { - color:#5cb85c; -} - -div.context-menu-item.hover > div.context-menu-item-img.fa.fa-stop { - color:#d9534f; -} - -.stopped { - color:#d9534f !important; -} - -.invalid { - color:#f0ad4e !important; -} - .context-menu-item-img.icon { position: relative; top: 1px; diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css index ceecb8b551..c654784661 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css @@ -38,22 +38,11 @@ color: #728E9B; /*base-color*/ } -#flow-status .fa.fa-play { - color: #5cb85c; -} - -#flow-status .fa.fa-stop { - color: #d9534f; -} - -#flow-status .fa.fa-warning { - color: #f0ad4e; -} - #flow-status .icon span { font-size: 15px; font-weight: 500; color: #775351; /*value-color*/ + text-shadow: none; } #flow-status .fa span { @@ -61,6 +50,7 @@ font-weight: 500; color: #775351; /*value-color*/ font-family: Roboto, sans-serif; + text-shadow: none; } #flow-status button { @@ -98,6 +88,7 @@ #search-button .fa { color: #004849; + text-shadow: none; } #bulletin-button { @@ -106,12 +97,13 @@ } #bulletin-button.has-bulletins { - background-color: #f0ad4e; /*warm-color*/ + background-color: #ba554a; /*warm-color*/ } #bulletin-button i.fa { color: #fff; font-size: 15px; + text-shadow: none; } #canvas-loading-container { @@ -124,7 +116,7 @@ } #connected-nodes-count.connection-warning { - color: #f0ad4e; + color: #BA554A; } /* search field */ diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css index 67ad5bf9f1..e965bf28d3 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css @@ -114,19 +114,7 @@ text.bulletin-icon { } rect.bulletin-background { - fill: #f0ad4e; -} - -text.process-group-invalid.has-validation-errors { - fill: #f0ad4e; -} - -text.process-group-stopped.process-group-contents-icon { - fill: #d9534f; -} - -text.process-group-running.process-group-contents-icon{ - fill: #5cb85c; + fill: #ba554a; } text.active-thread-count-icon { @@ -209,7 +197,7 @@ g.connection rect.body.unauthorized { g.connection rect.border.unauthorized { stroke-width: 1.5; - stroke: #f0ad4e; + stroke: #ba554a; stroke-dasharray: 3,3; } @@ -251,7 +239,7 @@ g.connection path.connection-path.full { } g.connection path.connection-path.unauthorized { - stroke: #f0ad4e; + stroke: #ba554a; stroke-dasharray: 3,3; } @@ -259,10 +247,11 @@ text.connection-from-run-status, text.connection-to-run-status, text.expiration- fill: #728e9b; font-family: FontAwesome; font-size: 10px; + text-shadow: 0 0 4px rgba(255,255,255,1); } text.connection-from-run-status.is-missing-port, text.connection-to-run-status.is-missing-port { - fill: #f0ad4e; + fill: #cf9f5d; } g.connection rect.backpressure-tick { @@ -387,7 +376,7 @@ text.port-icon { } text.port-transmission-icon { - font-size: 11px; + font-size: 15px; fill: #728e9b } @@ -405,9 +394,10 @@ text.process-group-name { } text.process-group-contents-count { - font-weight: bold; - font-size: 13px; - fill: #294c58; + fill: #775351; + font-size: 15px; + font-weight: 500; + font-family: Roboto, sans-serif; } g.process-group.drop rect.border { @@ -416,7 +406,7 @@ g.process-group.drop rect.border { } text.process-group-contents-icon { - font-size: 13px; + font-size: 15px; fill: #728e9b; } @@ -433,14 +423,10 @@ text.remote-process-group-uri { } text.remote-process-group-transmission-status { - font-size: 13px; + font-size: 15px; fill: #728e9b } -text.remote-process-group-transmission-status.has-authorization-errors { - fill: #f0ad4e; -} - text.remote-process-group-transmission-secure { font-family: FontAwesome; font-size: 13px; diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css index 31f926001d..95342bf91f 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css @@ -110,7 +110,7 @@ md-toolbar.md-small .md-toolbar-tools { } #global-menu-content a.disabled { - color: #a8a8a8; + color: #a8a8a8 !important; cursor: not-allowed; } diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css index 9ef82beabb..14af7ff61f 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css @@ -84,42 +84,73 @@ div.context-menu-provenance { /* processor status styles */ -div.disabled { +.disabled { float: left; + color: #728e9b !important; + fill: #728e9b !important; + text-shadow: 0 0 4px rgba(255,255,255,1); } -div.enabled { +.enabled { float: left; + color: #44a3cf !important; + fill: #44a3cf !important; margin-left: 3px; margin-right: -3px; + text-shadow: 0 0 4px rgba(255,255,255,1); } -div.stopped { +.stopped { float: left; + color: #d18686 !important; + fill: #d18686 !important; + text-shadow: 0 0 4px rgba(255,255,255,1); } -div.running { +.stopped:before { + content: "\f04d"; + font-family: FontAwesome; +} + +.running { float: left; + color: #7dc7a0 !important; + fill: #7dc7a0 !important; + text-shadow: 0 0 4px rgba(255,255,255,1); } -div.has-errors, div.invalid { +.running:before { + content: "\f04b"; + font-family: FontAwesome; +} + +.has-errors, .invalid { float: left; - color: #f0ad4e !important; + color: #cf9f5d !important; + fill: #cf9f5d !important; + text-shadow: 0 0 4px rgba(255,255,255,1); } -div.has-errors:before, div.invalid:before { +.has-errors:before, .invalid:before { font-family: FontAwesome; content: "\f071"; - color: #f0ad4e; + color: #cf9f5d; + text-shadow: 0 0 4px rgba(255,255,255,1); } -div.transmitting { +.transmitting { float: left; + color: #44a3cf !important; + fill: #44a3cf !important; + text-shadow: 0 0 4px rgba(255,255,255,1); } -div.not-transmitting { +.not-transmitting { float: left; + color: #728e9b !important; + fill: #728e9b !important; margin-top: 0px !important; + text-shadow: 0 0 4px rgba(255,255,255,1); } div.valid { @@ -128,7 +159,13 @@ div.valid { } div.has-bulletins { - color: #f0ad4e !important; + color: #ba554a !important; +} + +.zero { + color: #aabec7 !important; + fill: #aabec7 !important; + text-shadow: none !important; } /* @@ -233,7 +270,7 @@ span.details-title { font-weight: bold; font-family: Roboto; font-size: 13px; - color: #f0ad4e; + color: #ba554a; } #upload-template-container button { diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css index e986a9bea8..2439d229e1 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css @@ -213,14 +213,6 @@ div.action-button { text-transform:uppercase; } -#operate-start button:hover { - color:#5cb85c; -} - -#operate-stop button:hover { - color:#d9534f; -} - div.graph-control div.icon-disabled { color: #ddd; } diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-configuration.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-configuration.css index b8b6bcffb5..298f261956 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-configuration.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-configuration.css @@ -75,7 +75,6 @@ div.processor-configuration-warning-icon:before { font-family: FontAwesome; content: "\f071"; font-size: 16px; - color: #f0ad4e; } #auto-terminate-relationship-names { diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css index c8e26ae6f6..d787c4b081 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css @@ -466,11 +466,11 @@ div.lineage-collapse-children:before { } path.link.selected { - stroke: #f0ad4e; + stroke: #ba554a; } g.event circle.selected { - fill: #f0ad4e; + fill: #ba554a; } text.event-type { diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/queue-listing.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/queue-listing.css index 0c45c42d45..92d9997a59 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/queue-listing.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/queue-listing.css @@ -75,7 +75,7 @@ #queue-listing-message { position: absolute; top: 36px; - color: #f0ad4e; + color: #ba554a; font-family: Roboto; font-size: 13px; font-weight: 500; diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/remote-process-group-configuration.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/remote-process-group-configuration.css index 44d24a3337..847bdb7605 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/remote-process-group-configuration.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/remote-process-group-configuration.css @@ -100,7 +100,7 @@ div.remote-port-removed:before { font-family: FontAwesome; content: "\f071"; font-size: 16px; - color: #f0ad4e; + color: #ba554a; } div.remote-port-edit-container { diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/slickgrid/css/slick-default-theme.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/slickgrid/css/slick-default-theme.css index 1b8503d4af..780d0d30ca 100755 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/slickgrid/css/slick-default-theme.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/slickgrid/css/slick-default-theme.css @@ -77,7 +77,7 @@ classes should alter those! } .slick-cell.invalid { - border-color: #f0ad4e; + border-color: #ba554a; -moz-animation-duration: 0.2s; -webkit-animation-duration: 0.2s; -moz-animation-name: slickgrid-invalid-hilite; diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-flow-status-controller.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-flow-status-controller.js index 7155e86943..9d218f5ff4 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-flow-status-controller.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-flow-status-controller.js @@ -360,14 +360,14 @@ nf.ng.Canvas.FlowStatusCtrl = function (serviceProvider) { var connectedNodes = clusterSummary.connectedNodes.split(' / '); if (connectedNodes.length === 2 && connectedNodes[0] !== connectedNodes[1]) { this.clusterConnectionWarning = true; - color = '#f0ad4e'; + color = '#BA554A'; } } this.connectedNodesCount = nf.Common.isDefinedAndNotNull(clusterSummary.connectedNodes) ? clusterSummary.connectedNodes : '-'; } else { this.connectedNodesCount = 'Disconnected'; - color = '#f0ad4e'; + color = '#BA554A'; } // update the color @@ -380,36 +380,88 @@ nf.ng.Canvas.FlowStatusCtrl = function (serviceProvider) { * @param status The controller status returned from the `../nifi-api/flow/status` endpoint. */ update: function (status) { - var controllerInvalidCountColor = - (nf.Common.isDefinedAndNotNull(status.invalidCount) && (status.invalidCount > 0)) ? - '#f0ad4e' : '#728E9B'; - $('#controller-invalid-count').parent().css('color', controllerInvalidCountColor); + var controllerInvalidCount = (nf.Common.isDefinedAndNotNull(status.invalidCount)) ? status.invalidCount : 0; + + if (this.controllerInvalidCount > 0) { + $('#controller-invalid-count').parent().removeClass('zero').addClass('invalid'); + } else { + $('#controller-invalid-count').parent().removeClass('invalid').addClass('zero'); + } // update the report values this.activeThreadCount = status.activeThreadCount; + + if (this.activeThreadCount > 0) { + $('#flow-status-container').find('.icon-threads').removeClass('zero'); + } else { + $('#flow-status-container').find('.icon-threads').addClass('zero'); + } + this.totalQueued = status.queued; + if (this.totalQueued.indexOf('0 / 0') >= 0) { + $('#flow-status-container').find('.fa-list').addClass('zero'); + } else { + $('#flow-status-container').find('.fa-list').removeClass('zero'); + } + // update the component counts this.controllerTransmittingCount = nf.Common.isDefinedAndNotNull(status.activeRemotePortCount) ? status.activeRemotePortCount : '-'; + if (this.controllerTransmittingCount > 0) { + $('#flow-status-container').find('.fa-bullseye').removeClass('zero').addClass('transmitting'); + } else { + $('#flow-status-container').find('.fa-bullseye').removeClass('transmitting').addClass('zero'); + } + this.controllerNotTransmittingCount = nf.Common.isDefinedAndNotNull(status.inactiveRemotePortCount) ? status.inactiveRemotePortCount : '-'; + if (this.controllerNotTransmittingCount > 0) { + $('#flow-status-container').find('.icon-transmit-false').removeClass('zero').addClass('not-transmitting'); + } else { + $('#flow-status-container').find('.icon-transmit-false').removeClass('not-transmitting').addClass('zero'); + } + this.controllerRunningCount = nf.Common.isDefinedAndNotNull(status.runningCount) ? status.runningCount : '-'; + if (this.controllerRunningCount > 0) { + $('#flow-status-container').find('.fa-play').removeClass('zero').addClass('running'); + } else { + $('#flow-status-container').find('.fa-play').removeClass('running').addClass('zero'); + } + this.controllerStoppedCount = nf.Common.isDefinedAndNotNull(status.stoppedCount) ? status.stoppedCount : '-'; + if (this.controllerStoppedCount > 0) { + $('#flow-status-container').find('.fa-stop').removeClass('zero').addClass('stopped'); + } else { + $('#flow-status-container').find('.fa-stop').removeClass('stopped').addClass('zero'); + } + this.controllerInvalidCount = nf.Common.isDefinedAndNotNull(status.invalidCount) ? status.invalidCount : '-'; + if (this.controllerInvalidCount > 0) { + $('#flow-status-container').find('.fa-warning').removeClass('zero').addClass('invalid'); + } else { + $('#flow-status-container').find('.fa-warning').removeClass('invalid').addClass('zero'); + } + this.controllerDisabledCount = nf.Common.isDefinedAndNotNull(status.disabledCount) ? status.disabledCount : '-'; + if (this.controllerDisabledCount > 0) { + $('#flow-status-container').find('.icon-enable-false').removeClass('zero').addClass('disabled'); + } else { + $('#flow-status-container').find('.icon-enable-false').removeClass('disabled').addClass('zero'); + } + }, /** diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection.js index 1bd6fbc613..081c9dd163 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection.js @@ -862,6 +862,20 @@ nf.Connection = (function () { return '\uf04d'; } }) + .classed('running', function () { + if (d.component.source.exists === true) { + return d.component.source.running; + } else { + return false; + } + }) + .classed('stopped', function () { + if (d.component.source.exists === true) { + return !d.component.source.running; + } else { + return false; + } + }) .classed('is-missing-port', function () { return d.component.source.exists === false; }); @@ -957,6 +971,20 @@ nf.Connection = (function () { return '\uf04d'; } }) + .classed('running', function () { + if (d.component.destination.running === true) { + return d.component.destination.running; + } else { + return false; + } + }) + .classed('stopped', function () { + if (d.component.destination.running !== true) { + return !d.component.destination.running; + } else { + return false; + } + }) .classed('is-missing-port', function () { return d.component.destination.exists === false; }); diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port.js index 358115d2dd..d7530732b4 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port.js @@ -213,7 +213,7 @@ nf.Port = (function () { .attr({ 'class': 'port-transmission-icon', 'x': 10, - 'y': 15 + 'y': 18 }); // bulletin background @@ -342,11 +342,11 @@ nf.Port = (function () { var fill = '#728e9b'; if (d.status.aggregateSnapshot.runStatus === 'Invalid') { - fill = '#f0ad4e'; + fill = '#cf9f5d'; } else if (d.status.aggregateSnapshot.runStatus === 'Running') { - fill = '#5cb85c'; + fill = '#7dc7a0'; } else if (d.status.aggregateSnapshot.runStatus === 'Stopped') { - fill = '#d9534f'; + fill = '#d18686'; } return fill; @@ -423,6 +423,20 @@ nf.Port = (function () { } else { return '\ue80a'; } + }) + .classed('transmitting', function (d) { + if (d.status.aggregateSnapshot.transmitting === true) { + return true; + } else { + return false; + } + }) + .classed('not-transmitting', function (d) { + if (d.status.aggregateSnapshot.transmitting !== true) { + return true; + } else { + return false; + } }); updated.each(function (d) { 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 89c1c855cd..9618c339ad 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 @@ -192,6 +192,7 @@ nf.ProcessGroup = (function () { // attempt of space between component count and icon for process group contents var CONTENTS_SPACER = 10; + var CONTENTS_VALUE_SPACER = 5; /** * Updates the process groups in the specified selection. @@ -259,7 +260,6 @@ nf.ProcessGroup = (function () { // transmitting count details.append('text') .attr({ - 'x': 28, 'y': 49, 'class': 'process-group-transmitting-count process-group-contents-count' }); @@ -561,7 +561,7 @@ nf.ProcessGroup = (function () { 'y': 60, 'class': 'process-group-out stats-value' }); - + // out ports outText.append('tspan') .attr({ @@ -681,21 +681,38 @@ nf.ProcessGroup = (function () { } // update transmitting + var transmitting = details.select('text.process-group-transmitting') + .classed('transmitting', function (d) { + return d.permissions.canRead && d.activeRemotePortCount > 0; + }) + .classed('zero', function (d) { + return d.permissions.canRead && d.activeRemotePortCount === 0; + }); var transmittingCount = details.select('text.process-group-transmitting-count') + .attr('x', function () { + var transmittingCountX = parseInt(transmitting.attr('x'), 10); + return transmittingCountX + Math.round(transmitting.node().getComputedTextLength()) + CONTENTS_VALUE_SPACER; + }) .text(function (d) { return d.activeRemotePortCount; }); // update not transmitting var notTransmitting = details.select('text.process-group-not-transmitting') + .classed('not-transmitting', function (d) { + return d.permissions.canRead && d.inactiveRemotePortCount > 0; + }) + .classed('zero', function (d) { + return d.permissions.canRead && d.inactiveRemotePortCount === 0; + }) .attr('x', function () { var transmittingX = parseInt(transmittingCount.attr('x'), 10); - return transmittingX + transmittingCount.node().getComputedTextLength() + CONTENTS_SPACER; + return transmittingX + Math.round(transmittingCount.node().getComputedTextLength()) + CONTENTS_SPACER; }); var notTransmittingCount = details.select('text.process-group-not-transmitting-count') .attr('x', function () { var notTransmittingCountX = parseInt(notTransmitting.attr('x'), 10); - return notTransmittingCountX + notTransmitting.node().getComputedTextLength() + CONTENTS_SPACER; + return notTransmittingCountX + Math.round(notTransmitting.node().getComputedTextLength()) + CONTENTS_VALUE_SPACER; }) .text(function (d) { return d.inactiveRemotePortCount; @@ -703,14 +720,20 @@ nf.ProcessGroup = (function () { // update running var running = details.select('text.process-group-running') + .classed('running', function (d) { + return d.permissions.canRead && d.component.runningCount > 0; + }) + .classed('zero', function (d) { + return d.permissions.canRead && d.component.runningCount === 0; + }) .attr('x', function () { var notTransmittingX = parseInt(notTransmittingCount.attr('x'), 10); - return notTransmittingX + notTransmittingCount.node().getComputedTextLength() + CONTENTS_SPACER; + return notTransmittingX + Math.round(notTransmittingCount.node().getComputedTextLength()) + CONTENTS_SPACER; }); var runningCount = details.select('text.process-group-running-count') .attr('x', function () { var runningCountX = parseInt(running.attr('x'), 10); - return runningCountX + running.node().getComputedTextLength() + CONTENTS_SPACER; + return runningCountX + Math.round(running.node().getComputedTextLength()) + CONTENTS_VALUE_SPACER; }) .text(function (d) { return d.runningCount; @@ -718,14 +741,20 @@ nf.ProcessGroup = (function () { // update stopped var stopped = details.select('text.process-group-stopped') + .classed('stopped', function (d) { + return d.permissions.canRead && d.component.stoppedCount > 0; + }) + .classed('zero', function (d) { + return d.permissions.canRead && d.component.stoppedCount === 0; + }) .attr('x', function () { var runningX = parseInt(runningCount.attr('x'), 10); - return runningX + runningCount.node().getComputedTextLength() + CONTENTS_SPACER; + return runningX + Math.round(runningCount.node().getComputedTextLength()) + CONTENTS_SPACER; }); var stoppedCount = details.select('text.process-group-stopped-count') .attr('x', function () { var stoppedCountX = parseInt(stopped.attr('x'), 10); - return stoppedCountX + stopped.node().getComputedTextLength() + CONTENTS_SPACER; + return stoppedCountX + Math.round(stopped.node().getComputedTextLength()) + CONTENTS_VALUE_SPACER; }) .text(function (d) { return d.stoppedCount; @@ -733,17 +762,20 @@ nf.ProcessGroup = (function () { // update invalid var invalid = details.select('text.process-group-invalid') + .classed('invalid', function (d) { + return d.permissions.canRead && d.component.invalidCount > 0; + }) + .classed('zero', function (d) { + return d.permissions.canRead && d.component.invalidCount === 0; + }) .attr('x', function () { var stoppedX = parseInt(stoppedCount.attr('x'), 10); - return stoppedX + stoppedCount.node().getComputedTextLength() + CONTENTS_SPACER; - }) - .classed('has-validation-errors', function (d) { - return d.permissions.canRead && d.component.invalidCount > 0; + return stoppedX + Math.round(stoppedCount.node().getComputedTextLength()) + CONTENTS_SPACER; }); var invalidCount = details.select('text.process-group-invalid-count') .attr('x', function () { var invalidCountX = parseInt(invalid.attr('x'), 10); - return invalidCountX + invalid.node().getComputedTextLength() + CONTENTS_SPACER; + return invalidCountX + Math.round(invalid.node().getComputedTextLength()) + CONTENTS_VALUE_SPACER; }) .text(function (d) { return d.invalidCount; @@ -751,14 +783,20 @@ nf.ProcessGroup = (function () { // update disabled var disabled = details.select('text.process-group-disabled') + .classed('disabled', function (d) { + return d.permissions.canRead && d.component.disabledCount > 0; + }) + .classed('zero', function (d) { + return d.permissions.canRead && d.component.disabledCount === 0; + }) .attr('x', function () { var invalidX = parseInt(invalidCount.attr('x'), 10); - return invalidX + invalidCount.node().getComputedTextLength() + CONTENTS_SPACER; + return invalidX + Math.round(invalidCount.node().getComputedTextLength()) + CONTENTS_SPACER; }); details.select('text.process-group-disabled-count') .attr('x', function () { var disabledCountX = parseInt(disabled.attr('x'), 10); - return disabledCountX + disabled.node().getComputedTextLength() + CONTENTS_SPACER; + return disabledCountX + Math.round(disabled.node().getComputedTextLength()) + CONTENTS_VALUE_SPACER; }) .text(function (d) { return d.disabledCount; @@ -797,7 +835,7 @@ nf.ProcessGroup = (function () { } else { // clear the process group comments details.select('text.process-group-comments').text(null); - + // clear the process group name processGroup.select('text.process-group-name').text(null); } @@ -883,7 +921,7 @@ nf.ProcessGroup = (function () { .text(function (d) { return d.outputPortCount + ' ' + String.fromCharCode(8594) + ' '; }); - + // out count value updated.select('text.process-group-out tspan.count') .text(function (d) { @@ -1003,7 +1041,7 @@ nf.ProcessGroup = (function () { selection.enter().call(renderProcessGroups, selectAll); selection.call(updateProcessGroups); }, - + /** * Populates the graph with the specified process groups. * diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor.js index 5cd1da384d..9a5506a252 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor.js @@ -623,11 +623,11 @@ nf.Processor = (function () { var fill = '#728e9b'; if (d.status.aggregateSnapshot.runStatus === 'Invalid') { - fill = '#f0ad4e'; + fill = '#cf9f5d'; } else if (d.status.aggregateSnapshot.runStatus === 'Running') { - fill = '#5cb85c'; + fill = '#7dc7a0'; } else if (d.status.aggregateSnapshot.runStatus === 'Stopped') { - fill = '#d9534f'; + fill = '#d18686'; } return fill; diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group.js index 9d429c77a1..6b10fa25d9 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group.js @@ -711,9 +711,23 @@ nf.RemoteProcessGroup = (function () { } return family; }) - .classed('has-authorization-errors', function (d) { + .classed('invalid', function (d) { return d.permissions.canRead && !nf.Common.isEmpty(d.component.authorizationIssues); }) + .classed('transmitting', function (d) { + if (d.component.transmitting === true) { + return true; + } else { + return false; + } + }) + .classed('not-transmitting', function (d) { + if (d.component.transmitting !== true) { + return true; + } else { + return false; + } + }) .each(function (d) { // get the tip var tip = d3.select('#authorization-issues-' + d.id); diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-settings.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-settings.js index 863dd200d9..c5c4da50db 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-settings.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-settings.js @@ -622,13 +622,13 @@ nf.Settings = (function () { } else { if (dataContext.component.state === 'STOPPED') { label = 'Stopped'; - icon = 'fa fa-stop'; + icon = 'fa fa-stop stopped'; } else if (dataContext.component.state === 'RUNNING') { label = 'Running'; - icon = 'fa fa-play'; + icon = 'fa fa-play running'; } else { label = 'Disabled'; - icon = 'icon icon-enable-false'; + icon = 'icon icon-enable-false disabled'; } } diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-ng-app-config.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-ng-app-config.js index effc909b59..54dccde026 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-ng-app-config.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-ng-app-config.js @@ -61,20 +61,20 @@ nf.ng.AppConfig = function ($mdThemingProvider, $compileProvider) { 'contrastLightColors': undefined }); $mdThemingProvider.definePalette('warnPalette', { - '50': 'f0ad4e', - '100': 'f0ad4e', - '200': 'f0ad4e', - '300': 'f0ad4e', - '400': 'f0ad4e', - '500': '2B5C76', /* warn-color */ - '600': 'f0ad4e', - '700': 'f0ad4e', - '800': 'f0ad4e', - '900': 'f0ad4e', - 'A100': 'f0ad4e', - 'A200': 'f0ad4e', - 'A400': 'f0ad4e', - 'A700': 'f0ad4e', + '50': 'BA554A', + '100': 'BA554A', + '200': 'BA554A', + '300': 'BA554A', + '400': 'BA554A', + '500': 'BA554A', /* warn-color */ + '600': 'BA554A', + '700': 'BA554A', + '800': 'BA554A', + '900': 'BA554A', + 'A100': 'BA554A', + 'A200': 'BA554A', + 'A400': 'BA554A', + 'A700': 'BA554A', 'contrastDefaultColor': 'light', 'contrastDarkColors': ['A100'], 'contrastLightColors': undefined diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-lineage.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-lineage.js index b6da60bf58..4e15cd21fa 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-lineage.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-lineage.js @@ -608,7 +608,7 @@ nf.ng.ProvenanceLineage = function () { 'orient': 'auto', 'fill': function (d) { if (d.indexOf('SELECTED') >= 0) { - return '#f0ad4e'; + return '#ba554a'; } else { return '#000000'; } diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/summary/nf-summary-table.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/summary/nf-summary-table.js index 72bd4e6159..eb4dac6e29 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/summary/nf-summary-table.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/summary/nf-summary-table.js @@ -266,19 +266,19 @@ nf.SummaryTable = (function () { var classes = nf.Common.escapeHtml(value.toLowerCase()); switch(nf.Common.escapeHtml(value.toLowerCase())) { case 'running': - classes = ' fa fa-play running'; + classes += ' fa fa-play running'; break; case 'stopped': - classes = ' fa fa-stop stopped'; + classes += ' fa fa-stop stopped'; break; case 'enabled': - classes += ' fa fa-flash'; + classes += ' fa fa-flash enabled'; break; case 'disabled': - classes += ' icon icon-enable-false'; + classes += ' icon icon-enable-false disabled'; break; case 'invalid': - classes = ' fa fa-warning invalid'; + classes += ' fa fa-warning invalid'; break; default: classes += '';