You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@nifi.apache.org by mc...@apache.org on 2017/01/20 21:19:42 UTC

[09/12] nifi git commit: [NIFI-3359] Modularize all of nifi-web-ui except canvas directory - Removing shell.jsp from summary.jsp. - This closes #1428

http://git-wip-us.apache.org/repos/asf/nifi/blob/dc934cbb/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 f91d735..93fff60 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
@@ -15,9 +15,34 @@
  * limitations under the License.
  */
 
-/* global nf, Slick */
-
-nf.ClusterTable = (function () {
+/* global nf, define, module, require, exports */
+
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        define(['jquery',
+                'Slick',
+                'nf.Common',
+                'nf.Dialog',
+                'nf.ErrorHandler'],
+            function ($, Slick, common, dialog, errorHandler) {
+                return (nf.ClusterTable = factory($, Slick, common, dialog, errorHandler));
+            });
+    } else if (typeof exports === 'object' && typeof module === 'object') {
+        module.exports = (nf.ClusterTable =
+            factory(require('jquery'),
+                require('Slick'),
+                require('nf.Common'),
+                require('nf.Dialog'),
+                require('nf.ErrorHandler')));
+    } else {
+        nf.ClusterTable = factory(root.$,
+            root.Slick,
+            root.nf.Common,
+            root.nf.Dialog,
+            root.nf.ErrorHandler);
+    }
+}(this, function ($, Slick, common, dialog, errorHandler) {
+    'use strict';
 
     /**
      * Configuration object used to hold a number of configuration items.
@@ -31,14 +56,14 @@ nf.ClusterTable = (function () {
             systemDiagnostics: '../nifi-api/system-diagnostics'
         },
         data: [{
-                name: 'cluster',
-                update: refreshClusterData,
-                isAuthorized: nf.Common.canAccessController
-            },{
-                name: 'systemDiagnostics',
-                update: refreshSystemDiagnosticsData,
-                isAuthorized: nf.Common.canAccessSystem
-            }
+            name: 'cluster',
+            update: refreshClusterData,
+            isAuthorized: common.canAccessController
+        }, {
+            name: 'systemDiagnostics',
+            update: refreshSystemDiagnosticsData,
+            isAuthorized: common.canAccessSystem
+        }
         ]
     };
 
@@ -51,7 +76,7 @@ nf.ClusterTable = (function () {
         rowHeight: 24
     };
 
-    var nodesTab =  {
+    var nodesTab = {
         name: 'Nodes',
         data: {
             dataSet: 'cluster',
@@ -85,14 +110,78 @@ nf.ClusterTable = (function () {
         tableId: 'cluster-jvm-table',
         tableColumnModel: [
             {id: 'node', field: 'node', name: 'Node Address', sortable: true, resizable: true},
-            {id: 'heapMax', field: 'maxHeap', name: 'Heap Max', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'heapTotal', field: 'totalHeap', name: 'Heap Total', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'heapUsed', field: 'usedHeap', name: 'Heap Used', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'heapUtilPct', field: 'heapUtilization', name: 'Heap Utilization', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'nonHeapTotal', field: 'totalNonHeap', name: 'Non-Heap Total', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'nonHeapUsed', field: 'usedNonHeap', name: 'Non-Heap Used', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'gcOldGen', field: 'gcOldGen', name: 'G1 Old Generation', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'gcNewGen', field: 'gcNewGen', name: 'G1 Young Generation', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'}
+            {
+                id: 'heapMax',
+                field: 'maxHeap',
+                name: 'Heap Max',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'heapTotal',
+                field: 'totalHeap',
+                name: 'Heap Total',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'heapUsed',
+                field: 'usedHeap',
+                name: 'Heap Used',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'heapUtilPct',
+                field: 'heapUtilization',
+                name: 'Heap Utilization',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'nonHeapTotal',
+                field: 'totalNonHeap',
+                name: 'Non-Heap Total',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'nonHeapUsed',
+                field: 'usedNonHeap',
+                name: 'Non-Heap Used',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'gcOldGen',
+                field: 'gcOldGen',
+                name: 'G1 Old Generation',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'gcNewGen',
+                field: 'gcNewGen',
+                name: 'G1 Young Generation',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            }
         ],
         tableIdColumn: 'id',
         tableOptions: commonTableOptions,
@@ -116,10 +205,42 @@ nf.ClusterTable = (function () {
         tableId: 'cluster-system-table',
         tableColumnModel: [
             {id: 'node', field: 'node', name: 'Node Address', sortable: true, resizable: true},
-            {id: 'processors', field: 'processors', name: 'Processors', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'processorLoadAverage', field: 'processorLoadAverage', name: 'Processor Load Average', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'totalThreads', field: 'totalThreads', name: 'Total Threads', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'daemonThreads', field: 'daemonThreads', name: 'Daemon Threads', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'}
+            {
+                id: 'processors',
+                field: 'processors',
+                name: 'Processors',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'processorLoadAverage',
+                field: 'processorLoadAverage',
+                name: 'Processor Load Average',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'totalThreads',
+                field: 'totalThreads',
+                name: 'Total Threads',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'daemonThreads',
+                field: 'daemonThreads',
+                name: 'Daemon Threads',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            }
         ],
         tableIdColumn: 'id',
         tableOptions: commonTableOptions,
@@ -143,10 +264,42 @@ nf.ClusterTable = (function () {
         tableId: 'cluster-flowfile-table',
         tableColumnModel: [
             {id: 'node', field: 'node', name: 'Node Address', sortable: true, resizable: true},
-            {id: 'ffRepoTotal', field: 'ffRepoTotal', name: 'Total Space', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'ffRepoUsed', field: 'ffRepoUsed', name: 'Used Space', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'ffRepoFree', field: 'ffRepoFree', name: 'Free Space', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'ffStoreUtil', field: 'ffRepoUtil', name: 'Utilization', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'}
+            {
+                id: 'ffRepoTotal',
+                field: 'ffRepoTotal',
+                name: 'Total Space',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'ffRepoUsed',
+                field: 'ffRepoUsed',
+                name: 'Used Space',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'ffRepoFree',
+                field: 'ffRepoFree',
+                name: 'Free Space',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'ffStoreUtil',
+                field: 'ffRepoUtil',
+                name: 'Utilization',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            }
         ],
         tableIdColumn: 'id',
         tableOptions: commonTableOptions,
@@ -171,10 +324,42 @@ nf.ClusterTable = (function () {
         tableColumnModel: [
             {id: 'node', field: 'node', name: 'Node Address', sortable: true, resizable: true},
             {id: 'contentRepoId', field: 'contentRepoId', name: 'Content Repository', sortable: true, resizable: true},
-            {id: 'contentRepoTotal', field: 'contentRepoTotal', name: 'Total Space', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'contentRepoUsed', field: 'contentRepoUsed', name: 'Used Space', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'contentRepoFree', field: 'contentRepoFree', name: 'Free Space', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'},
-            {id: 'contentRepoUtil', field: 'contentRepoUtil', name: 'Utilization', sortable: true, resizable: true, cssClass: 'cell-right', headerCssClass: 'header-right'}
+            {
+                id: 'contentRepoTotal',
+                field: 'contentRepoTotal',
+                name: 'Total Space',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'contentRepoUsed',
+                field: 'contentRepoUsed',
+                name: 'Used Space',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'contentRepoFree',
+                field: 'contentRepoFree',
+                name: 'Free Space',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            },
+            {
+                id: 'contentRepoUtil',
+                field: 'contentRepoUtil',
+                name: 'Utilization',
+                sortable: true,
+                resizable: true,
+                cssClass: 'cell-right',
+                headerCssClass: 'header-right'
+            }
         ],
         tableIdColumn: 'id',
         tableOptions: commonTableOptions,
@@ -186,9 +371,9 @@ nf.ClusterTable = (function () {
             text: 'by address',
             value: 'node'
         }, {
-           text: 'by repository',
-           value: 'contentRepoId'
-       }]
+            text: 'by repository',
+            value: 'contentRepoId'
+        }]
     };
 
     var versionTab = {
@@ -227,7 +412,7 @@ nf.ClusterTable = (function () {
     /**
      * Click handler for the Nodes table options.
      */
-    function nodesTableOnClick (e, args, target, item) {
+    function nodesTableOnClick(e, args, target, item) {
         if (nodesTab.grid.getColumns()[args.cell].id === 'actions') {
             if (target.hasClass('prompt-for-connect')) {
                 promptForConnect(item);
@@ -246,7 +431,7 @@ nf.ClusterTable = (function () {
     /**
      * Creates the Slick Grid column model for the Nodes table.
      */
-    function createNodeTableColumnModel () {
+    function createNodeTableColumnModel() {
         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>';
         };
@@ -258,7 +443,7 @@ nf.ClusterTable = (function () {
 
         // function for formatting the last accessed time
         var valueFormatter = function (row, cell, value, columnDef, dataContext) {
-            return nf.Common.formatValue(value);
+            return common.formatValue(value);
         };
 
         // define a custom formatter for the status column
@@ -267,17 +452,69 @@ nf.ClusterTable = (function () {
         };
 
         var columnModel = [
-            {id: 'moreDetails', name: '&nbsp;', sortable: false, resizable: false, formatter: moreDetailsFormatter, width: 50, maxWidth: 50},
-            {id: 'formattedNodeAddress', field: 'formattedNodeAddress', 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>&nbsp;/&nbsp;<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: '&nbsp;',
+                sortable: false,
+                resizable: false,
+                formatter: moreDetailsFormatter,
+                width: 50,
+                maxWidth: 50
+            },
+            {
+                id: 'formattedNodeAddress',
+                field: 'formattedNodeAddress',
+                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>&nbsp;/&nbsp;<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()) {
+        if (common.canModifyController()) {
             var actionFormatter = function (row, cell, value, columnDef, dataContext) {
                 var canDisconnect = false;
                 var canConnect = false;
@@ -299,7 +536,15 @@ nf.ClusterTable = (function () {
                 }
             };
 
-            columnModel.push({id: 'actions', label: '&nbsp;', formatter: actionFormatter, resizable: false, sortable: false, width: 80, maxWidth: 80});
+            columnModel.push({
+                id: 'actions',
+                label: '&nbsp;',
+                formatter: actionFormatter,
+                resizable: false,
+                sortable: false,
+                width: 80,
+                maxWidth: 80
+            });
         }
 
         return columnModel;
@@ -313,12 +558,12 @@ nf.ClusterTable = (function () {
      * @param {object} sortDetails
      * @param {object} data
      */
-    function sort (sortDetails, dataView, tab) {
+    function sort(sortDetails, dataView, tab) {
         // defines a function for sorting
         var comparer = function (a, b) {
             if (sortDetails.columnId === 'heartbeat' || sortDetails.columnId === 'uptime') {
-                var aDate = nf.Common.parseDateTime(a[sortDetails.columnId]);
-                var bDate = nf.Common.parseDateTime(b[sortDetails.columnId]);
+                var aDate = common.parseDateTime(a[sortDetails.columnId]);
+                var bDate = common.parseDateTime(b[sortDetails.columnId]);
                 return aDate.getTime() - bDate.getTime();
             } else if (sortDetails.columnId === 'queued') {
                 var aSplit = a[sortDetails.columnId].split(/ \/ /);
@@ -326,33 +571,33 @@ nf.ClusterTable = (function () {
                 var mod = count % 4;
                 if (mod < 2) {
                     $('#cluster-nodes-table span.queued-title').addClass('sorted');
-                    var aCount = nf.Common.parseCount(aSplit[0]);
-                    var bCount = nf.Common.parseCount(bSplit[0]);
+                    var aCount = common.parseCount(aSplit[0]);
+                    var bCount = common.parseCount(bSplit[0]);
                     return aCount - bCount;
                 } else {
                     $('#cluster-nodes-table span.queued-size-title').addClass('sorted');
-                    var aSize = nf.Common.parseSize(aSplit[1]);
-                    var bSize = nf.Common.parseSize(bSplit[1]);
+                    var aSize = common.parseSize(aSplit[1]);
+                    var bSize = common.parseSize(bSplit[1]);
                     return aSize - bSize;
                 }
             } else if (sortDetails.columnId === 'maxHeap' || sortDetails.columnId === 'totalHeap' || sortDetails.columnId === 'usedHeap'
-                    || sortDetails.columnId === 'totalNonHeap' || sortDetails.columnId === 'usedNonHeap'
-                    || sortDetails.columnId === 'ffRepoTotal' || sortDetails.columnId === 'ffRepoUsed'
-                    || sortDetails.columnId === 'ffRepoFree' || sortDetails.columnId === 'contentRepoTotal'
-                    || sortDetails.columnId === 'contentRepoUsed' || sortDetails.columnId === 'contentRepoFree') {
-                var aSize = nf.Common.parseSize(a[sortDetails.columnId]);
-                var bSize = nf.Common.parseSize(b[sortDetails.columnId]);
+                || sortDetails.columnId === 'totalNonHeap' || sortDetails.columnId === 'usedNonHeap'
+                || sortDetails.columnId === 'ffRepoTotal' || sortDetails.columnId === 'ffRepoUsed'
+                || sortDetails.columnId === 'ffRepoFree' || sortDetails.columnId === 'contentRepoTotal'
+                || sortDetails.columnId === 'contentRepoUsed' || sortDetails.columnId === 'contentRepoFree') {
+                var aSize = common.parseSize(a[sortDetails.columnId]);
+                var bSize = common.parseSize(b[sortDetails.columnId]);
                 return aSize - bSize;
             } else if (sortDetails.columnId === 'totalThreads' || sortDetails.columnId === 'daemonThreads'
-                    || sortDetails.columnId === 'processors') {
-                var aCount = nf.Common.parseCount(a[sortDetails.columnId]);
-                var bCount = nf.Common.parseCount(b[sortDetails.columnId]);
+                || sortDetails.columnId === 'processors') {
+                var aCount = common.parseCount(a[sortDetails.columnId]);
+                var bCount = common.parseCount(b[sortDetails.columnId]);
                 return aCount - bCount;
             } else if (sortDetails.columnId === 'gcOldGen' || sortDetails.columnId === 'gcNewGen') {
                 var aSplit = a[sortDetails.columnId].split(/ /);
                 var bSplit = b[sortDetails.columnId].split(/ /);
-                var aCount = nf.Common.parseCount(aSplit[0]);
-                var bCount = nf.Common.parseCount(bSplit[0]);
+                var aCount = common.parseCount(aSplit[0]);
+                var bCount = common.parseCount(bSplit[0]);
                 return aCount - bCount;
             } else if (sortDetails.columnId === 'status') {
                 var aStatus = formatNodeStatus(a);
@@ -363,8 +608,8 @@ nf.ClusterTable = (function () {
                 var bNode = formatNodeAddress(b);
                 return aNode === bNode ? 0 : aNode > bNode ? 1 : -1;
             } else {
-                var aString = nf.Common.isDefinedAndNotNull(a[sortDetails.columnId]) ? a[sortDetails.columnId] : '';
-                var bString = nf.Common.isDefinedAndNotNull(b[sortDetails.columnId]) ? b[sortDetails.columnId] : '';
+                var aString = common.isDefinedAndNotNull(a[sortDetails.columnId]) ? a[sortDetails.columnId] : '';
+                var bString = common.isDefinedAndNotNull(b[sortDetails.columnId]) ? b[sortDetails.columnId] : '';
                 return aString === bString ? 0 : aString > bString ? 1 : -1;
             }
         };
@@ -394,7 +639,7 @@ nf.ClusterTable = (function () {
      * @returns {string}
      */
     var formatNodeAddress = function (node) {
-        return nf.Common.escapeHtml(node.address) + ':' + nf.Common.escapeHtml(node.apiPort);
+        return common.escapeHtml(node.address) + ':' + common.escapeHtml(node.apiPort);
     };
 
     /**
@@ -421,7 +666,7 @@ nf.ClusterTable = (function () {
      */
     var promptForConnect = function (node) {
         // prompt to connect
-        nf.Dialog.showYesNoDialog({
+        dialog.showYesNoDialog({
             headerText: 'Connect Node',
             dialogContent: 'Connect \'' + formatNodeAddress(node) + '\' to this cluster?',
             yesHandler: function () {
@@ -455,7 +700,7 @@ nf.ClusterTable = (function () {
             var clusterGrid = $('#cluster-nodes-table').data('gridInstance');
             var clusterData = clusterGrid.getData();
             clusterData.updateItem(node.nodeId, node);
-        }).fail(nf.Common.handleAjaxError);
+        }).fail(errorHandler.handleAjaxError);
     };
 
     /**
@@ -465,7 +710,7 @@ nf.ClusterTable = (function () {
      */
     var promptForDisconnect = function (node) {
         // prompt for disconnect
-        nf.Dialog.showYesNoDialog({
+        dialog.showYesNoDialog({
             headerText: 'Disconnect Node',
             dialogContent: 'Disconnect \'' + formatNodeAddress(node) + '\' from the cluster?',
             yesHandler: function () {
@@ -500,7 +745,7 @@ nf.ClusterTable = (function () {
             var clusterGrid = $('#cluster-nodes-table').data('gridInstance');
             var clusterData = clusterGrid.getData();
             clusterData.updateItem(node.nodeId, node);
-        }).fail(nf.Common.handleAjaxError);
+        }).fail(errorHandler.handleAjaxError);
     };
 
     /**
@@ -510,7 +755,7 @@ nf.ClusterTable = (function () {
      */
     var promptForRemoval = function (node) {
         // prompt for disconnect
-        nf.Dialog.showYesNoDialog({
+        dialog.showYesNoDialog({
             headerText: 'Remove Node',
             dialogContent: 'Remove \'' + formatNodeAddress(node) + '\' from the cluster?',
             yesHandler: function () {
@@ -534,7 +779,7 @@ nf.ClusterTable = (function () {
             var clusterGrid = $('#cluster-nodes-table').data('gridInstance');
             var clusterData = clusterGrid.getData();
             clusterData.deleteItem(nodeId);
-        }).fail(nf.Common.handleAjaxError);
+        }).fail(errorHandler.handleAjaxError);
     };
 
     /**
@@ -558,7 +803,7 @@ nf.ClusterTable = (function () {
         var grid = visibleTab.grid;
 
         // ensure the grid has been initialized
-        if (nf.Common.isDefinedAndNotNull(grid)) {
+        if (common.isDefinedAndNotNull(grid)) {
             var gridData = grid.getData();
 
             // update the search criteria
@@ -614,7 +859,7 @@ nf.ClusterTable = (function () {
     /**
      * Updates count of displayed and total rows.
      */
-    function updateFilterStats (selectedTab) {
+    function updateFilterStats(selectedTab) {
         if (!selectedTab) {
             selectedTab = getSelectedTab();
         }
@@ -658,22 +903,22 @@ nf.ClusterTable = (function () {
                 $.each(node.events, function (i, event) {
                     eventMessages.push(event.timestamp + ": " + event.message);
                 });
-                $('<div></div>').append(nf.Common.formatUnorderedList(eventMessages)).appendTo(events);
+                $('<div></div>').append(common.formatUnorderedList(eventMessages)).appendTo(events);
             } else {
                 events.append('<div><span class="unset">None</span></div>');
             }
 
             // show the dialog
             $('#node-details-dialog').modal('show');
-        }).fail(nf.Common.handleAjaxError);
+        }).fail(errorHandler.handleAjaxError);
     };
 
     /**
      * Applies system diagnostics data to the JVM tab.
      */
-    function updateJvmTableData (systemDiagnosticsResponse) {
-        if (nf.Common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics)
-            && nf.Common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots)) {
+    function updateJvmTableData(systemDiagnosticsResponse) {
+        if (common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics)
+            && common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots)) {
 
             var jvmTableRows = [];
             systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots.forEach(function (nodeSnapshot) {
@@ -697,9 +942,9 @@ nf.ClusterTable = (function () {
                     totalNonHeap: snapshot.totalNonHeap,
                     usedNonHeap: snapshot.usedNonHeap,
                     gcOldGen: garbageCollection[0].collectionCount + ' times (' +
-                        garbageCollection[0].collectionTime + ')',
+                    garbageCollection[0].collectionTime + ')',
                     gcNewGen: garbageCollection[1].collectionCount + ' times (' +
-                        garbageCollection[1].collectionTime + ')'
+                    garbageCollection[1].collectionTime + ')'
                 });
             });
             jvmTab.rowCount = jvmTableRows.length;
@@ -714,9 +959,9 @@ nf.ClusterTable = (function () {
     /**
      * Applies system diagnostics data to the System tab.
      */
-    function updateSystemTableData (systemDiagnosticsResponse) {
-        if (nf.Common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics)
-            && nf.Common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots)) {
+    function updateSystemTableData(systemDiagnosticsResponse) {
+        if (common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics)
+            && common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots)) {
 
             var systemTableRows = [];
             systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots.forEach(function (nodeSnapshot) {
@@ -743,9 +988,9 @@ nf.ClusterTable = (function () {
     /**
      * Applies system diagnostics data to the FlowFile Storage tab.
      */
-    function updateFlowFileTableData (systemDiagnosticsResponse) {
-        if (nf.Common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics)
-            && nf.Common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots)) {
+    function updateFlowFileTableData(systemDiagnosticsResponse) {
+        if (common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics)
+            && common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots)) {
 
             var flowFileTableRows = [];
             systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots.forEach(function (nodeSnapshot) {
@@ -772,9 +1017,9 @@ nf.ClusterTable = (function () {
     /**
      * Applies system diagnostics data to the Content Storage tab.
      */
-    function updateContentTableData (systemDiagnosticsResponse) {
-        if (nf.Common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics)
-            && nf.Common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots)) {
+    function updateContentTableData(systemDiagnosticsResponse) {
+        if (common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics)
+            && common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots)) {
 
             var contentStorageTableRows = [];
             systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots.forEach(function (nodeSnapshot) {
@@ -805,9 +1050,9 @@ nf.ClusterTable = (function () {
     /**
      * Applies system diagnostics data to the Versions tab.
      */
-    function updateVersionTableData (systemDiagnosticsResponse) {
-        if (nf.Common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics)
-            && nf.Common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots)) {
+    function updateVersionTableData(systemDiagnosticsResponse) {
+        if (common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics)
+            && common.isDefinedAndNotNull(systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots)) {
 
             var versionTableRows = [];
             systemDiagnosticsResponse.systemDiagnostics.nodeSnapshots.forEach(function (nodeSnapshot) {
@@ -834,7 +1079,7 @@ nf.ClusterTable = (function () {
     /**
      * Loads system diagnostics data for the cluster.
      */
-    function refreshSystemDiagnosticsData () {
+    function refreshSystemDiagnosticsData() {
         var systemDiagnosticsUri = config.urls.systemDiagnostics
         var loadPromise = $.ajax({
             type: 'GET',
@@ -848,14 +1093,14 @@ nf.ClusterTable = (function () {
             handlers.forEach(function (handler) {
                 handler(systemDiagnosticsResponse);
             });
-        }).fail(nf.Common.handleAjaxError);
+        }).fail(errorHandler.handleAjaxError);
         return loadPromise;
     };
 
     /**
      * Generic initialization for Slick Grid tables
      */
-    function commonTableInit (tab) {
+    function commonTableInit(tab) {
         var dataView = new Slick.Data.DataView({
             inlineFilters: false
         });
@@ -917,11 +1162,11 @@ nf.ClusterTable = (function () {
     /**
      * Apply the cluster nodes data set to the table.
      */
-    function updateNodesTableData (clusterResponse) {
+    function updateNodesTableData(clusterResponse) {
         var cluster = clusterResponse.cluster;
 
         // ensure there are groups specified
-        if (nf.Common.isDefinedAndNotNull(cluster.nodes)) {
+        if (common.isDefinedAndNotNull(cluster.nodes)) {
             var clusterGrid = nodesTab.grid;
             var clusterData = clusterGrid.getData();
 
@@ -941,7 +1186,7 @@ nf.ClusterTable = (function () {
     /**
      * Refreshes cluster data sets from the server.
      */
-    function refreshClusterData () {
+    function refreshClusterData() {
         var clusterNodesDataPromise = $.ajax({
             type: 'GET',
             url: config.urls.cluster,
@@ -951,17 +1196,17 @@ nf.ClusterTable = (function () {
             handlers.forEach(function (handler) {
                 handler(response);
             });
-        }).fail(nf.Common.handleAjaxError);
+        }).fail(errorHandler.handleAjaxError);
         return clusterNodesDataPromise;
     }
 
     /**
      * Event handler triggered when the user switches tabs.
      */
-    function onSelectTab (tab) {
+    function onSelectTab(tab) {
         // Resize table
         var tabGrid = tab.grid;
-        if (nf.Common.isDefinedAndNotNull(tabGrid)) {
+        if (common.isDefinedAndNotNull(tabGrid)) {
             tabGrid.resizeCanvas();
         }
 
@@ -979,7 +1224,7 @@ nf.ClusterTable = (function () {
         updateFilterStats(tab);
     }
 
-    return {
+    var nfClusterTable = {
         /**
          * Initializes the cluster list.
          */
@@ -1066,7 +1311,7 @@ nf.ClusterTable = (function () {
 
             // listen for browser resize events to update the page size
             $(window).resize(function () {
-                nf.ClusterTable.resetTableSize();
+                nfClusterTable.resetTableSize();
             });
 
             // initialize tabs
@@ -1106,4 +1351,5 @@ nf.ClusterTable = (function () {
         }
     };
 
-}());
\ No newline at end of file
+    return nfClusterTable;
+}));
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/dc934cbb/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster.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.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster.js
index 2e988cb..32e7bb0 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/cluster/nf-cluster.js
@@ -15,14 +15,39 @@
  * limitations under the License.
  */
 
-/* global nf, top */
-
-$(document).ready(function () {
-    // initialize the counters page
-    nf.Cluster.init();
-});
-
-nf.Cluster = (function () {
+/* global nf, top, define, module, require, exports */
+
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        define(['jquery',
+                'nf.Common',
+                'nf.ClusterTable',
+                'nf.ErrorHandler',
+                'nf.Storage'],
+            function ($, common, clusterTable, errorHandler, storage) {
+                return (nf.Cluster = factory($, common, clusterTable, errorHandler, storage));
+            });
+    } else if (typeof exports === 'object' && typeof module === 'object') {
+        module.exports = (nf.Cluster =
+            factory(require('jquery'),
+                require('nf.Common'),
+                require('nf.ClusterTable'),
+                require('nf.ErrorHandler'),
+                require('nf.Storage')));
+    } else {
+        nf.Cluster = factory(root.$,
+            root.nf.Common,
+            root.nf.ClusterTable,
+            root.nf.ErrorHandler,
+            root.nf.Storage);
+    }
+}(this, function ($, common, clusterTable, errorHandler, storage) {
+    'use strict';
+
+    $(document).ready(function () {
+        // initialize the counters page
+        nfCluster.init();
+    });
 
     /**
      * Configuration object used to hold a number of configuration items.
@@ -44,8 +69,8 @@ nf.Cluster = (function () {
             url: config.urls.currentUser,
             dataType: 'json'
         }).done(function (currentUser) {
-            nf.Common.setCurrentUser(currentUser);
-        }).fail(nf.Common.handleAjaxError);
+            common.setCurrentUser(currentUser);
+        }).fail(errorHandler.handleAjaxError);
     };
 
     /**
@@ -54,7 +79,7 @@ nf.Cluster = (function () {
     var initializeClusterPage = function () {
         // define mouse over event for the refresh button
         $('#refresh-button').click(function () {
-            nf.ClusterTable.loadClusterTable();
+            clusterTable.loadClusterTable();
         });
 
         // return a deferred for page initialization
@@ -67,8 +92,8 @@ nf.Cluster = (function () {
                     dataType: 'json'
                 }).done(function (bannerResponse) {
                     // ensure the banners response is specified
-                    if (nf.Common.isDefinedAndNotNull(bannerResponse.banners)) {
-                        if (nf.Common.isDefinedAndNotNull(bannerResponse.banners.headerText) && bannerResponse.banners.headerText !== '') {
+                    if (common.isDefinedAndNotNull(bannerResponse.banners)) {
+                        if (common.isDefinedAndNotNull(bannerResponse.banners.headerText) && bannerResponse.banners.headerText !== '') {
                             // update the header text
                             var bannerHeader = $('#banner-header').text(bannerResponse.banners.headerText).show();
 
@@ -82,7 +107,7 @@ nf.Cluster = (function () {
                             updateTop('counters');
                         }
 
-                        if (nf.Common.isDefinedAndNotNull(bannerResponse.banners.footerText) && bannerResponse.banners.footerText !== '') {
+                        if (common.isDefinedAndNotNull(bannerResponse.banners.footerText) && bannerResponse.banners.footerText !== '') {
                             // update the footer text and show it
                             var bannerFooter = $('#banner-footer').text(bannerResponse.banners.footerText).show();
 
@@ -98,7 +123,7 @@ nf.Cluster = (function () {
 
                     deferred.resolve();
                 }).fail(function (xhr, status, error) {
-                    nf.Common.handleAjaxError(xhr, status, error);
+                    errorHandler.handleAjaxError(xhr, status, error);
                     deferred.reject();
                 });
             } else {
@@ -107,13 +132,13 @@ nf.Cluster = (function () {
         }).promise();
     };
 
-    return {
+    var nfCluster = {
         /**
          * Initializes the counters page.
          */
         init: function () {
-            nf.Storage.init();
-            
+            storage.init();
+
             // load the current user
             loadCurrentUser().done(function () {
                 var setBodySize = function () {
@@ -134,13 +159,13 @@ nf.Cluster = (function () {
                 setBodySize();
 
                 // create the cluster table
-                nf.ClusterTable.init();
+                clusterTable.init();
 
                 // resize to fit
-                nf.ClusterTable.resetTableSize();
+                clusterTable.resetTableSize();
 
                 // load the table
-                nf.ClusterTable.loadClusterTable().done(function () {
+                clusterTable.loadClusterTable().done(function () {
                     // once the table is initialized, finish initializing the page
                     initializeClusterPage().done(function () {
 
@@ -156,15 +181,15 @@ nf.Cluster = (function () {
                             // set the document title and the about title
                             document.title = countersTitle;
                             $('#counters-header-text').text(countersTitle);
-                        }).fail(nf.Common.handleAjaxError);
+                        }).fail(errorHandler.handleAjaxError);
 
                         $(window).on('resize', function (e) {
                             setBodySize();
                             // resize dialogs when appropriate
                             var dialogs = $('.dialog');
                             for (var i = 0, len = dialogs.length; i < len; i++) {
-                                if ($(dialogs[i]).is(':visible')){
-                                    setTimeout(function(dialog){
+                                if ($(dialogs[i]).is(':visible')) {
+                                    setTimeout(function (dialog) {
                                         dialog.modal('resize');
                                     }, 50, $(dialogs[i]));
                                 }
@@ -173,8 +198,8 @@ nf.Cluster = (function () {
                             // resize grids when appropriate
                             var gridElements = $('*[class*="slickgrid_"]');
                             for (var j = 0, len = gridElements.length; j < len; j++) {
-                                if ($(gridElements[j]).is(':visible')){
-                                    setTimeout(function(gridElement){
+                                if ($(gridElements[j]).is(':visible')) {
+                                    setTimeout(function (gridElement) {
                                         gridElement.data('gridInstance').resizeCanvas();
                                     }, 50, $(gridElements[j]));
                                 }
@@ -184,12 +209,12 @@ nf.Cluster = (function () {
                             var tabsContainers = $('.tab-container');
                             var tabsContents = [];
                             for (var k = 0, len = tabsContainers.length; k < len; k++) {
-                                if ($(tabsContainers[k]).is(':visible')){
+                                if ($(tabsContainers[k]).is(':visible')) {
                                     tabsContents.push($('#' + $(tabsContainers[k]).attr('id') + '-content'));
                                 }
                             }
                             $.each(tabsContents, function (index, tabsContent) {
-                                nf.Common.toggleScrollable(tabsContent.get(0));
+                                common.toggleScrollable(tabsContent.get(0));
                             });
                         });
                     });
@@ -197,4 +222,6 @@ nf.Cluster = (function () {
             });
         }
     };
-}());
\ No newline at end of file
+
+    return nfCluster;
+}));
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/dc934cbb/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 ec9bace..ade8236 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
@@ -15,9 +15,31 @@
  * limitations under the License.
  */
 
-/* global nf, Slick */
-
-nf.CountersTable = (function () {
+/* global nf, define, module, require, exports */
+
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        define(['jquery',
+                'Slick',
+                'nf.Common',
+                'nf.ErrorHandler'],
+            function ($, Slick, common, errorHandler) {
+                return (nf.CountersTable = factory($, Slick, common, errorHandler));
+            });
+    } else if (typeof exports === 'object' && typeof module === 'object') {
+        module.exports = (nf.CountersTable =
+            factory(require('jquery'),
+                require('Slick'),
+                require('nf.Common'),
+                require('nf.ErrorHandler')));
+    } else {
+        nf.CountersTable = factory(root.$,
+            root.Slick,
+            root.nf.Common,
+            root.nf.ErrorHandler);
+    }
+}(this, function ($, Slick, common, errorHandler) {
+    'use strict';
 
     /**
      * Configuration object used to hold a number of configuration items.
@@ -30,7 +52,7 @@ nf.CountersTable = (function () {
 
     /**
      * Sorts the specified data using the specified sort details.
-     * 
+     *
      * @param {object} sortDetails
      * @param {object} data
      */
@@ -38,12 +60,12 @@ nf.CountersTable = (function () {
         // defines a function for sorting
         var comparer = function (a, b) {
             if (sortDetails.columnId === 'value') {
-                var aCount = nf.Common.parseCount(a[sortDetails.columnId]);
-                var bCount = nf.Common.parseCount(b[sortDetails.columnId]);
+                var aCount = common.parseCount(a[sortDetails.columnId]);
+                var bCount = common.parseCount(b[sortDetails.columnId]);
                 return aCount - bCount;
             } else {
-                var aString = nf.Common.isDefinedAndNotNull(a[sortDetails.columnId]) ? a[sortDetails.columnId] : '';
-                var bString = nf.Common.isDefinedAndNotNull(b[sortDetails.columnId]) ? b[sortDetails.columnId] : '';
+                var aString = common.isDefinedAndNotNull(a[sortDetails.columnId]) ? a[sortDetails.columnId] : '';
+                var bString = common.isDefinedAndNotNull(b[sortDetails.columnId]) ? b[sortDetails.columnId] : '';
                 return aString === bString ? 0 : aString > bString ? 1 : -1;
             }
         };
@@ -69,7 +91,7 @@ nf.CountersTable = (function () {
         var countersGrid = $('#counters-table').data('gridInstance');
 
         // ensure the grid has been initialized
-        if (nf.Common.isDefinedAndNotNull(countersGrid)) {
+        if (common.isDefinedAndNotNull(countersGrid)) {
             var countersData = countersGrid.getData();
 
             // update the search criteria
@@ -83,7 +105,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
@@ -104,10 +126,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) {
@@ -122,7 +144,7 @@ nf.CountersTable = (function () {
             var countersGrid = $('#counters-table').data('gridInstance');
             var countersData = countersGrid.getData();
             countersData.updateItem(counter.id, counter);
-        }).fail(nf.Common.handleAjaxError);
+        }).fail(errorHandler.handleAjaxError);
     };
 
     return {
@@ -138,12 +160,12 @@ nf.CountersTable = (function () {
             // filter type
             $('#counters-filter-type').combo({
                 options: [{
-                        text: 'by name',
-                        value: 'name'
-                    }, {
-                        text: 'by context',
-                        value: 'context'
-                    }],
+                    text: 'by name',
+                    value: 'name'
+                }, {
+                    text: 'by context',
+                    value: 'context'
+                }],
                 select: function (option) {
                     applyFilter();
                 }
@@ -151,20 +173,47 @@ 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
+                },
+                {
+                    id: 'name',
+                    name: 'Name',
+                    field: 'name',
+                    sortable: true,
+                    resizable: true
+                },
+                {
+                    id: 'value',
+                    name: 'Value',
+                    field: 'value',
+                    sortable: true,
+                    resizable: true,
+                    defaultSortAsc: false
+                }
             ];
 
             // only allow dfm's to reset counters
-            if (nf.Common.canModifyCounters()) {
+            if (common.canModifyCounters()) {
                 // function for formatting the actions column
                 var actionFormatter = function (row, cell, value, columnDef, dataContext) {
                     return '<div title="Reset Counter" class="pointer reset-counter fa fa-undo" style="margin-top: 2px;"></div>';
                 };
 
                 // add the action column
-                countersColumns.push({id: 'actions', name: '&nbsp;', sortable: false, resizable: false, formatter: actionFormatter, width: 100, maxWidth: 100});
+                countersColumns.push({
+                    id: 'actions',
+                    name: '&nbsp;',
+                    sortable: false,
+                    resizable: false,
+                    formatter: actionFormatter,
+                    width: 100,
+                    maxWidth: 100
+                });
             }
 
             var countersOptions = {
@@ -204,7 +253,7 @@ nf.CountersTable = (function () {
                     sortAsc: args.sortAsc
                 }, countersData);
             });
-            
+
             // configure a click listener
             countersGrid.onClick.subscribe(function (e, args) {
                 var target = $(e.target);
@@ -239,17 +288,17 @@ 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.
          */
         resetTableSize: function () {
             var countersGrid = $('#counters-table').data('gridInstance');
-            if (nf.Common.isDefinedAndNotNull(countersGrid)) {
+            if (common.isDefinedAndNotNull(countersGrid)) {
                 countersGrid.resizeCanvas();
             }
         },
-        
+
         /**
          * Load the processor counters table.
          */
@@ -263,7 +312,7 @@ nf.CountersTable = (function () {
                 var aggregateSnapshot = report.aggregateSnapshot;
 
                 // ensure there are groups specified
-                if (nf.Common.isDefinedAndNotNull(aggregateSnapshot.counters)) {
+                if (common.isDefinedAndNotNull(aggregateSnapshot.counters)) {
                     var countersGrid = $('#counters-table').data('gridInstance');
                     var countersData = countersGrid.getData();
 
@@ -280,7 +329,7 @@ nf.CountersTable = (function () {
                 } else {
                     $('#total-counters').text('0');
                 }
-            }).fail(nf.Common.handleAjaxError);
+            }).fail(errorHandler.handleAjaxError);
         }
     };
-}());
\ No newline at end of file
+}));
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/dc934cbb/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/counters/nf-counters.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.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/counters/nf-counters.js
index c18b9b3..be321e6 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/counters/nf-counters.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/counters/nf-counters.js
@@ -15,14 +15,39 @@
  * limitations under the License.
  */
 
-/* global nf, top */
-
-$(document).ready(function () {
-    // initialize the counters page
-    nf.Counters.init();
-});
-
-nf.Counters = (function () {
+/* global nf, top, define, module, require, exports */
+
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        define(['jquery',
+                'nf.Common',
+                'nf.CountersTable',
+                'nf.ErrorHandler',
+                'nf.Storage'],
+            function ($, common, countersTable, errorHandler, storage) {
+                return (nf.Counters = factory($, common, countersTable, errorHandler, storage));
+            });
+    } else if (typeof exports === 'object' && typeof module === 'object') {
+        module.exports = (nf.Counters =
+            factory(require('jquery'),
+                require('nf.Common'),
+                require('nf.CountersTable'),
+                require('nf.ErrorHandler'),
+                require('nf.Storage')));
+    } else {
+        nf.Counters = factory(root.$,
+            root.nf.Common,
+            root.nf.CountersTable,
+            root.nf.ErrorHandler,
+            root.nf.Storage);
+    }
+}(this, function ($, common, countersTable, errorHandler, storage) {
+    'use strict';
+
+    $(document).ready(function () {
+        // initialize the counters page
+        nfCounters.init();
+    });
 
     /**
      * Configuration object used to hold a number of configuration items.
@@ -44,9 +69,9 @@ nf.Counters = (function () {
             url: config.urls.currentUser,
             dataType: 'json'
         }).done(function (currentUser) {
-            nf.Common.setCurrentUser(currentUser);
+            common.setCurrentUser(currentUser);
 
-        }).fail(nf.Common.handleAjaxError);
+        }).fail(errorHandler.handleAjaxError);
     };
 
     /**
@@ -55,7 +80,7 @@ nf.Counters = (function () {
     var initializeCountersPage = function () {
         // define mouse over event for the refresh button
         $('#refresh-button').click(function () {
-            nf.CountersTable.loadCountersTable();
+            countersTable.loadCountersTable();
         });
 
         // return a deferred for page initialization
@@ -68,8 +93,8 @@ nf.Counters = (function () {
                     dataType: 'json'
                 }).done(function (response) {
                     // ensure the banners response is specified
-                    if (nf.Common.isDefinedAndNotNull(response.banners)) {
-                        if (nf.Common.isDefinedAndNotNull(response.banners.headerText) && response.banners.headerText !== '') {
+                    if (common.isDefinedAndNotNull(response.banners)) {
+                        if (common.isDefinedAndNotNull(response.banners.headerText) && response.banners.headerText !== '') {
                             // update the header text
                             var bannerHeader = $('#banner-header').text(response.banners.headerText).show();
 
@@ -83,7 +108,7 @@ nf.Counters = (function () {
                             updateTop('counters');
                         }
 
-                        if (nf.Common.isDefinedAndNotNull(response.banners.footerText) && response.banners.footerText !== '') {
+                        if (common.isDefinedAndNotNull(response.banners.footerText) && response.banners.footerText !== '') {
                             // update the footer text and show it
                             var bannerFooter = $('#banner-footer').text(response.banners.footerText).show();
 
@@ -99,7 +124,7 @@ nf.Counters = (function () {
 
                     deferred.resolve();
                 }).fail(function (xhr, status, error) {
-                    nf.Common.handleAjaxError(xhr, status, error);
+                    errorHandler.handleAjaxError(xhr, status, error);
                     deferred.reject();
                 });
             } else {
@@ -108,20 +133,20 @@ nf.Counters = (function () {
         }).promise();
     };
 
-    return {
+    var nfCounters = {
         /**
          * Initializes the counters page.
          */
         init: function () {
-            nf.Storage.init();
-            
+            storage.init();
+
             // load the current user
             loadCurrentUser().done(function () {
                 // create the counters table
-                nf.CountersTable.init();
+                countersTable.init();
 
                 // load the table
-                nf.CountersTable.loadCountersTable().done(function () {
+                countersTable.loadCountersTable().done(function () {
                     // once the table is initialized, finish initializing the page
                     initializeCountersPage().done(function () {
                         var setBodySize = function () {
@@ -131,14 +156,14 @@ nf.Counters = (function () {
                                     'height': $(window).height() + 'px',
                                     'width': $(window).width() + 'px'
                                 });
-                                
+
                                 $('#counters').css('margin', 40);
                                 $('#counters-table').css('bottom', 127);
                                 $('#counters-refresh-container').css('margin', 40);
                             }
 
                             // configure the initial grid height
-                            nf.CountersTable.resetTableSize();
+                            countersTable.resetTableSize();
                         };
 
                         // get the about details
@@ -156,15 +181,15 @@ nf.Counters = (function () {
 
                             // set the initial size
                             setBodySize();
-                        }).fail(nf.Common.handleAjaxError);
+                        }).fail(errorHandler.handleAjaxError);
 
                         $(window).on('resize', function (e) {
                             setBodySize();
                             // resize dialogs when appropriate
                             var dialogs = $('.dialog');
                             for (var i = 0, len = dialogs.length; i < len; i++) {
-                                if ($(dialogs[i]).is(':visible')){
-                                    setTimeout(function(dialog){
+                                if ($(dialogs[i]).is(':visible')) {
+                                    setTimeout(function (dialog) {
                                         dialog.modal('resize');
                                     }, 50, $(dialogs[i]));
                                 }
@@ -173,8 +198,8 @@ nf.Counters = (function () {
                             // resize grids when appropriate
                             var gridElements = $('*[class*="slickgrid_"]');
                             for (var j = 0, len = gridElements.length; j < len; j++) {
-                                if ($(gridElements[j]).is(':visible')){
-                                    setTimeout(function(gridElement){
+                                if ($(gridElements[j]).is(':visible')) {
+                                    setTimeout(function (gridElement) {
                                         gridElement.data('gridInstance').resizeCanvas();
                                     }, 50, $(gridElements[j]));
                                 }
@@ -184,12 +209,12 @@ nf.Counters = (function () {
                             var tabsContainers = $('.tab-container');
                             var tabsContents = [];
                             for (var k = 0, len = tabsContainers.length; k < len; k++) {
-                                if ($(tabsContainers[k]).is(':visible')){
+                                if ($(tabsContainers[k]).is(':visible')) {
                                     tabsContents.push($('#' + $(tabsContainers[k]).attr('id') + '-content'));
                                 }
                             }
                             $.each(tabsContents, function (index, tabsContent) {
-                                nf.Common.toggleScrollable(tabsContent.get(0));
+                                common.toggleScrollable(tabsContent.get(0));
                             });
                         });
                     });
@@ -197,4 +222,6 @@ nf.Counters = (function () {
             });
         }
     };
-}());
\ No newline at end of file
+
+    return nfCounters;
+}));
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/dc934cbb/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/history/nf-history-model.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-model.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/history/nf-history-model.js
index 366a275..a2132ec 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/history/nf-history-model.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/history/nf-history-model.js
@@ -15,207 +15,225 @@
  * limitations under the License.
  */
 
-/* global Slick, nf */
-
-(function ($) {
-
-    function HistoryModel() {
-        // private
-        var PAGESIZE = 50;
+/* global nf, define, module, require, exports */
+
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        define(['jquery',
+                'Slick',
+                'nf.Common',
+                'nf.ErrorHandler'],
+            function ($, Slick, common, errorHandler) {
+                return (nf.HistoryModel = factory($, Slick, common, errorHandler));
+            });
+    } else if (typeof exports === 'object' && typeof module === 'object') {
+        module.exports = (nf.HistoryModel =
+            factory(require('jquery'),
+                require('Slick'),
+                require('nf.Common'),
+                require('nf.ErrorHandler')));
+    } else {
+        nf.HistoryModel = factory(root.$,
+            root.Slick,
+            root.nf.Common,
+            root.nf.ErrorHandler);
+    }
+}(this, function ($, Slick, common, errorHandler) {
+    'use strict';
 
-        var data = {
-            length: 0
-        };
+    // private
+    var PAGESIZE = 50;
 
-        var filter = {};
-        var sortcol = null;
-        var sortdir = 1;
+    var data = {
+        length: 0
+    };
 
-        var h_request = null;
-        var xhr = null; // ajax request
+    var filter = {};
+    var sortcol = null;
+    var sortdir = 1;
 
-        // events
-        var onDataLoading = new Slick.Event();
-        var onDataLoaded = new Slick.Event();
+    var h_request = null;
+    var xhr = null; // ajax request
 
-        var init = function () {
-        };
+    // events
+    var onDataLoading = new Slick.Event();
+    var onDataLoaded = new Slick.Event();
 
-        var isDataLoaded = function (from, to) {
-            for (var i = from; i <= to; i++) {
-                if (data[i] === undefined || data[i] === null) {
-                    return false;
-                }
+    var isDataLoaded = function (from, to) {
+        for (var i = from; i <= to; i++) {
+            if (data[i] === undefined || data[i] === null) {
+                return false;
             }
-
-            return true;
-        };
-
-        var clear = function () {
-            for (var key in data) {
-                delete data[key];
+        }
+
+        return true;
+    };
+
+    var clear = function () {
+        for (var key in data) {
+            delete data[key];
+        }
+        data.length = 0;
+    };
+
+    var ensureData = function (from, to) {
+        if (xhr) {
+            xhr.abort();
+            for (var i = xhr.fromPage; i <= xhr.toPage; i++) {
+                data[i * PAGESIZE] = undefined;
             }
-            data.length = 0;
-        };
-
-        var ensureData = function (from, to) {
-            if (xhr) {
-                xhr.abort();
-                for (var i = xhr.fromPage; i <= xhr.toPage; i++) {
-                    data[i * PAGESIZE] = undefined;
-                }
+        }
+
+        if (from < 0) {
+            from = 0;
+        }
+
+        var fromPage = Math.floor(from / PAGESIZE);
+        var toPage = Math.floor(to / PAGESIZE);
+
+        while (data[fromPage * PAGESIZE] !== undefined && fromPage < toPage) {
+            fromPage++;
+        }
+
+        while (data[toPage * PAGESIZE] !== undefined && fromPage < toPage) {
+            toPage--;
+        }
+
+        if (fromPage > toPage || ((fromPage === toPage) && data[fromPage * PAGESIZE] !== undefined)) {
+            // TODO:  look-ahead
+            return;
+        }
+
+        var query = {};
+
+        // add the start and end date to the query params
+        query = $.extend({
+            count: ((toPage - fromPage) * PAGESIZE) + PAGESIZE,
+            offset: fromPage * PAGESIZE
+        }, query);
+
+        // conditionally add the sort details
+        if (sortcol !== null) {
+            query['sortColumn'] = sortcol;
+            query['sortOrder'] = (sortdir > 0) ? "asc" : "desc";
+        }
+
+        // add the filter
+        query = $.extend(query, filter);
+
+        // if there is an request currently scheduled, cancel it
+        if (h_request !== null) {
+            clearTimeout(h_request);
+        }
+
+        // schedule the request for data
+        h_request = setTimeout(function () {
+            for (var i = fromPage; i <= toPage; i++) {
+                data[i * PAGESIZE] = null; // null indicates a 'requested but not available yet'
             }
 
-            if (from < 0) {
-                from = 0;
-            }
+            // notify that loading is about to occur
+            onDataLoading.notify({
+                from: from,
+                to: to
+            });
+
+            // perform query...
+            var xhr = $.ajax({
+                type: 'GET',
+                url: '../nifi-api/flow/history',
+                data: query,
+                dataType: 'json'
+            }).done(function (response) {
+                var history = response.history;
+
+                // calculate the indices
+                var from = fromPage * PAGESIZE;
+                var to = from + history.actions.length;
+
+                // update the data length
+                data.length = history.total;
+
+                // populate the history actions
+                for (var i = 0; i < history.actions.length; i++) {
+                    data[from + i] = history.actions[i];
+                    data[from + i].index = from + i;
+                }
 
-            var fromPage = Math.floor(from / PAGESIZE);
-            var toPage = Math.floor(to / PAGESIZE);
+                // update the stats last refreshed timestamp
+                $('#history-last-refreshed').text(history.lastRefreshed);
 
-            while (data[fromPage * PAGESIZE] !== undefined && fromPage < toPage) {
-                fromPage++;
-            }
+                // set the timezone for the start and end time
+                $('.timezone').text(common.substringAfterLast(history.lastRefreshed, ' '));
 
-            while (data[toPage * PAGESIZE] !== undefined && fromPage < toPage) {
-                toPage--;
-            }
+                // show the filter message if applicable
+                if (query['sourceId'] || query['userIdentity'] || query['startDate'] || query['endDate']) {
+                    $('#history-filter-overview').css('visibility', 'visible');
+                } else {
+                    $('#history-filter-overview').css('visibility', 'hidden');
+                }
 
-            if (fromPage > toPage || ((fromPage === toPage) && data[fromPage * PAGESIZE] !== undefined)) {
-                // TODO:  look-ahead
-                return;
-            }
+                // clear the current request
+                xhr = null;
 
-            var query = {};
+                // notify data loaded
+                onDataLoaded.notify({
+                    from: from,
+                    to: to
+                });
+            }).fail(errorHandler.handleAjaxError);
+            xhr.fromPage = fromPage;
+            xhr.toPage = toPage;
 
-            // add the start and end date to the query params
-            query = $.extend({
-                count: ((toPage - fromPage) * PAGESIZE) + PAGESIZE,
-                offset: fromPage * PAGESIZE
-            }, query);
+        }, 50);
+    };
 
-            // conditionally add the sort details
-            if (sortcol !== null) {
-                query['sortColumn'] = sortcol;
-                query['sortOrder'] = (sortdir > 0) ? "asc" : "desc";
-            }
+    var reloadData = function (from, to) {
+        for (var i = from; i <= to; i++)
+            delete data[i];
 
-            // add the filter
-            query = $.extend(query, filter);
+        ensureData(from, to);
+    };
 
-            // if there is an request currently scheduled, cancel it
-            if (h_request !== null) {
-                clearTimeout(h_request);
-            }
+    var setSort = function (column, dir) {
+        sortcol = column;
+        sortdir = dir;
+        clear();
+    };
 
-            // schedule the request for data
-            h_request = setTimeout(function () {
-                for (var i = fromPage; i <= toPage; i++) {
-                    data[i * PAGESIZE] = null; // null indicates a 'requested but not available yet'
-                }
+    var setFilterArgs = function (newFilter) {
+        filter = newFilter;
+        clear();
+    };
 
-                // notify that loading is about to occur
-                onDataLoading.notify({
-                    from: from,
-                    to: to
-                });
+    var getItem = function (i) {
+        return data[i];
+    };
 
-                // perform query...
-                var xhr = $.ajax({
-                    type: 'GET',
-                    url: '../nifi-api/flow/history',
-                    data: query,
-                    dataType: 'json'
-                }).done(function (response) {
-                    var history = response.history;
-
-                    // calculate the indices
-                    var from = fromPage * PAGESIZE;
-                    var to = from + history.actions.length;
-
-                    // update the data length
-                    data.length = history.total;
-
-                    // populate the history actions
-                    for (var i = 0; i < history.actions.length; i++) {
-                        data[from + i] = history.actions[i];
-                        data[from + i].index = from + i;
-                    }
-
-                    // update the stats last refreshed timestamp
-                    $('#history-last-refreshed').text(history.lastRefreshed);
-
-                    // set the timezone for the start and end time
-                    $('.timezone').text(nf.Common.substringAfterLast(history.lastRefreshed, ' '));
-
-                    // show the filter message if applicable
-                    if (query['sourceId'] || query['userIdentity'] || query['startDate'] || query['endDate']) {
-                        $('#history-filter-overview').css('visibility', 'visible');
-                    } else {
-                        $('#history-filter-overview').css('visibility', 'hidden');
-                    }
-
-                    // clear the current request
-                    xhr = null;
-
-                    // notify data loaded
-                    onDataLoaded.notify({
-                        from: from,
-                        to: to
-                    });
-                }).fail(nf.Common.handleAjaxError);
-                xhr.fromPage = fromPage;
-                xhr.toPage = toPage;
-
-            }, 50);
-        };
-
-        var reloadData = function (from, to) {
-            for (var i = from; i <= to; i++)
-                delete data[i];
-
-            ensureData(from, to);
-        };
-
-        var setSort = function (column, dir) {
-            sortcol = column;
-            sortdir = dir;
-            clear();
-        };
-
-        var setFilterArgs = function (newFilter) {
-            filter = newFilter;
-            clear();
-        };
-
-        var getItem = function (i) {
-            return data[i];
-        };
-
-        var getLength = function () {
-            return data.length;
-        };
-
-        init();
-
-        return {
-            // properties
-            data: data,
-            // methods
-            clear: clear,
-            isDataLoaded: isDataLoaded,
-            ensureData: ensureData,
-            reloadData: reloadData,
-            setSort: setSort,
-            setFilterArgs: setFilterArgs,
-            getItem: getItem,
-            getLength: getLength,
-            // events
-            onDataLoading: onDataLoading,
-            onDataLoaded: onDataLoaded
-        };
+    var getLength = function () {
+        return data.length;
+    };
+
+    function HistoryModel() {
+    }
+
+    HistoryModel.prototype = {
+        constructor: HistoryModel,
+        // properties
+        data: data,
+        // methods
+        clear: clear,
+        isDataLoaded: isDataLoaded,
+        ensureData: ensureData,
+        reloadData: reloadData,
+        setSort: setSort,
+        setFilterArgs: setFilterArgs,
+        getItem: getItem,
+        getLength: getLength,
+        // events
+        onDataLoading: onDataLoading,
+        onDataLoaded: onDataLoaded
     }
 
-    // nf.HistoryModel
-    $.extend(true, window, {nf: {HistoryModel: HistoryModel}});
-})(jQuery);
\ No newline at end of file
+    return HistoryModel;
+}));
\ No newline at end of file