NIFI-3906 Added formatting to tables. Signed-off-by: Andy LoPresto <[email protected]>
Project: http://git-wip-us.apache.org/repos/asf/nifi/repo Commit: http://git-wip-us.apache.org/repos/asf/nifi/commit/75bcd359 Tree: http://git-wip-us.apache.org/repos/asf/nifi/tree/75bcd359 Diff: http://git-wip-us.apache.org/repos/asf/nifi/diff/75bcd359 Branch: refs/heads/0.x Commit: 75bcd359660e041e0d778a1b55cb45a34187d3a1 Parents: 4754ee7 Author: Scott Aslan <[email protected]> Authored: Tue May 16 14:27:40 2017 -0700 Committer: Andy LoPresto <[email protected]> Committed: Tue May 16 14:27:48 2017 -0700 ---------------------------------------------------------------------- .../propertytable/jquery.propertytable.js | 30 +- .../webapp/js/nf/canvas/nf-canvas-toolbox.js | 18 +- .../webapp/js/nf/canvas/nf-component-state.js | 27 +- .../webapp/js/nf/canvas/nf-queue-listing.js | 99 +++++- .../src/main/webapp/js/nf/canvas/nf-settings.js | 158 ++++++++- .../webapp/js/nf/cluster/nf-cluster-table.js | 83 ++++- .../webapp/js/nf/counters/nf-counters-table.js | 53 ++- .../webapp/js/nf/history/nf-history-table.js | 55 ++- .../src/main/webapp/js/nf/nf-common.js | 16 +- .../js/nf/provenance/nf-provenance-table.js | 158 ++++++--- .../webapp/js/nf/summary/nf-summary-table.js | 333 +++++++++++++++---- .../js/nf/templates/nf-templates-table.js | 54 ++- .../main/webapp/js/nf/users/nf-users-table.js | 104 ++++-- 13 files changed, 982 insertions(+), 206 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/propertytable/jquery.propertytable.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/propertytable/jquery.propertytable.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/propertytable/jquery.propertytable.js index b686eb9..7e8702e 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/propertytable/jquery.propertytable.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/propertytable/jquery.propertytable.js @@ -1014,8 +1014,25 @@ }; var propertyColumns = [ - {id: 'property', field: 'displayName', name: 'Property', sortable: false, resizable: true, rerenderOnResize: true, formatter: nameFormatter}, - {id: 'value', field: 'value', name: 'Value', sortable: false, resizable: true, cssClass: 'pointer', rerenderOnResize: true, formatter: valueFormatter} + { + id: 'property', + field: 'displayName', + name: 'Property', + sortable: false, + resizable: true, + rerenderOnResize: true, + formatter: nameFormatter + }, + { + id: 'value', + field: 'value', + name: 'Value', + sortable: false, + resizable: true, + cssClass: 'pointer', + rerenderOnResize: true, + formatter: valueFormatter + } ]; // custom formatter for the actions column @@ -1048,7 +1065,14 @@ return markup; }; - propertyColumns.push({id: "actions", name: " ", minWidth: 20, width: 20, formatter: actionFormatter}); + propertyColumns.push( + { + id: "actions", + name: " ", + minWidth: 20, + width: 20, + formatter: actionFormatter + }); var propertyConfigurationOptions = { forceFitColumns: true, http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbox.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbox.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbox.js index 8c666ab..3b4aa1a 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbox.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbox.js @@ -897,8 +897,22 @@ nf.CanvasToolbox = (function () { // initialize the processor type table var processorTypesColumns = [ - {id: 'type', name: 'Type', field: 'label', sortable: true, resizable: true}, - {id: 'tags', name: 'Tags', field: 'tags', sortable: true, resizable: true} + { + id: 'type', + name: 'Type', + field: 'label', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'tags', + name: 'Tags', + field: 'tags', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + } ]; var processorTypesOptions = { forceFitColumns: true, http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-component-state.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-component-state.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-component-state.js index fd2f4f6..c27d2d5 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-component-state.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-component-state.js @@ -286,13 +286,34 @@ nf.ComponentState = (function () { // initialize the queue listing table var componentStateColumns = [ - {id: 'key', field: 'key', name: 'Key', sortable: true, resizable: true}, - {id: 'value', field: 'value', name: 'Value', sortable: true, resizable: true} + { + id: 'key', + field: 'key', + name: 'Key', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'value', + field: 'value', + name: 'Value', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + } ]; // conditionally show the cluster node identifier if (nf.Canvas.isClustered()) { - componentStateColumns.push({id: 'scope', field: 'scope', name: 'Scope', sortable: true, resizable: true}); + componentStateColumns.push({ + id: 'scope', + field: 'scope', + name: 'Scope', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }); } var componentStateOptions = { http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-queue-listing.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-queue-listing.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-queue-listing.js index 76d368e..9194ee2 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-queue-listing.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-queue-listing.js @@ -550,19 +550,89 @@ nf.QueueListing = (function () { // initialize the queue listing table var queueListingColumns = [ - {id: 'moreDetails', field: 'moreDetails', name: ' ', sortable: false, resizable: false, formatter: moreDetailsFormatter, width: 50, maxWidth: 50}, - {id: 'position', name: 'Position', field: 'position', sortable: false, resizable: false, width: 75, maxWidth: 75}, - {id: 'uuid', name: 'UUID', field: 'uuid', sortable: false, resizable: true}, - {id: 'filename', name: 'Filename', field: 'filename', sortable: false, resizable: true}, - {id: 'size', name: 'File Size', field: 'size', sortable: false, resizable: true, defaultSortAsc: false, formatter: dataSizeFormatter}, - {id: 'queuedDuration', name: 'Queued Duration', field: 'queuedDuration', sortable: false, resizable: true, formatter: durationFormatter}, - {id: 'lineageDuration', name: 'Lineage Duration', field: 'lineageDuration', sortable: false, resizable: true, formatter: durationFormatter}, - {id: 'penalized', name: 'Penalized', field: 'penalized', sortable: false, resizable: false, width: 100, maxWidth: 100, formatter: penalizedFormatter} + { + id: 'moreDetails', + field: 'moreDetails', + name: ' ', + sortable: false, + resizable: false, + formatter: moreDetailsFormatter, + width: 50, + maxWidth: 50 + }, + { + id: 'position', + name: 'Position', + field: 'position', + sortable: false, + resizable: false, + width: 75, + maxWidth: 75, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'uuid', + name: 'UUID', + field: 'uuid', + sortable: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'filename', + name: 'Filename', + field: 'filename', + sortable: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'size', + name: 'File Size', + field: 'size', + sortable: false, + resizable: true, + defaultSortAsc: false, + formatter: dataSizeFormatter + }, + { + id: 'queuedDuration', + name: 'Queued Duration', + field: 'queuedDuration', + sortable: false, + resizable: true, + formatter: durationFormatter + }, + { + id: 'lineageDuration', + name: 'Lineage Duration', + field: 'lineageDuration', + sortable: false, + resizable: true, + formatter: durationFormatter + }, + { + id: 'penalized', + name: 'Penalized', + field: 'penalized', + sortable: false, + resizable: false, + width: 100, + maxWidth: 100, + formatter: penalizedFormatter + } ]; // conditionally show the cluster node identifier if (nf.Canvas.isClustered()) { - queueListingColumns.push({id: 'clusterNodeAddress', name: 'Node', field: 'clusterNodeAddress', sortable: false, resizable: true}); + queueListingColumns.push({ + id: 'clusterNodeAddress', + name: 'Node', + field: 'clusterNodeAddress', + sortable: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }); } // add an actions column when the user can access provenance @@ -572,7 +642,16 @@ nf.QueueListing = (function () { return '<div title="Provenance" class="pointer provenance-icon view-provenance"></div>'; }; - queueListingColumns.push({id: 'actions', name: ' ', resizable: false, formatter: actionsFormatter, sortable: false, width: 50, maxWidth: 50}); + queueListingColumns.push( + { + id: 'actions', + name: ' ', + resizable: false, + formatter: actionsFormatter, + sortable: false, + width: 50, + maxWidth: 50 + }); } var queueListingOptions = { http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-settings.js ---------------------------------------------------------------------- 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 64b1c50..485003c 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 @@ -383,8 +383,22 @@ nf.Settings = (function () { // initialize the processor type table var controllerServiceTypesColumns = [ - {id: 'type', name: 'Type', field: 'label', sortable: false, resizable: true}, - {id: 'tags', name: 'Tags', field: 'tags', sortable: false, resizable: true} + { + id: 'type', + name: 'Type', + field: 'label', + sortable: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'tags', + name: 'Tags', + field: 'tags', + sortable: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + } ]; // initialize the dataview @@ -553,7 +567,7 @@ nf.Settings = (function () { * @returns {String} */ var typeFormatter = function (row, cell, value, columnDef, dataContext) { - return nf.Common.substringAfterLast(value, '.'); + return nf.Common.substringAfterLast(nf.Common.escapeHtml(value), '.'); }; /** @@ -706,19 +720,67 @@ nf.Settings = (function () { // define the column model for the controller services table var controllerServicesColumns = [ - {id: 'moreDetails', field: 'moreDetails', name: ' ', resizable: false, formatter: moreControllerServiceDetails, sortable: true, width: 90, maxWidth: 90, toolTip: 'Sorts based on presence of bulletins'}, - {id: 'name', field: 'name', name: 'Name', sortable: true, resizable: true}, - {id: 'type', field: 'type', name: 'Type', formatter: typeFormatter, sortable: true, resizable: true}, - {id: 'state', field: 'state', name: 'State', formatter: controllerServiceStateFormatter, sortable: true, resizeable: true} + { + id: 'moreDetails', + field: 'moreDetails', + name: ' ', + resizable: false, + formatter: moreControllerServiceDetails, + sortable: true, + width: 90, + maxWidth: 90, + toolTip: 'Sorts based on presence of bulletins' + }, + { + id: 'name', + field: 'name', + name: 'Name', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'type', + field: 'type', + name: 'Type', + formatter: typeFormatter, + sortable: true, + resizable: true + }, + { + id: 'state', + field: 'state', + name: 'State', + formatter: controllerServiceStateFormatter, + sortable: true, + resizeable: true + } ]; // only show availability when clustered if (nf.Canvas.isClustered()) { - controllerServicesColumns.push({id: 'availability', field: 'availability', name: 'Availability', formatter: availabilityFormatter, sortable: true, resizeable: true}); + controllerServicesColumns.push( + { + id: 'availability', + field: 'availability', + name: 'Availability', + formatter: availabilityFormatter, + sortable: true, + resizeable: true + }); } // action column should always be last - controllerServicesColumns.push({id: 'actions', name: ' ', resizable: false, formatter: controllerServiceActionFormatter, sortable: false, width: 90, maxWidth: 90}); + controllerServicesColumns.push( + { + id: 'actions', + name: ' ', + resizable: false, + formatter: controllerServiceActionFormatter, + sortable: false, + width: 90, + maxWidth: 90 + }); // initialize the dataview var controllerServicesData = new Slick.Data.DataView({ @@ -1116,8 +1178,22 @@ nf.Settings = (function () { // initialize the processor type table var reportingTaskTypesColumns = [ - {id: 'type', name: 'Type', field: 'label', sortable: false, resizable: true}, - {id: 'tags', name: 'Tags', field: 'tags', sortable: false, resizable: true} + { + id: 'type', + name: 'Type', + field: 'label', + sortable: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'tags', + name: 'Tags', + field: 'tags', + sortable: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + } ]; // initialize the dataview @@ -1361,19 +1437,67 @@ nf.Settings = (function () { // define the column model for the reporting tasks table var reportingTasksColumnModel = [ - {id: 'moreDetails', field: 'moreDetails', name: ' ', resizable: false, formatter: moreReportingTaskDetails, sortable: true, width: 90, maxWidth: 90, toolTip: 'Sorts based on presence of bulletins'}, - {id: 'name', field: 'name', name: 'Name', sortable: true, resizable: true}, - {id: 'type', field: 'type', name: 'Type', sortable: true, resizable: true, formatter: typeFormatter}, - {id: 'state', field: 'state', name: 'Run Status', sortable: true, resizeable: true, formatter: reportingTaskRunStatusFormatter} + { + id: 'moreDetails', + field: 'moreDetails', + name: ' ', + resizable: false, + formatter: moreReportingTaskDetails, + sortable: true, + width: 90, + maxWidth: 90, + toolTip: 'Sorts based on presence of bulletins' + }, + { + id: 'name', + field: 'name', + name: 'Name', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'type', + field: 'type', + name: 'Type', + sortable: true, + resizable: true, + formatter: typeFormatter + }, + { + id: 'state', + field: 'state', + name: 'Run Status', + sortable: true, + resizeable: true, + formatter: reportingTaskRunStatusFormatter + } ]; // only show availability when clustered if (nf.Canvas.isClustered()) { - reportingTasksColumnModel.push({id: 'availability', field: 'availability', name: 'Availability', formatter: availabilityFormatter, sortable: true, resizeable: true}); + reportingTasksColumnModel.push( + { + id: 'availability', + field: 'availability', + name: 'Availability', + formatter: availabilityFormatter, + sortable: true, + resizeable: true + }); } // action column should always be last - reportingTasksColumnModel.push({id: 'actions', name: ' ', resizable: false, formatter: reportingTaskActionFormatter, sortable: false, width: 90, maxWidth: 90}); + reportingTasksColumnModel.push( + { + id: 'actions', + name: ' ', + resizable: false, + formatter: reportingTaskActionFormatter, + sortable: false, + width: 90, + maxWidth: 90 + }); // initialize the dataview var reportingTasksData = new Slick.Data.DataView({ http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster-table.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster-table.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster-table.js index 74bd958..0340c01 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster-table.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster-table.js @@ -434,9 +434,9 @@ nf.ClusterTable = (function () { // define a custom formatter for the status column var statusFormatter = function (row, cell, value, columnDef, dataContext) { if (dataContext.primary === true) { - return value + ', PRIMARY'; + return nf.Common.escapeHtml(value) + ', PRIMARY'; } else { - return value; + return nf.Common.escapeHtml(value); } }; @@ -446,13 +446,67 @@ nf.ClusterTable = (function () { }; 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} + { + 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, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'queued', + field: 'queued', + name: '<span class="queued-title">Queue</span> / <span class="queued-size-title">Size</span>', + resizable: true, + sortable: true, + defaultSortAsc: false, + formatter: nf.Common.genericValueFormatter + }, + { + 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 @@ -491,7 +545,16 @@ nf.ClusterTable = (function () { } }; - columnModel.push({id: 'actions', label: ' ', formatter: actionFormatter, resizable: false, sortable: false, width: 80, maxWidth: 80}); + columnModel.push( + { + id: 'actions', + label: ' ', + formatter: actionFormatter, + resizable: false, + sortable: false, + width: 80, + maxWidth: 80 + }); } var clusterOptions = { http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/counters/nf-counters-table.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/counters/nf-counters-table.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/counters/nf-counters-table.js index 5688118..6424d79 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/counters/nf-counters-table.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/counters/nf-counters-table.js @@ -34,7 +34,7 @@ nf.CountersTable = (function () { /** * Sorts the specified data using the specified sort details. - * + * * @param {object} sortDetails * @param {object} data */ @@ -92,7 +92,7 @@ nf.CountersTable = (function () { /** * Performs the filtering. - * + * * @param {object} item The item subject to filtering * @param {object} args Filter arguments * @returns {Boolean} Whether or not to include the item @@ -113,10 +113,10 @@ nf.CountersTable = (function () { // perform the filter return item[args.property].search(filterExp) >= 0; }; - + /** * Resets the specified counter. - * + * * @argument {object} item The counter item */ var resetCounter = function (item) { @@ -173,9 +173,31 @@ nf.CountersTable = (function () { // initialize the templates table var countersColumns = [ - {id: 'context', name: 'Context', field: 'context', sortable: true, resizable: true}, - {id: 'name', name: 'Name', field: 'name', sortable: true, resizable: true}, - {id: 'value', name: 'Value', field: 'value', sortable: true, resizable: true, defaultSortAsc: false} + { + id: 'context', + name: 'Context', + field: 'context', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'name', + name: 'Name', + field: 'name', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'value', + name: 'Value', + field: 'value', + sortable: true, + resizable: true, + defaultSortAsc: false, + formatter: nf.Common.genericValueFormatter + } ]; // only allow dfm's to reset counters @@ -186,7 +208,16 @@ nf.CountersTable = (function () { }; // add the action column - countersColumns.push({id: 'actions', name: ' ', sortable: false, resizable: false, formatter: actionFormatter, width: 100, maxWidth: 100}); + countersColumns.push( + { + id: 'actions', + name: ' ', + sortable: false, + resizable: false, + formatter: actionFormatter, + width: 100, + maxWidth: 100 + }); } var countersOptions = { @@ -225,7 +256,7 @@ nf.CountersTable = (function () { sortAsc: args.sortAsc }, countersData); }); - + // configure a click listener countersGrid.onClick.subscribe(function (e, args) { var target = $(e.target); @@ -260,7 +291,7 @@ nf.CountersTable = (function () { // initialize the number of display items $('#displayed-counters').text('0'); }, - + /** * Update the size of the grid based on its container's current size. */ @@ -270,7 +301,7 @@ nf.CountersTable = (function () { countersGrid.resizeCanvas(); } }, - + /** * Load the processor counters table. */ http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/history/nf-history-table.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/history/nf-history-table.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/history/nf-history-table.js index 1938d85..23b37af 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/history/nf-history-table.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/history/nf-history-table.js @@ -257,12 +257,55 @@ nf.HistoryTable = (function () { // initialize the templates table var historyColumns = [ - {id: 'moreDetails', name: ' ', sortable: false, resizable: false, formatter: moreDetailsFormatter, width: 50, maxWidth: 50}, - {id: 'timestamp', name: 'Date/Time', field: 'timestamp', sortable: true, resizable: true}, - {id: 'sourceName', name: 'Name', field: 'sourceName', sortable: true, resizable: true}, - {id: 'sourceType', name: 'Type', field: 'sourceType', sortable: true, resizable: true}, - {id: 'operation', name: 'Operation', field: 'operation', sortable: true, resizable: true}, - {id: 'userName', name: 'User', field: 'userName', sortable: true, resizable: true} + { + id: 'moreDetails', + name: ' ', + sortable: false, + resizable: false, + formatter: moreDetailsFormatter, + width: 50, + maxWidth: 50 + }, + { + id: 'timestamp', + name: 'Date/Time', + field: 'timestamp', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'sourceName', + name: 'Name', + field: 'sourceName', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'sourceType', + name: 'Type', + field: 'sourceType', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'operation', + name: 'Operation', + field: 'operation', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'userName', + name: 'User', + field: 'userName', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + } ]; var historyOptions = { forceFitColumns: true, http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-common.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-common.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-common.js index 7bf401e..64dda52 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-common.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-common.js @@ -539,6 +539,20 @@ nf.Common = (function () { }, /** + * Escapes the value. + * + * @param row + * @param cell + * @param value + * @param columnDef + * @param dataContext + * @returns {string} + */ + genericValueFormatter: function (row, cell, value, columnDef, dataContext) { + return nf.Common.escapeHtml(value); + }, + + /** * Formats the specified property (name and value) accordingly. * * @argument {string} name The name of the property @@ -883,7 +897,7 @@ nf.Common = (function () { while (regex.test(string)) { string = string.replace(regex, '$1' + ',' + '$2'); } - return string; + return nf.Common.escapeHtml(string); }, /** http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-table.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-table.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-table.js index a977e08..74d7fe8 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-table.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-table.js @@ -73,7 +73,7 @@ nf.ProvenanceTable = (function () { /** * Downloads the content for the provenance event that is currently loaded in the specified direction. - * + * * @param {string} direction */ var downloadContent = function (direction) { @@ -113,7 +113,7 @@ nf.ProvenanceTable = (function () { /** * Views the content for the provenance event that is currently loaded in the specified direction. - * + * * @param {string} direction */ var viewContent = function (direction) { @@ -312,7 +312,7 @@ nf.ProvenanceTable = (function () { /** * Initializes the search dialog. - * + * * @param {boolean} isClustered Whether or not this NiFi clustered */ var initSearchDialog = function (isClustered) { @@ -447,7 +447,7 @@ nf.ProvenanceTable = (function () { } }] }); - + return $.ajax({ type: 'GET', url: config.urls.searchOptions, @@ -489,7 +489,7 @@ nf.ProvenanceTable = (function () { /** * Appends the specified searchable field to the search dialog. - * + * * @param {type} field The searchable field */ var appendSearchableField = function (field) { @@ -530,7 +530,7 @@ nf.ProvenanceTable = (function () { /** * Initializes the provenance table. - * + * * @param {boolean} isClustered Whether or not this instance is clustered */ var initProvenanceTable = function (isClustered) { @@ -654,25 +654,93 @@ nf.ProvenanceTable = (function () { return markup; }; - // initialize the provenance table - var provenanceColumns = [ - {id: 'moreDetails', name: ' ', sortable: false, resizable: false, formatter: moreDetailsFormatter, width: 50, maxWidth: 50}, - {id: 'eventTime', name: 'Date/Time', field: 'eventTime', sortable: true, defaultSortAsc: false, resizable: true}, - {id: 'eventType', name: 'Type', field: 'eventType', sortable: true, resizable: true}, - {id: 'flowFileUuid', name: 'FlowFile Uuid', field: 'flowFileUuid', sortable: true, resizable: true}, - {id: 'fileSize', name: 'Size', field: 'fileSize', sortable: true, defaultSortAsc: false, resizable: true}, - {id: 'componentName', name: 'Component Name', field: 'componentName', sortable: true, resizable: true, formatter: valueFormatter}, - {id: 'componentType', name: 'Component Type', field: 'componentType', sortable: true, resizable: true} - ]; - - // conditionally show the cluster node identifier - if (isClustered) { - provenanceColumns.push({id: 'clusterNodeAddress', name: 'Node', field: 'clusterNodeAddress', sortable: true, resizable: true}); - } + // initialize the provenance table + var provenanceColumns = [ + { + id: 'moreDetails', + name: ' ', + sortable: false, + resizable: false, + formatter: moreDetailsFormatter, + width: 50, + maxWidth: 50 + }, + { + id: 'eventTime', + name: 'Date/Time', + field: 'eventTime', + sortable: true, + defaultSortAsc: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'eventType', + name: 'Type', + field: 'eventType', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'flowFileUuid', + name: 'FlowFile Uuid', + field: 'flowFileUuid', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'fileSize', + name: 'Size', + field: 'fileSize', + sortable: true, + defaultSortAsc: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'componentName', + name: 'Component Name', + field: 'componentName', + sortable: true, + resizable: true, + formatter: valueFormatter + }, + { + id: 'componentType', + name: 'Component Type', + field: 'componentType', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + } + ]; + + // conditionally show the cluster node identifier + if (isClustered) { + provenanceColumns.push({ + id: 'clusterNodeAddress', + name: 'Node', + field: 'clusterNodeAddress', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }); + } // conditionally show the action column if (nf.Common.SUPPORTS_SVG || isInShell) { - provenanceColumns.push({id: 'actions', name: ' ', formatter: showLineageFormatter, resizable: false, sortable: false, width: 50, maxWidth: 50}); + provenanceColumns.push( + { + id: 'actions', + name: ' ', + formatter: showLineageFormatter, + resizable: false, + sortable: false, + width: 50, + maxWidth: 50 + }); } var provenanceOptions = { @@ -714,7 +782,7 @@ nf.ProvenanceTable = (function () { sortAsc: args.sortAsc }, provenanceData); }); - + // configure a click listener provenanceGrid.onClick.subscribe(function (e, args) { var target = $(e.target); @@ -793,7 +861,7 @@ nf.ProvenanceTable = (function () { /** * Performs the provenance filtering. - * + * * @param {object} item The item subject to filtering * @param {object} args Filter arguments * @returns {Boolean} Whether or not to include the item @@ -816,7 +884,7 @@ nf.ProvenanceTable = (function () { /** * Sorts the data according to the sort details. - * + * * @param {type} sortDetails * @param {type} data */ @@ -856,7 +924,7 @@ nf.ProvenanceTable = (function () { /** * Submits a new provenance query. - * + * * @argument {object} provenance The provenance query * @returns {deferred} */ @@ -873,7 +941,7 @@ nf.ProvenanceTable = (function () { /** * Gets the results from the provenance query for the specified id. - * + * * @param {object} provenance * @returns {deferred} */ @@ -894,7 +962,7 @@ nf.ProvenanceTable = (function () { /** * Cancels the specified provenance query. - * + * * @param {object} provenance * @return {deferred} */ @@ -915,7 +983,7 @@ nf.ProvenanceTable = (function () { /** * Checks the results of the specified provenance. - * + * * @param {object} provenance */ var loadProvenanceResults = function (provenance) { @@ -980,7 +1048,7 @@ nf.ProvenanceTable = (function () { /** * Goes to the specified component if possible. - * + * * @argument {object} item The event it */ var goTo = function (item) { @@ -1002,15 +1070,15 @@ nf.ProvenanceTable = (function () { * The max delay between requests. */ MAX_DELAY: 4, - + /** * The server time offset */ serverTimeOffset: null, - + /** * Initializes the provenance table. Returns a deferred that will indicate when/if the table has initialized successfully. - * + * * @param {boolean} isClustered Whether or not this instance is clustered */ init: function (isClustered) { @@ -1020,7 +1088,7 @@ nf.ProvenanceTable = (function () { deferred.reject(); nf.Common.handleAjaxError(xhr, status, error); }; - + // load the lineage capabilities loadLineageCapabilities().done(function () { initDetailsDialog(); @@ -1032,7 +1100,7 @@ nf.ProvenanceTable = (function () { }).fail(failure); }).promise(); }, - + /** * Update the size of the grid based on its container's current size. */ @@ -1042,10 +1110,10 @@ nf.ProvenanceTable = (function () { provenanceGrid.resizeCanvas(); } }, - + /** * Updates the value of the specified progress bar. - * + * * @param {jQuery} progressBar * @param {integer} value * @returns {undefined} @@ -1061,20 +1129,20 @@ nf.ProvenanceTable = (function () { } progressBar.progressbar('value', value).append(label); }, - + /** - * Loads the provenance table with events according to the specified optional + * Loads the provenance table with events according to the specified optional * query. If not query is specified or it is empty, the most recent entries will * be returned. - * + * * @param {object} query */ loadProvenanceTable: function (query) { var provenanceProgress = $('#provenance-percent-complete'); - // add support to cancel outstanding requests - when the button is pressed we + // add support to cancel outstanding requests - when the button is pressed we // could be in one of two stages, 1) waiting to GET the status or 2) - // in the process of GETting the status. Handle both cases by cancelling + // in the process of GETting the status. Handle both cases by cancelling // the setTimeout (1) and by setting a flag to indicate that a request has // been request so we can ignore the results (2). @@ -1143,7 +1211,7 @@ nf.ProvenanceTable = (function () { }).fail(closeDialog); }; - // processes the provenance, if the provenance is not done wait delay + // processes the provenance, if the provenance is not done wait delay // before polling again var processProvenanceResponse = function (delay) { // if the request was cancelled just ignore the current response @@ -1196,10 +1264,10 @@ nf.ProvenanceTable = (function () { processProvenanceResponse(1); }).fail(closeDialog); }, - + /** * Shows the details for the specified action. - * + * * @param {object} event */ showEventDetails: function (event) { http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/summary/nf-summary-table.js ---------------------------------------------------------------------- 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 a48758a..095c4af 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 @@ -78,7 +78,7 @@ nf.SummaryTable = (function () { /** * Goes to the specified component if possible. - * + * * @argument {string} groupId The id of the group * @argument {string} componentId The id of the component */ @@ -95,7 +95,7 @@ nf.SummaryTable = (function () { /** * Initializes the summary table. - * + * * @param {type} isClustered */ var initSummaryTable = function (isClustered) { @@ -302,12 +302,12 @@ nf.SummaryTable = (function () { // formatter for io var ioFormatter = function (row, cell, value, columnDef, dataContext) { - return dataContext.read + ' / ' + dataContext.written; + return nf.Common.escapeHtml(dataContext.read) + ' / ' + nf.Common.escapeHtml(dataContext.written); }; // formatter for tasks var taskTimeFormatter = function (row, cell, value, columnDef, dataContext) { - return nf.Common.formatInteger(dataContext.tasks) + ' / ' + dataContext.tasksDuration; + return nf.Common.formatInteger(dataContext.tasks) + ' / ' + nf.Common.escapeHtml(dataContext.tasksDuration); }; // function for formatting the last accessed time @@ -319,25 +319,91 @@ nf.SummaryTable = (function () { var runStatusFormatter = function (row, cell, value, columnDef, dataContext) { var activeThreadCount = ''; if (nf.Common.isDefinedAndNotNull(dataContext.activeThreadCount) && dataContext.activeThreadCount > 0) { - activeThreadCount = '(' + dataContext.activeThreadCount + ')'; + activeThreadCount = '(' + nf.Common.escapeHtml(dataContext.activeThreadCount) + ')'; } var formattedValue = '<div class="' + nf.Common.escapeHtml(value.toLowerCase()) + '" style="margin-top: 3px;"></div>'; return formattedValue + '<div class="status-text" style="margin-top: 4px;">' + nf.Common.escapeHtml(value) + '</div><div style="float: left; margin-left: 4px;">' + nf.Common.escapeHtml(activeThreadCount) + '</div>'; }; // define the input, read, written, and output columns (reused between both tables) - var nameColumn = {id: 'name', field: 'name', name: 'Name', sortable: true, resizable: true}; - var runStatusColumn = {id: 'runStatus', field: 'runStatus', name: 'Run Status', formatter: runStatusFormatter, sortable: true}; - var inputColumn = {id: 'input', field: 'input', name: '<span class="input-title">In</span> / <span class="input-size-title">Size</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', toolTip: 'Count / data size in the last 5 min', sortable: true, defaultSortAsc: false, resizable: true}; - var ioColumn = {id: 'io', field: 'io', name: '<span class="read-title">Read</span> / <span class="written-title">Write</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', toolTip: 'Data size in the last 5 min', formatter: ioFormatter, sortable: true, defaultSortAsc: false, resizable: true}; - var outputColumn = {id: 'output', field: 'output', name: '<span class="output-title">Out</span> / <span class="output-size-title">Size</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', toolTip: 'Count / data size in the last 5 min', sortable: true, defaultSortAsc: false, resizable: true}; - var tasksTimeColumn = {id: 'tasks', field: 'tasks', name: '<span class="tasks-title">Tasks</span> / <span class="time-title">Time</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', toolTip: 'Count / duration in the last 5 min', formatter: taskTimeFormatter, sortable: true, defaultSortAsc: false, resizable: true}; + var nameColumn = { + id: 'name', + field: 'name', + name: 'Name', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }; + var runStatusColumn = { + id: 'runStatus', + field: 'runStatus', + name: 'Run Status', + formatter: runStatusFormatter, + sortable: true + }; + var inputColumn = { + id: 'input', + field: 'input', + name: '<span class="input-title">In</span> / <span class="input-size-title">Size</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', + toolTip: 'Count / data size in the last 5 min', + sortable: true, + defaultSortAsc: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }; + var ioColumn = { + id: 'io', + field: 'io', + name: '<span class="read-title">Read</span> / <span class="written-title">Write</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', + toolTip: 'Data size in the last 5 min', + formatter: ioFormatter, + sortable: true, + defaultSortAsc: false, + resizable: true + }; + var outputColumn = { + id: 'output', + field: 'output', + name: '<span class="output-title">Out</span> / <span class="output-size-title">Size</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', + toolTip: 'Count / data size in the last 5 min', + sortable: true, + defaultSortAsc: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }; + var tasksTimeColumn = { + id: 'tasks', + field: 'tasks', + name: '<span class="tasks-title">Tasks</span> / <span class="time-title">Time</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', + toolTip: 'Count / duration in the last 5 min', + formatter: taskTimeFormatter, + sortable: true, + defaultSortAsc: false, + resizable: true + }; // define the column model for the processor summary table var processorsColumnModel = [ - {id: 'moreDetails', field: 'moreDetails', name: ' ', resizable: false, formatter: moreProcessorDetails, sortable: true, width: 50, maxWidth: 50, toolTip: 'Sorts based on presence of bulletins'}, + { + id: 'moreDetails', + field: 'moreDetails', + name: ' ', + resizable: false, + formatter: moreProcessorDetails, + sortable: true, + width: 50, + maxWidth: 50, + toolTip: 'Sorts based on presence of bulletins' + }, nameColumn, - {id: 'type', field: 'type', name: 'Type', sortable: true, resizable: true}, + { + id: 'type', + field: 'type', + name: 'Type', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, runStatusColumn, inputColumn, ioColumn, @@ -523,7 +589,7 @@ nf.SummaryTable = (function () { } } }); - + // cluster processor refresh nf.Common.addHoverEffect('#cluster-processor-refresh-button', 'button-refresh', 'button-refresh-hover').click(function () { loadClusterProcessorSummary($('#cluster-processor-id').text()); @@ -531,7 +597,14 @@ nf.SummaryTable = (function () { // initialize the cluster processor column model var clusterProcessorsColumnModel = [ - {id: 'node', field: 'node', name: 'Node', sortable: true, resizable: true}, + { + id: 'node', + field: 'node', + name: 'Node', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, runStatusColumn, inputColumn, ioColumn, @@ -592,14 +665,50 @@ nf.SummaryTable = (function () { }; // define the input, read, written, and output columns (reused between both tables) - var queueColumn = {id: 'queued', field: 'queued', name: '<span class="queued-title">Queue</span> / <span class="queued-size-title">Size</span>', sortable: true, defaultSortAsc: false, resize: true}; + var queueColumn = { + id: 'queued', + field: 'queued', + name: '<span class="queued-title">Queue</span> / <span class="queued-size-title">Size</span>', + sortable: true, + defaultSortAsc: false, + resize: true, + formatter: nf.Common.genericValueFormatter}; // define the column model for the summary table var connectionsColumnModel = [ - {id: 'moreDetails', name: ' ', sortable: false, resizable: false, formatter: moreConnectionDetails, width: 50, maxWidth: 50}, - {id: 'sourceName', field: 'sourceName', name: 'Source Name', sortable: true, resizable: true}, - {id: 'name', field: 'name', name: 'Name', sortable: true, resizable: true, formatter: valueFormatter}, - {id: 'destinationName', field: 'destinationName', name: 'Destination Name', sortable: true, resizable: true}, + { + id: 'moreDetails', + name: ' ', + sortable: false, + resizable: false, + formatter: moreConnectionDetails, + width: 50, + maxWidth: 50 + }, + { + id: 'sourceName', + field: 'sourceName', + name: 'Source Name', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'name', + field: 'name', + name: 'Name', + sortable: true, + resizable: true, + formatter: valueFormatter + }, + { + id: 'destinationName', + field: 'destinationName', + name: 'Destination Name', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, inputColumn, queueColumn, outputColumn @@ -747,7 +856,7 @@ nf.SummaryTable = (function () { } } }); - + // cluster connection refresh nf.Common.addHoverEffect('#cluster-connection-refresh-button', 'button-refresh', 'button-refresh-hover').click(function () { loadClusterConnectionSummary($('#cluster-connection-id').text()); @@ -755,7 +864,14 @@ nf.SummaryTable = (function () { // initialize the cluster processor column model var clusterConnectionsColumnModel = [ - {id: 'node', field: 'node', name: 'Node', sortable: true, resizable: true}, + { + id: 'node', + field: 'node', + name: 'Node', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, inputColumn, queueColumn, outputColumn @@ -819,16 +935,60 @@ nf.SummaryTable = (function () { return markup; }; - - var moreDetailsColumn = {id: 'moreDetails', field: 'moreDetails', name: ' ', resizable: false, formatter: moreDetails, sortable: true, width: 50, maxWidth: 50, toolTip: 'Sorts based on presence of bulletins'}; - var transferredColumn = {id: 'transferred', field: 'transferred', name: '<span class="transferred-title">Transferred</span> / <span class="transferred-size-title">Size</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', toolTip: 'Count / data size transferred to and from connections in the last 5 min', resizable: true, defaultSortAsc: false, sortable: true}; - var sentColumn = {id: 'sent', field: 'sent', name: '<span class="sent-title">Sent</span> / <span class="sent-size-title">Size</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', toolTip: 'Count / data size in the last 5 min', sortable: true, defaultSortAsc: false, resizable: true}; - var receivedColumn = {id: 'received', field: 'received', name: '<span class="received-title">Received</span> / <span class="received-size-title">Size</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', toolTip: 'Count / data size in the last 5 min', sortable: true, defaultSortAsc: false, resizable: true}; + + var moreDetailsColumn = { + id: 'moreDetails', + field: 'moreDetails', + name: ' ', + resizable: false, + formatter: moreDetails, + sortable: true, + width: 50, + maxWidth: 50, + toolTip: 'Sorts based on presence of bulletins' + }; + var transferredColumn = { + id: 'transferred', + field: 'transferred', + name: '<span class="transferred-title">Transferred</span> / <span class="transferred-size-title">Size</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', + toolTip: 'Count / data size transferred to and from connections in the last 5 min', + resizable: true, + defaultSortAsc: false, + sortable: true, + formatter: nf.Common.genericValueFormatter + }; + var sentColumn = { + id: 'sent', + field: 'sent', + name: '<span class="sent-title">Sent</span> / <span class="sent-size-title">Size</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', + toolTip: 'Count / data size in the last 5 min', + sortable: true, + defaultSortAsc: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }; + var receivedColumn = { + id: 'received', + field: 'received', + name: '<span class="received-title">Received</span> / <span class="received-size-title">Size</span> <span style="font-weight: normal; overflow: hidden;">5 min</span>', + toolTip: 'Count / data size in the last 5 min', + sortable: true, + defaultSortAsc: false, + resizable: true, + formatter: nf.Common.genericValueFormatter + }; // define the column model for the summary table var processGroupsColumnModel = [ moreDetailsColumn, - {id: 'name', field: 'name', name: 'Name', sortable: true, resizable: true, formatter: valueFormatter}, + { + id: 'name', + field: 'name', + name: 'Name', + sortable: true, + resizable: true, + formatter: valueFormatter + }, transferredColumn, inputColumn, ioColumn, @@ -836,7 +996,7 @@ nf.SummaryTable = (function () { sentColumn, receivedColumn ]; - + // add an action column if appropriate if (isClustered || isInShell || nf.Common.SUPPORTS_SVG) { // define how the column is formatted @@ -1006,7 +1166,7 @@ nf.SummaryTable = (function () { } } }); - + // cluster process group refresh nf.Common.addHoverEffect('#cluster-process-group-refresh-button', 'button-refresh', 'button-refresh-hover').click(function () { loadClusterProcessGroupSummary($('#cluster-process-group-id').text()); @@ -1014,7 +1174,14 @@ nf.SummaryTable = (function () { // initialize the cluster process groups column model var clusterProcessGroupsColumnModel = [ - {id: 'node', field: 'node', name: 'Node', sortable: true, resizable: true}, + { + id: 'node', + field: 'node', + name: 'Node', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, transferredColumn, inputColumn, ioColumn, @@ -1232,7 +1399,7 @@ nf.SummaryTable = (function () { } } }); - + // cluster input port refresh nf.Common.addHoverEffect('#cluster-input-port-refresh-button', 'button-refresh', 'button-refresh-hover').click(function () { loadClusterInputPortSummary($('#cluster-input-port-id').text()); @@ -1240,7 +1407,14 @@ nf.SummaryTable = (function () { // initialize the cluster input port column model var clusterInputPortsColumnModel = [ - {id: 'node', field: 'node', name: 'Node', sortable: true, resizable: true}, + { + id: 'node', + field: 'node', + name: 'Node', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, runStatusColumn, outputColumn ]; @@ -1454,7 +1628,7 @@ nf.SummaryTable = (function () { } } }); - + // cluster output port refresh nf.Common.addHoverEffect('#cluster-output-port-refresh-button', 'button-refresh', 'button-refresh-hover').click(function () { loadClusterOutputPortSummary($('#cluster-output-port-id').text()); @@ -1462,7 +1636,14 @@ nf.SummaryTable = (function () { // initialize the cluster output port column model var clusterOutputPortsColumnModel = [ - {id: 'node', field: 'node', name: 'Node', sortable: true, resizable: true}, + { + id: 'node', + field: 'node', + name: 'Node', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, runStatusColumn, inputColumn ]; @@ -1518,7 +1699,7 @@ nf.SummaryTable = (function () { var transmissionStatusFormatter = function (row, cell, value, columnDef, dataContext) { var activeThreadCount = ''; if (nf.Common.isDefinedAndNotNull(dataContext.activeThreadCount) && dataContext.activeThreadCount > 0) { - activeThreadCount = '(' + dataContext.activeThreadCount + ')'; + activeThreadCount = '(' + nf.Common.escapeHtml(dataContext.activeThreadCount) + ')'; } // determine what to put in the mark up @@ -1539,12 +1720,35 @@ nf.SummaryTable = (function () { return formattedValue + '<div class="status-text" style="margin-top: 4px;">' + transmissionLabel + '</div><div style="float: left; margin-left: 4px;">' + nf.Common.escapeHtml(activeThreadCount) + '</div>'; }; - var transmissionStatusColumn = {id: 'transmissionStatus', field: 'transmissionStatus', name: 'Transmitting', formatter: transmissionStatusFormatter, sortable: true, resizable: true}; - var targetUriColumn = {id: 'targetUri', field: 'targetUri', name: 'Target URI', sortable: true, resizable: true}; + var transmissionStatusColumn = { + id: 'transmissionStatus', + field: 'transmissionStatus', + name: 'Transmitting', + formatter: transmissionStatusFormatter, + sortable: true, + resizable: true}; + + var targetUriColumn = { + id: 'targetUri', + field: 'targetUri', + name: 'Target URI', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter}; // define the column model for the summary table var remoteProcessGroupsColumnModel = [ - {id: 'moreDetails', field: 'moreDetails', name: ' ', resizable: false, formatter: moreDetails, sortable: true, width: 50, maxWidth: 50, toolTip: 'Sorts based on presence of bulletins'}, + { + id: 'moreDetails', + field: 'moreDetails', + name: ' ', + resizable: false, + formatter: moreDetails, + sortable: true, + width: 50, + maxWidth: 50, + toolTip: 'Sorts based on presence of bulletins' + }, nameColumn, targetUriColumn, transmissionStatusColumn, @@ -1718,7 +1922,7 @@ nf.SummaryTable = (function () { } } }); - + // cluster remote process group refresh nf.Common.addHoverEffect('#cluster-remote-process-group-refresh-button', 'button-refresh', 'button-refresh-hover').click(function () { loadClusterRemoteProcessGroupSummary($('#cluster-remote-process-group-id').text()); @@ -1726,7 +1930,14 @@ nf.SummaryTable = (function () { // initialize the cluster remote process group column model var clusterRemoteProcessGroupsColumnModel = [ - {id: 'node', field: 'node', name: 'Node', sortable: true, resizable: true}, + { + id: 'node', + field: 'node', + name: 'Node', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, targetUriColumn, transmissionStatusColumn, sentColumn, @@ -1836,7 +2047,7 @@ nf.SummaryTable = (function () { /** * Sorts the specified data using the specified sort details. - * + * * @param {string} tableId * @param {object} sortDetails * @param {object} data @@ -1962,7 +2173,7 @@ nf.SummaryTable = (function () { /** * Performs the processor filtering. - * + * * @param {object} item The item subject to filtering * @param {object} args Filter arguments * @returns {Boolean} Whether or not to include the item @@ -2065,7 +2276,7 @@ nf.SummaryTable = (function () { /** * Adds a new storage usage process bar to the dialog. - * + * * @argument {jQuery} container The container to add the storage usage to. * @argument {object} storageUsage The storage usage. */ @@ -2099,7 +2310,7 @@ nf.SummaryTable = (function () { /** * Poplates the processor summary table using the specified process group. - * + * * @argument {array} processorItems The processor data * @argument {array} connectionItems The connection data * @argument {array} processGroupItems The process group data @@ -2133,7 +2344,7 @@ nf.SummaryTable = (function () { $.each(processGroupStatus.remoteProcessGroupStatus, function (i, rpgStatus) { remoteProcessGroupItems.push(rpgStatus); }); - + // add the process group status as well processGroupItems.push(processGroupStatus); @@ -2169,7 +2380,7 @@ nf.SummaryTable = (function () { /** * Loads the cluster processor details dialog for the specified processor. - * + * * @argument {string} rowId The row id */ var loadClusterProcessorSummary = function (rowId) { @@ -2223,7 +2434,7 @@ nf.SummaryTable = (function () { /** * Loads the cluster connection details dialog for the specified processor. - * + * * @argument {string} rowId The row id */ var loadClusterConnectionSummary = function (rowId) { @@ -2274,7 +2485,7 @@ nf.SummaryTable = (function () { /** * Loads the cluster input port details dialog for the specified processor. - * + * * @argument {string} rowId The row id */ var loadClusterProcessGroupSummary = function (rowId) { @@ -2331,7 +2542,7 @@ nf.SummaryTable = (function () { /** * Loads the cluster input port details dialog for the specified processor. - * + * * @argument {string} rowId The row id */ var loadClusterInputPortSummary = function (rowId) { @@ -2380,7 +2591,7 @@ nf.SummaryTable = (function () { /** * Loads the cluster output port details dialog for the specified processor. - * + * * @argument {string} rowId The row id */ var loadClusterOutputPortSummary = function (rowId) { @@ -2429,7 +2640,7 @@ nf.SummaryTable = (function () { /** * Loads the cluster remote process group details dialog for the specified processor. - * + * * @argument {string} rowId The row id */ var loadClusterRemoteProcessGroupSummary = function (rowId) { @@ -2480,20 +2691,20 @@ nf.SummaryTable = (function () { }; return { - + /** * URL for loading system diagnostics. */ systemDiagnosticsUrl: null, - + /** * URL for loading the summary. */ url: null, - + /** * Initializes the status table. - * + * * @argument {boolean} isClustered Whether or not this NiFi is clustered. */ init: function (isClustered) { @@ -2514,7 +2725,7 @@ nf.SummaryTable = (function () { }); }).promise(); }, - + /** * Update the size of the grid based on its container's current size. */ @@ -2528,7 +2739,7 @@ nf.SummaryTable = (function () { if (nf.Common.isDefinedAndNotNull(connectionsGrid)) { connectionsGrid.resizeCanvas(); } - + var processGroupsGrid = $('#process-group-summary-table').data('gridInstance'); if (nf.Common.isDefinedAndNotNull(processGroupsGrid)) { processGroupsGrid.resizeCanvas(); @@ -2549,7 +2760,7 @@ nf.SummaryTable = (function () { remoteProcessGroupGrid.resizeCanvas(); } }, - + /** * Load the processor status table. */ @@ -2576,7 +2787,7 @@ nf.SummaryTable = (function () { // get the connections grid/data (do not render bulletins) var connectionsGrid = $('#connection-summary-table').data('gridInstance'); var connectionsData = connectionsGrid.getData(); - + // remove any tooltips from the process group table var processGroupGridElement = $('#process-group-summary-table'); nf.Common.cleanUpTooltips(processGroupGridElement, 'img.has-bulletins'); @@ -2628,7 +2839,7 @@ nf.SummaryTable = (function () { connectionsData.setItems(connectionItems); connectionsData.reSort(); connectionsGrid.invalidate(); - + // update the process groups processGroupData.setItems(processGroupItems); processGroupData.reSort(); http://git-wip-us.apache.org/repos/asf/nifi/blob/75bcd359/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/templates/nf-templates-table.js ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/templates/nf-templates-table.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/templates/nf-templates-table.js index 0f9ea8a..958678b 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/templates/nf-templates-table.js +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/templates/nf-templates-table.js @@ -35,7 +35,7 @@ nf.TemplatesTable = (function () { /** * Sorts the specified data using the specified sort details. - * + * * @param {object} sortDetails * @param {object} data */ @@ -59,7 +59,7 @@ nf.TemplatesTable = (function () { /** * Prompts the user before attempting to delete the specified template. - * + * * @argument {object} template The template */ var promptToDeleteTemplate = function (template) { @@ -75,7 +75,7 @@ nf.TemplatesTable = (function () { /** * Deletes the template with the specified id. - * + * * @argument {string} templateId The template id */ var deleteTemplate = function (templateId) { @@ -87,7 +87,7 @@ nf.TemplatesTable = (function () { var templatesGrid = $('#templates-table').data('gridInstance'); var templatesData = templatesGrid.getData(); templatesData.deleteItem(templateId); - + // update the total number of templates $('#total-templates').text(templatesData.getItems().length); }).fail(nf.Common.handleAjaxError); @@ -129,7 +129,7 @@ nf.TemplatesTable = (function () { /** * Performs the filtering. - * + * * @param {object} item The item subject to filtering * @param {object} args Filter arguments * @returns {Boolean} Whether or not to include the item @@ -239,10 +239,42 @@ nf.TemplatesTable = (function () { // initialize the templates table var templatesColumns = [ - {id: 'timestamp', name: 'Date/Time', field: 'timestamp', sortable: true, defaultSortAsc: false, resizable: false, formatter: valueFormatter, width: 225, maxWidth: 225}, - {id: 'name', name: 'Name', field: 'name', sortable: true, resizable: true}, - {id: 'description', name: 'Description', field: 'description', sortable: true, resizable: true, formatter: valueFormatter}, - {id: 'actions', name: ' ', sortable: false, resizable: false, formatter: actionFormatter, width: 100, maxWidth: 100} + { + id: 'timestamp', + name: 'Date/Time', + field: 'timestamp', + sortable: true, + defaultSortAsc: false, + resizable: false, + formatter: valueFormatter, + width: 225, + maxWidth: 225 + }, + { + id: 'name', + name: 'Name', + field: 'name', + sortable: true, + resizable: true, + formatter: nf.Common.genericValueFormatter + }, + { + id: 'description', + name: 'Description', + field: 'description', + sortable: true, + resizable: true, + formatter: valueFormatter + }, + { + id: 'actions', + name: ' ', + sortable: false, + resizable: false, + formatter: actionFormatter, + width: 100, + maxWidth: 100 + } ]; var templatesOptions = { forceFitColumns: true, @@ -317,7 +349,7 @@ nf.TemplatesTable = (function () { // initialize the number of displayed items $('#displayed-templates').text('0'); }, - + /** * Update the size of the grid based on its container's current size. */ @@ -327,7 +359,7 @@ nf.TemplatesTable = (function () { templateGrid.resizeCanvas(); } }, - + /** * Load the processor templates table. */
