[
https://issues.apache.org/jira/browse/NIFI-2795?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=15511233#comment-15511233
]
ASF GitHub Bot commented on NIFI-2795:
--------------------------------------
Github user jvwing commented on a diff in the pull request:
https://github.com/apache/nifi/pull/1042#discussion_r79936555
--- Diff:
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster-table.js
---
@@ -377,190 +952,45 @@ nf.ClusterTable = (function () {
nf.ClusterTable.resetTableSize();
});
- // define a custom formatter for the more details column
- var moreDetailsFormatter = function (row, cell, value,
columnDef, dataContext) {
- return '<div title="View Details" class="pointer
show-node-details fa fa-info-circle" style="margin-top: 2px;"></div>';
- };
-
- // define a custom formatter for the run status column
- var nodeFormatter = function (row, cell, value, columnDef,
dataContext) {
- return formatNodeAddress(dataContext);
- };
-
- // function for formatting the last accessed time
- var valueFormatter = function (row, cell, value, columnDef,
dataContext) {
- return nf.Common.formatValue(value);
- };
-
- // define a custom formatter for the status column
- var statusFormatter = function (row, cell, value, columnDef,
dataContext) {
- var markup = value;
- if (dataContext.roles.includes(config.primaryNode)) {
- value += ', PRIMARY';
- }
- if (dataContext.roles.includes(config.clusterCoorindator))
{
- value += ', COORDINATOR';
- }
- return value;
- };
-
- var columnModel = [
- {id: 'moreDetails', name: ' ', sortable: false,
resizable: false, formatter: moreDetailsFormatter, width: 50, maxWidth: 50},
- {id: 'node', field: 'node', name: 'Node Address',
formatter: nodeFormatter, resizable: true, sortable: true},
- {id: 'activeThreadCount', field: 'activeThreadCount',
name: 'Active Thread Count', resizable: true, sortable: true, defaultSortAsc:
false},
- {id: 'queued', field: 'queued', name: '<span
class="queued-title">Queue</span> / <span
class="queued-size-title">Size</span>', resizable: true, sortable: true,
defaultSortAsc: false},
- {id: 'status', field: 'status', name: 'Status', formatter:
statusFormatter, resizable: true, sortable: true},
- {id: 'uptime', field: 'nodeStartTime', name: 'Uptime',
formatter: valueFormatter, resizable: true, sortable: true, defaultSortAsc:
false},
- {id: 'heartbeat', field: 'heartbeat', name: 'Last
Heartbeat', formatter: valueFormatter, resizable: true, sortable: true,
defaultSortAsc: false}
- ];
-
- // only allow the admin to modify the cluster
- if (nf.Common.canModifyController()) {
- // function for formatting the actions column
- var actionFormatter = function (row, cell, value,
columnDef, dataContext) {
- var canDisconnect = false;
- var canConnect = false;
-
- // determine the current status
- if (dataContext.status === 'CONNECTED' ||
dataContext.status === 'CONNECTING') {
- canDisconnect = true;
- } else if (dataContext.status === 'DISCONNECTED') {
- canConnect = true;
- }
-
- // return the appropriate markup
- if (canConnect) {
- return '<div title="Connect" class="pointer
prompt-for-connect fa fa-plug" style="margin-top: 2px;"></div> <div
title="Delete" class="pointer prompt-for-removal fa fa-trash"
style="margin-top: 2px;"></div>';
- } else if (canDisconnect) {
- return '<div title="Disconnect" class="pointer
prompt-for-disconnect fa fa-power-off" style="margin-top: 2px;"></div>';
- } else {
- return '<div style="width: 16px; height:
16px;"> </div>';
- }
- };
-
- columnModel.push({id: 'actions', label: ' ',
formatter: actionFormatter, resizable: false, sortable: false, width: 80,
maxWidth: 80});
- }
-
- var clusterOptions = {
- forceFitColumns: true,
- enableTextSelectionOnCells: true,
- enableCellNavigation: false,
- enableColumnReorder: false,
- autoEdit: false,
- rowHeight: 24
- };
-
- // initialize the dataview
- var clusterData = new Slick.Data.DataView({
- inlineFilters: false
- });
- clusterData.setItems([], 'nodeId');
- clusterData.setFilterArgs({
- searchString: getFilterText(),
- property:
$('#cluster-filter-type').combo('getSelectedOption').value
- });
- clusterData.setFilter(filter);
-
- // initialize the sort
- sort({
- columnId: 'node',
- sortAsc: true
- }, clusterData);
-
- // initialize the grid
- var clusterGrid = new Slick.Grid('#cluster-table',
clusterData, columnModel, clusterOptions);
- clusterGrid.setSelectionModel(new Slick.RowSelectionModel());
- clusterGrid.setSortColumn('node', true);
- clusterGrid.onSort.subscribe(function (e, args) {
- sort({
- columnId: args.sortCol.id,
- sortAsc: args.sortAsc
- }, clusterData);
- });
-
- // configure a click listener
- clusterGrid.onClick.subscribe(function (e, args) {
- var target = $(e.target);
-
- // get the node at this row
- var item = clusterData.getItem(args.row);
-
- // determine the desired action
- if (clusterGrid.getColumns()[args.cell].id === 'actions') {
- if (target.hasClass('prompt-for-connect')) {
- promptForConnect(item);
- } else if (target.hasClass('prompt-for-removal')) {
- promptForRemoval(item);
- } else if (target.hasClass('prompt-for-disconnect')) {
- promptForDisconnect(item);
- }
- } else if (clusterGrid.getColumns()[args.cell].id ===
'moreDetails') {
- if (target.hasClass('show-node-details')) {
- showNodeDetails(item);
- }
+ // initialize tabs
+ clusterTabs.forEach(function (tab) {
+ try {
+ tab.init(tab);
+ } catch (ex) {
+ console.error('Failed to initialize tab', tab, ex);
}
});
-
- // wire up the dataview to the grid
- clusterData.onRowCountChanged.subscribe(function (e, args) {
- clusterGrid.updateRowCount();
- clusterGrid.render();
-
- // update the total number of displayed processors
- $('#displayed-nodes').text(args.current);
- });
- clusterData.onRowsChanged.subscribe(function (e, args) {
- clusterGrid.invalidateRows(args.rows);
- clusterGrid.render();
- });
-
- // hold onto an instance of the grid
- $('#cluster-table').data('gridInstance', clusterGrid);
-
- // initialize the number of displayed items
- $('#displayed-nodes').text('0');
},
/**
* Update the size of the grid based on its container's current
size.
*/
resetTableSize: function () {
- var clusterGrid = $('#cluster-table').data('gridInstance');
- if (nf.Common.isDefinedAndNotNull(clusterGrid)) {
- clusterGrid.resizeCanvas();
- }
+ clusterTabs.forEach(function (tab) {
+ try {
+ if (tab.grid) {
+ tab.grid.resizeCanvas();
+ }
+ } catch (ex) {
+ console.error("Failed to resize tab", tab, ex);
--- End diff --
There is no good reason for it to fail, I'll change this.
> Enhance Cluster UI with System Diagnostics
> ------------------------------------------
>
> Key: NIFI-2795
> URL: https://issues.apache.org/jira/browse/NIFI-2795
> Project: Apache NiFi
> Issue Type: New Feature
> Components: Core UI
> Affects Versions: 1.0.0
> Reporter: James Wing
> Assignee: James Wing
> Priority: Minor
> Attachments: cluster-01-nodes.png, cluster-02-system.png,
> cluster-03-jvm.png, cluster-04-flowfile-store.png,
> cluster-05-content-store.png
>
>
> The Cluster UI currently provides some basic information on each node in the
> cluster and options for connecting and disconnecting nodes. I propose to add
> system diagnostics information in tables, contained in multiple tabs.
> Roughly, the tabs should cover the same content as the System Diagnostics
> dialog already in the System UI, but in a tabular format for comparing across
> nodes.
--
This message was sent by Atlassian JIRA
(v6.3.4#6332)
