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 2016/07/13 03:33:39 UTC

nifi git commit: [NIFI-2205] Update Cluster Shell [NIFI-2217] fix single node and cluster link [NIFI-2219] Fix styles on provenance cluster search combo [NIFI-2180] Fix settings shell table text alignment for run status [NIFI-2140] Update preview image f

Repository: nifi
Updated Branches:
  refs/heads/master e0c96794f -> 8db89c8c0


[NIFI-2205] Update Cluster Shell
[NIFI-2217] fix single node and cluster link
[NIFI-2219] Fix styles on provenance cluster search combo
[NIFI-2180] Fix settings shell table text alignment for run status
[NIFI-2140] Update preview image for Change Color dialog
[NIFI-2131] update progress bars/percent complete to use angular material progress linear directive
[NIFI-2099] add header text to all ok and yes/no dialogs
[NIFI-2233] fix invalid/warning icon shifts position as tasks are added
[NIFI-2131] update progress bars/percent complete
[NIFI-2140] Update preview image for label. This closes #627


Project: http://git-wip-us.apache.org/repos/asf/nifi/repo
Commit: http://git-wip-us.apache.org/repos/asf/nifi/commit/8db89c8c
Tree: http://git-wip-us.apache.org/repos/asf/nifi/tree/8db89c8c
Diff: http://git-wip-us.apache.org/repos/asf/nifi/diff/8db89c8c

Branch: refs/heads/master
Commit: 8db89c8c0b2d8e8c0c2948e92866992337f01194
Parents: e0c9679
Author: Scott Aslan <ja...@hortonworks.com>
Authored: Mon Jul 11 10:11:38 2016 -0400
Committer: Matt Gilman <ma...@gmail.com>
Committed: Tue Jul 12 23:33:21 2016 -0400

----------------------------------------------------------------------
 .../nifi-framework/nifi-web/nifi-web-ui/pom.xml |  4 ++
 .../resources/filters/provenance.properties     |  6 +-
 .../main/webapp/WEB-INF/pages/provenance.jsp    | 10 +++-
 .../partials/canvas/fill-color-dialog.jsp       | 10 +---
 .../partials/cluster/cluster-content.jsp        |  2 +-
 .../nifi-web-ui/src/main/webapp/css/cluster.css | 50 ++++-------------
 .../src/main/webapp/css/counters.css            |  1 -
 .../nifi-web-ui/src/main/webapp/css/dialog.css  | 39 +------------
 .../src/main/webapp/css/provenance.css          |  6 --
 .../nifi-web-ui/src/main/webapp/css/summary.css | 13 ++---
 .../slickgrid/css/slick-default-theme.css       |  8 +++
 .../nf-ng-canvas-operate-controller.js          |  3 +-
 .../src/main/webapp/js/nf/canvas/nf-actions.js  | 17 +-----
 .../main/webapp/js/nf/canvas/nf-canvas-utils.js |  5 +-
 .../webapp/js/nf/canvas/nf-component-state.js   |  1 +
 .../js/nf/canvas/nf-connection-configuration.js | 12 +++-
 .../main/webapp/js/nf/canvas/nf-connection.js   |  1 +
 .../js/nf/canvas/nf-controller-service.js       |  7 ++-
 .../js/nf/canvas/nf-controller-services.js      |  4 +-
 .../main/webapp/js/nf/canvas/nf-custom-ui.js    |  2 +-
 .../main/webapp/js/nf/canvas/nf-draggable.js    |  2 +
 .../js/nf/canvas/nf-port-configuration.js       |  2 +-
 .../nf/canvas/nf-process-group-configuration.js |  1 +
 .../js/nf/canvas/nf-processor-configuration.js  |  4 +-
 .../webapp/js/nf/canvas/nf-queue-listing.js     | 19 ++-----
 .../nf-remote-process-group-configuration.js    |  2 +-
 .../src/main/webapp/js/nf/canvas/nf-settings.js | 12 ++--
 .../src/main/webapp/js/nf/cluster/nf-cluster.js | 59 +++++++++++++++++---
 .../js/nf/provenance/nf-provenance-lineage.js   | 16 +-----
 .../js/nf/provenance/nf-provenance-table.js     | 23 ++------
 .../webapp/js/nf/provenance/nf-provenance.js    | 20 +++++++
 .../webapp/js/nf/summary/nf-summary-table.js    |  6 +-
 32 files changed, 171 insertions(+), 196 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/pom.xml
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/pom.xml b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/pom.xml
index c09bd8a..4d2f4be 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/pom.xml
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/pom.xml
@@ -434,6 +434,10 @@
                                                 <include>${staging.dir}/js/nf/nf-dialog.js</include>
                                                 <include>${staging.dir}/js/nf/nf-storage.js</include>
                                                 <include>${staging.dir}/js/nf/nf-ajax-setup.js</include>
+                                                <include>${staging.dir}/js/nf/nf-ng-bridge.js</include>
+                                                <include>${staging.dir}/js/nf/nf-ng-service-provider.js</include>
+                                                <include>${staging.dir}/js/nf/nf-ng-app-config.js</include>
+                                                <include>${staging.dir}/js/nf/nf-ng-app-controller.js</include>
                                                 <include>${staging.dir}/js/nf/provenance/nf-provenance.js</include>
                                                 <include>${staging.dir}/js/nf/provenance/nf-provenance-table.js</include>
                                                 <include>${staging.dir}/js/nf/provenance/nf-provenance-lineage.js</include>

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance.properties
index 8536bf9..c0fe613 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance.properties
@@ -20,7 +20,11 @@ nf.provenance.script.tags=<script type="text/javascript" src="js/nf/nf-common.js
 <script type="text/javascript" src="js/nf/nf-ajax-setup.js?${project.version}"></script>\n\
 <script type="text/javascript" src="js/nf/provenance/nf-provenance.js?${project.version}"></script>\n\
 <script type="text/javascript" src="js/nf/provenance/nf-provenance-table.js?${project.version}"></script>\n\
-<script type="text/javascript" src="js/nf/provenance/nf-provenance-lineage.js?${project.version}"></script>
+<script type="text/javascript" src="js/nf/provenance/nf-provenance-lineage.js?${project.version}"></script>\n\
+<script type="text/javascript" src="js/nf/nf-ng-bridge.js?${project.version}"></script>\n\
+<script type="text/javascript" src="js/nf/nf-ng-service-provider.js?${project.version}"></script>\n\
+<script type="text/javascript" src="js/nf/nf-ng-app-controller.js?${project.version}"></script>\n\
+<script type="text/javascript" src="js/nf/nf-ng-app-config.js?${project.version}"></script>
 nf.provenance.style.tags=<link rel="stylesheet" href="css/reset.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/main.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/banner.css?${project.version}" type="text/css" />\n\

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/provenance.jsp
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/provenance.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/provenance.jsp
index 9c15371..0228056 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/provenance.jsp
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/provenance.jsp
@@ -54,10 +54,18 @@
         <script type="text/javascript" src="js/jquery/slickgrid/slick.dataview.js"></script>
         <script type="text/javascript" src="js/jquery/slickgrid/slick.core.js"></script>
         <script type="text/javascript" src="js/jquery/slickgrid/slick.grid.js"></script>
+        <script type="text/javascript" src="assets/angular/angular.min.js"></script>
+        <script type="text/javascript" src="assets/angular-messages/angular-messages.min.js"></script>
+        <script type="text/javascript" src="assets/angular-resource/angular-resource.min.js"></script>
+        <script type="text/javascript" src="assets/angular-route/angular-route.min.js"></script>
+        <script type="text/javascript" src="assets/angular-aria/angular-aria.min.js"></script>
+        <script type="text/javascript" src="assets/angular-animate/angular-animate.min.js"></script>
+        <script type="text/javascript" src="assets/angular-material/angular-material.min.js"></script>
         <script type="text/javascript" src="js/nf/nf-namespace.js?${project.version}"></script>
+        <script type="text/javascript" src="js/nf/nf-ng-namespace.js?${project.version}"></script>
         ${nf.provenance.script.tags}
     </head>
-    <body>
+    <body ng-controller="ngProvenanceAppCtrl">
         <jsp:include page="/WEB-INF/partials/message-pane.jsp"/>
         <jsp:include page="/WEB-INF/partials/banners-utility.jsp"/>
         <jsp:include page="/WEB-INF/partials/ok-dialog.jsp"/>

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/fill-color-dialog.jsp
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/fill-color-dialog.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/fill-color-dialog.jsp
index 04844a7..6e7346f 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/fill-color-dialog.jsp
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/fill-color-dialog.jsp
@@ -28,15 +28,7 @@
             </div>
             <div class="setting-name" style="margin-top: 10px;">Preview</div>
             <div class="setting-field">
-                <div id="fill-color-processor-preview">
-                    <div id="fill-color-processor-preview-name">Processor</div>
-                    <div id="fill-color-processor-preview-icon"></div>
-                    <div class="clear"></div>
-                    <div id="fill-color-processor-preview-stats">
-                        <div id="fill-color-processor-preview-stats-label"></div>
-                        <div class="clear"></div>
-                    </div>
-                </div>
+                <div id="fill-color-processor-preview" class="icon icon-processor"></div>
                 <div id="fill-color-label-preview">
                     <div id="fill-color-label-preview-value">Label</div>
                 </div>

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/cluster/cluster-content.jsp
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/cluster/cluster-content.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/cluster/cluster-content.jsp
index 68c4da2..392642c 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/cluster/cluster-content.jsp
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/cluster/cluster-content.jsp
@@ -18,7 +18,7 @@
 <div id="cluster">
     <div id="cluster-header-and-filter">
         <div id="cluster-header-text">NiFi Cluster</div>
-        <div id="cluster-filter-controls" class="filter-controls">
+        <div id="cluster-filter-controls">
             <div id="cluster-filter-stats" class="filter-status">
                 Displaying&nbsp;<span id="displayed-nodes"></span>&nbsp;of&nbsp;<span id="total-nodes"></span>
             </div>

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css
index 612a147..dad9bc4 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/cluster.css
@@ -22,12 +22,15 @@
     position: absolute;
     top: 0px;
     bottom: 0px;
-    left: 0px;
-    right: 0px;
-    height: 90%;
+    left: 20px;
+    right: 20px;
     overflow: auto;
 }
 
+#cluster-header-and-filter {
+    height: 98px;
+}
+
 #cluster-header-text {
     font-size: 18px;
     font-weight: bold;
@@ -40,6 +43,7 @@
     position: absolute;
     width: 100%;
     bottom: 0px;
+    left: 20px;
 }
 
 #cluster-loading-container {
@@ -59,44 +63,14 @@
     padding-top: 10px;
 }
 
-#refresh-button {
-    height: 24px;
-    width: 26px;
-    float: left;
-}
-
-/* filter controls */
-
-#cluster-filter-controls {
-    float: right;
-}
-
-#cluster-filter-container {
-    height: 32px;
-    width: 318px;
-}
-
-#cluster-filter {
-    width: 173px;
-    margin-right: 3px;
-    float: left;
-}
-
-input.cluster-filter-list {
-    color: #888;
-}
-
-#cluster-filter-type {
-    width: 120px;
-    float: left;
-}
-
 /* counters table */
 
 #cluster-table {
-    overflow: hidden;
-    height: 80%;
-    width: 100%;
+    position: absolute;
+    top: 98px;
+    left: 0px;
+    bottom: 47px;
+    right: 0px;
     min-height: 150px;
 }
 

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/counters.css
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/counters.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/counters.css
index 65e6597..b2f0e77 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/counters.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/counters.css
@@ -24,7 +24,6 @@
     bottom: 0px;
     left: 20px;
     right: 20px;
-    height: 100%;
     overflow: auto;
 }
 

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
index 51e1dff..5d4f781 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
@@ -33,44 +33,7 @@
 }
 
 #fill-color-processor-preview {
-    width: 173px;
-    height: 56px;
-    font-weight: bold;
-    border-width: 1px;
-    border-style: solid;
-}
-
-#fill-color-processor-preview-name {
-    margin-left: 5px;
-    margin-top: 5px;
-    float: left;
-}
-
-#fill-color-processor-preview-icon {
-    margin-top: 5px;
-    margin-right: 5px;
-    float: right;
-    background-image: url(../images/iconSmallProcessor.png);
-    width: 14px;
-    height: 14px;
-}
-
-#fill-color-processor-preview-stats {
-    margin-top: 1px;
-    margin-left: 5px;
-    float: left;
-    border: 1px solid #6f97ac;
-    background-color: #ffffff;
-    height: 30px;
-    width: 161px;
-}
-
-#fill-color-processor-preview-stats-label {
-    float: left;
-    background: linear-gradient(to bottom, #30505c, #6f97ac);
-    filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr=#30505c, endColorstr=#6f97ac);
-    height: 30px;
-    width: 30px;
+    font-size: 64px;
 }
 
 #fill-color-label-preview {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css
index b80c06d..b9f7888 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/provenance.css
@@ -173,12 +173,6 @@ div.searchable-field-value {
     display: none;
 }
 
-#provenance-search-location {
-    height: 18px;
-    line-height: 18px;
-    width: 424px;
-}
-
 /* event details dialog */
 
 div.flowfile-container {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/summary.css
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/summary.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/summary.css
index 483a024..a7e234a 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/summary.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/summary.css
@@ -61,22 +61,17 @@
     padding-top: 10px;
 }
 
-div.status-text {
-    padding-left: 4px;
-    line-height: normal;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
 /* view options */
 
 #view-options-container {
     display: none;
-    float: right;
-    margin-top: 12px;
     font-family: Roboto;
     font-size: 13px;
     font-weight: normal;
+    position: absolute;
+    top: 50px;
+    right: 0px;
+    z-index: 1;
 }
 
 /* view single node dialog */

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/slickgrid/css/slick-default-theme.css
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/slickgrid/css/slick-default-theme.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/slickgrid/css/slick-default-theme.css
index 653e097..c9b0d68 100755
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/slickgrid/css/slick-default-theme.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/slickgrid/css/slick-default-theme.css
@@ -156,4 +156,12 @@ classes should alter those!
     border-right: 1px solid #c7d2d7;
     border-bottom: 1px solid #c7d2d7;
     padding: 0px 2px 6px 10px;
+}
+
+div.status-text {
+    padding-left: 4px;
+    line-height: normal;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    float: left;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-operate-controller.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-operate-controller.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-operate-controller.js
index 5d68462..d860d52 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-operate-controller.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-operate-controller.js
@@ -385,7 +385,8 @@ nf.ng.Canvas.OperateCtrl = function () {
                                 $('#fill-color-value').val(hex);
 
                                 // always update the preview
-                                $('#fill-color-processor-preview, #fill-color-label-preview').css({
+                                $('#fill-color-processor-preview').css('color', hex);
+                                $('#fill-color-label-preview').css({
                                     'border-color': hex,
                                     'background': 'linear-gradient(to bottom, #ffffff, ' + hex + ')',
                                     'filter': 'progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr=#ffffff, endColorstr=' + hex + ')'

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-actions.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-actions.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-actions.js
index f0f606b..aa99cf7 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-actions.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-actions.js
@@ -30,21 +30,11 @@ nf.Actions = (function () {
      * Initializes the drop request status dialog.
      */
     var initializeDropRequestStatusDialog = function () {
-        // initialize the drop requst progress bar
-        var dropRequestProgressBar = $('#drop-request-percent-complete').progressbar();
-
         // configure the drop request status dialog
         $('#drop-request-status-dialog').modal({
             scrollableContentStyle: 'scrollable',
             handler: {
                 close: function () {
-                    // reset the progress bar
-                    dropRequestProgressBar.find('div.progress-label').remove();
-
-                    // update the progress bar
-                    var label = $('<div class="progress-label"></div>').text('0%');
-                    dropRequestProgressBar.progressbar('value', 0).append(label);
-
                     // clear the current button model
                     $('#drop-request-status-dialog').modal('setButtonModel', []);
                 }
@@ -918,13 +908,12 @@ nf.Actions = (function () {
                         // remove existing labels
                         var progressBar = $('#drop-request-percent-complete');
                         progressBar.find('div.progress-label').remove();
+                        progressBar.find('md-progress-linear').remove();
 
                         // update the progress bar
                         var label = $('<div class="progress-label"></div>').text(percentComplete + '%');
-                        if (percentComplete > 0) {
-                            label.css('margin-top', '-19px');
-                        }
-                        progressBar.progressbar('value', percentComplete).append(label);
+                        (nf.ng.Bridge.injector.get('$compile')($('<md-progress-linear ng-cloak ng-value="' + percentComplete + '" class="md-hue-2" md-mode="determinate" aria-label="Drop request percent complete"></md-progress-linear>'))(nf.ng.Bridge.rootScope)).appendTo(progressBar);
+                        progressBar.append(label);
                     };
 
                     // update the button model of the drop request status dialog

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-utils.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-utils.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-utils.js
index 47ab0f9..8411841 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-utils.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-utils.js
@@ -1260,7 +1260,10 @@ nf.CanvasUtils = (function () {
             
             // if the group id is null, we're already in the top most group
             if (groupId === null) {
-                nf.Dialog.showOkDialog('Components are already in the topmost group.');
+                nf.Dialog.showOkDialog({
+                    headerText: 'Process Group',
+                    dialogContent: 'Components are already in the topmost group.'
+                });
             } else {
                 moveComponents(components, groupId);
             }

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/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 fd57303..f311842 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
@@ -270,6 +270,7 @@ nf.ComponentState = (function () {
                         }).fail(nf.Common.handleAjaxError);
                     } else {
                         nf.Dialog.showOkDialog({
+                            headerText: 'Component State',
                             dialogContent: 'This component has no state to clear.'
                         });
                     }

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection-configuration.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection-configuration.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection-configuration.js
index 0878a54..81e9dc7 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection-configuration.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection-configuration.js
@@ -78,6 +78,7 @@ nf.ConnectionConfiguration = (function () {
                                     } else {
                                         // inform users that no relationships were selected
                                         nf.Dialog.showOkDialog({
+                                            headerText: 'Connection Configuration',
                                             dialogContent: 'The connection must have at least one relationship selected.'
                                         });
                                     }
@@ -106,6 +107,7 @@ nf.ConnectionConfiguration = (function () {
                     } else {
                         // there are no relationships for this processor
                         nf.Dialog.showOkDialog({
+                            headerText: 'Connection Configuration',
                             dialogContent: '\'' + nf.Common.escapeHtml(processor.name) + '\' does not support any relationships.'
                         });
 
@@ -320,6 +322,7 @@ nf.ConnectionConfiguration = (function () {
                 } else {
                     // there are no output ports for this process group
                     nf.Dialog.showOkDialog({
+                        headerText: 'Connection Configuration',
                         dialogContent: '\'' + nf.Common.escapeHtml(processGroup.name) + '\' does not have any output ports.'
                     });
 
@@ -398,6 +401,7 @@ nf.ConnectionConfiguration = (function () {
                 } else {
                     // there are no relationships for this processor
                     nf.Dialog.showOkDialog({
+                        headerText: 'Connection Configuration',
                         dialogContent: '\'' + nf.Common.escapeHtml(remoteProcessGroup.name) + '\' does not have any output ports.'
                     });
 
@@ -545,6 +549,7 @@ nf.ConnectionConfiguration = (function () {
                 } else {
                     // there are no relationships for this processor
                     nf.Dialog.showOkDialog({
+                        headerText: 'Connection Configuration',
                         dialogContent: '\'' + nf.Common.escapeHtml(processGroup.name) + '\' does not have any input ports.'
                     });
 
@@ -622,6 +627,7 @@ nf.ConnectionConfiguration = (function () {
                 } else {
                     // there are no relationships for this processor
                     nf.Dialog.showOkDialog({
+                        headerText: 'Connection Configuration',
                         dialogContent: '\'' + nf.Common.escapeHtml(remoteProcessGroup.name) + '\' does not have any input ports.'
                     });
 
@@ -987,6 +993,7 @@ nf.ConnectionConfiguration = (function () {
             }).fail(function (xhr, status, error) {
                 if (xhr.status === 400 || xhr.status === 404 || xhr.status === 409) {
                     nf.Dialog.showOkDialog({
+                        headerText: 'Connection Configuration',
                         dialogContent: nf.Common.escapeHtml(xhr.responseText),
                     });
                 } else {
@@ -1043,8 +1050,8 @@ nf.ConnectionConfiguration = (function () {
 
         if (errors.length > 0) {
             nf.Dialog.showOkDialog({
-                dialogContent: nf.Common.formatUnorderedList(errors),
-                headerText: 'Configuration Error'
+                headerText: 'Connection Configuration',
+                dialogContent: nf.Common.formatUnorderedList(errors)
             });
             return false;
         } else {
@@ -1354,6 +1361,7 @@ nf.ConnectionConfiguration = (function () {
                                     } else {
                                         // inform users that no relationships were selected and the source is a processor
                                         nf.Dialog.showOkDialog({
+                                            headerText: 'Connection Configuration',
                                             dialogContent: 'The connection must have at least one relationship selected.'
                                         });
 

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection.js
index f559e96..b85f8c7 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-connection.js
@@ -1198,6 +1198,7 @@ nf.Connection = (function () {
         }).fail(function (xhr, status, error) {
             if (xhr.status === 400 || xhr.status === 404 || xhr.status === 409) {
                 nf.Dialog.showOkDialog({
+                    headerText: 'Connection',
                     dialogContent: nf.Common.escapeHtml(xhr.responseText)
                 });
             } else {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-service.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-service.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-service.js
index 5e3899a..7735b73 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-service.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-service.js
@@ -46,7 +46,7 @@ nf.ControllerService = (function () {
 
             nf.Dialog.showOkDialog({
                 dialogContent: content,
-                headerText: 'Configuration Error'
+                headerText: 'Controller Service'
             });
         } else {
             nf.Common.handleAjaxError(xhr, status, error);
@@ -1238,7 +1238,7 @@ nf.ControllerService = (function () {
             // inform the user if the action was canceled
             if (canceled === true && $('#nf-ok-dialog').not(':visible')) {
                 nf.Dialog.showOkDialog({
-                    headerText: 'Action Canceled',
+                    headerText: 'Controller Service',
                     dialogContent: 'The request to disable has been canceled. Parts of this request may have already completed. Please verify the state of this service and all referencing components.'
                 });
             }
@@ -1275,6 +1275,7 @@ nf.ControllerService = (function () {
         // ensure appropriate access
         if (scope === config.serviceAndReferencingComponents && hasUnauthorized) {
             nf.Dialog.showOkDialog({
+                headerText: 'Controller Service',
                 dialogContent: 'Unable to enable due to unauthorized referencing components.'
             });
             return;
@@ -1381,7 +1382,7 @@ nf.ControllerService = (function () {
             // inform the user if the action was canceled
             if (canceled === true && $('#nf-ok-dialog').not(':visible')) {
                 nf.Dialog.showOkDialog({
-                    headerText: 'Action Canceled',
+                    headerText: 'Controller Service',
                     dialogContent: 'The request to enable has been canceled. Parts of this request may have already completed. Please verify the state of this service and all referencing components.'
                 });
             }

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-services.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-services.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-services.js
index 665cb14..e76e488 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-services.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-controller-services.js
@@ -546,8 +546,8 @@ nf.ControllerServices = (function () {
             }
 
             // format the markup
-            var formattedValue = '<div class="' + icon + '" style="margin-top: 5px;"></div>';
-            return formattedValue + '<div class="status-text" style="margin-top: 2px; margin-left: 4px; float: left;">' + label + '</div>';
+            var formattedValue = '<div layout="row"><div class="' + icon + '" style="margin-top: 5px;"></div>';
+            return formattedValue + '<div class="status-text" style="margin-top: 4px;">' + label + '</div></div>';
         };
 
         var controllerServiceActionFormatter = function (row, cell, value, columnDef, dataContext) {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-custom-ui.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-custom-ui.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-custom-ui.js
index 00e0e4f..fafc76f 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-custom-ui.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-custom-ui.js
@@ -52,7 +52,7 @@ nf.CustomUi = {
                 });
             }).fail(function () {
                 nf.Dialog.showOkDialog({
-                    headerText: 'Configuration',
+                    headerText: 'Advanced Configuration',
                     dialogContent: 'Unable to generate access token for accessing the advanced configuration dialog.'
                 });
                 deferred.resolve();

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-draggable.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-draggable.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-draggable.js
index 486b2b8..8919ece 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-draggable.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-draggable.js
@@ -76,6 +76,7 @@ nf.Draggable = (function () {
                 }).fail(function (xhr, status, error) {
                     if (xhr.status === 400 || xhr.status === 404 || xhr.status === 409) {
                         nf.Dialog.showOkDialog({
+                            headerText: 'Component Position',
                             dialogContent: nf.Common.escapeHtml(xhr.responseText)
                         });
                     } else {
@@ -129,6 +130,7 @@ nf.Draggable = (function () {
                 }).fail(function (xhr, status, error) {
                     if (xhr.status === 400 || xhr.status === 404 || xhr.status === 409) {
                         nf.Dialog.showOkDialog({
+                            headerText: 'Component Position',
                             dialogContent: nf.Common.escapeHtml(xhr.responseText)
                         });
                     } else {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-configuration.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-configuration.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-configuration.js
index dfe2241..a50ff19 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-configuration.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-port-configuration.js
@@ -96,7 +96,7 @@ nf.PortConfiguration = (function () {
 
                                 nf.Dialog.showOkDialog({
                                     dialogContent: content,
-                                    headerText: 'Configuration Error'
+                                    headerText: 'Port Configuration'
                                 });
                             } else {
                                 // close the details panel

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-configuration.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-configuration.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-configuration.js
index d27a46a..7701950 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-configuration.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-process-group-configuration.js
@@ -80,6 +80,7 @@ nf.ProcessGroupConfiguration = (function () {
 
             // show the result dialog
             nf.Dialog.showOkDialog({
+                headerText: 'Process Group Configuration',
                 dialogContent: 'Process group configuration successfully saved.'
             });
 

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js
index 86c5228..120f05c 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-processor-configuration.js
@@ -98,7 +98,7 @@ nf.ProcessorConfiguration = (function () {
 
             nf.Dialog.showOkDialog({
                 dialogContent: content,
-                headerText: 'Configuration Error'
+                headerText: 'Processor Configuration'
             });
         } else {
             nf.Common.handleAjaxError(xhr, status, error);
@@ -358,7 +358,7 @@ nf.ProcessorConfiguration = (function () {
         if (errors.length > 0) {
             nf.Dialog.showOkDialog({
                 dialogContent: nf.Common.formatUnorderedList(errors),
-                headerText: 'Configuration Error'
+                headerText: 'Processor Configuration'
             });
             return false;
         } else {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/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 8486bdb..24d7495 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
@@ -36,22 +36,12 @@ nf.QueueListing = (function () {
      * Initializes the listing request status dialog.
      */
     var initializeListingRequestStatusDialog = function () {
-        // initialize the listing request progress bar
-        var listingRequestProgressBar = $('#listing-request-percent-complete').progressbar();
-
         // configure the drop request status dialog
         $('#listing-request-status-dialog').modal({
             scrollableContentStyle: 'scrollable',
             headerText: 'Queue Listing',
             handler: {
                 close: function () {
-                    // reset the progress bar
-                    listingRequestProgressBar.find('div.progress-label').remove();
-
-                    // update the progress bar
-                    var label = $('<div class="progress-label"></div>').text('0%');
-                    listingRequestProgressBar.progressbar('value', 0).append(label);
-
                     // clear the current button model
                     $('#listing-request-status-dialog').modal('setButtonModel', []);
                 }
@@ -248,13 +238,12 @@ nf.QueueListing = (function () {
                 // remove existing labels
                 var progressBar = $('#listing-request-percent-complete');
                 progressBar.find('div.progress-label').remove();
+                progressBar.find('md-progress-linear').remove();
 
-                // update the progress bar
+                // update the progress
                 var label = $('<div class="progress-label"></div>').text(percentComplete + '%');
-                if (percentComplete > 0) {
-                    label.css('margin-top', '-24px');
-                }
-                progressBar.progressbar('value', percentComplete).append(label);
+                (nf.ng.Bridge.injector.get('$compile')($('<md-progress-linear ng-cloak ng-value="' + percentComplete + '" class="md-hue-2" md-mode="determinate" aria-label="Searching Queue"></md-progress-linear>'))(nf.ng.Bridge.rootScope)).appendTo(progressBar);
+                progressBar.append(label);
             };
 
             // update the button model of the drop request status dialog

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-configuration.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-configuration.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-configuration.js
index 63ded6b..6eea7a7 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-configuration.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-remote-process-group-configuration.js
@@ -79,7 +79,7 @@ nf.RemoteProcessGroupConfiguration = (function () {
 
                                     nf.Dialog.showOkDialog({
                                         dialogContent: content,
-                                        headerText: 'Configuration'
+                                        headerText: 'Remote Process Group Configuration'
                                     });
                                 } else {
                                     nf.Common.handleAjaxError(xhr, status, error);

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/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 7ba7213..8db7bf9 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
@@ -596,7 +596,7 @@ nf.Settings = (function () {
             var markup = '<div title="View Details" class="pointer view-reporting-task fa fa-info-circle" style="margin-top: 5px; float: left;" ></div>';
 
             // always include a button to view the usage
-            markup += '<div title="Usage" class="pointer reporting-task-usage fa fa-book" style="margin-left: 3px; margin-top: 5px;"></div>';
+            markup += '<div title="Usage" class="pointer reporting-task-usage fa fa-book" style="margin-left: 6px; margin-top: 5px; float: left;"></div>';
 
             var hasErrors = !nf.Common.isEmpty(dataContext.component.validationErrors);
             var hasBulletins = !nf.Common.isEmpty(dataContext.bulletins);
@@ -622,16 +622,20 @@ nf.Settings = (function () {
             }
 
             // determine the appropriate label
-            var label;
+            var icon = '', label = '';
             if (!nf.Common.isEmpty(dataContext.component.validationErrors)) {
                 label = 'Invalid';
+                icon = 'invalid fa fa-warning';
             } else {
                 if (dataContext.component.state === 'STOPPED') {
                     label = 'Stopped';
+                    icon = 'fa fa-stop';
                 } else if (dataContext.component.state === 'RUNNING') {
                     label = 'Running';
+                    icon = 'fa fa-play';
                 } else {
                     label = 'Disabled';
+                    icon = 'icon icon-enable-false';
                 }
             }
 
@@ -642,8 +646,8 @@ nf.Settings = (function () {
             }
 
             // format the markup
-            var formattedValue = '<div class="' + nf.Common.escapeHtml(label.toLowerCase()) + '" style="margin-top: 3px;"></div>';
-            return formattedValue + '<div class="status-text" style="margin-top: 2px; margin-left: 4px; float: left;">' + nf.Common.escapeHtml(label) + '</div><div style="float: left; margin-left: 4px;">' + nf.Common.escapeHtml(activeThreadCount) + '</div>';
+            var formattedValue = '<div layout="row"><div class="' + icon + '" style="margin-top: 3px;"></div>';
+            return formattedValue + '<div class="status-text" style="margin-top: 4px;">' + nf.Common.escapeHtml(label) + '</div><div style="float: left; margin-left: 4px;">' + nf.Common.escapeHtml(activeThreadCount) + '</div></div>';
         };
 
         var reportingTaskActionFormatter = function (row, cell, value, columnDef, dataContext) {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/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 ae672bb..5577f14 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
@@ -20,12 +20,6 @@
 $(document).ready(function () {
     // initialize the counters page
     nf.Cluster.init();
-
-    //alter styles if we're not in the shell
-    if (top === window) {
-        $('#cluster').css('margin', 40);
-        $('#cluster-refresh-container').css('margin', 40);
-    }
 });
 
 nf.Cluster = (function () {
@@ -129,8 +123,22 @@ nf.Cluster = (function () {
                 nf.ClusterTable.loadClusterTable().done(function () {
                     // once the table is initialized, finish initializing the page
                     initializeClusterPage().done(function () {
-                        // configure the initial grid height
-                        nf.ClusterTable.resetTableSize();
+                        var setBodySize = function () {
+                            //alter styles if we're not in the shell
+                            if (top === window) {
+                                $('body').css({
+                                    'height': $(window).height() + 'px',
+                                    'width': $(window).width() + 'px'
+                                });
+
+                                $('#cluster').css('margin', 40);
+                                $('#cluster-table').css('bottom', 127);
+                                $('#cluster-refresh-container').css('margin', 40);
+                            }
+
+                            // configure the initial grid height
+                            nf.ClusterTable.resetTableSize();
+                        };
 
                         // get the about details
                         $.ajax({
@@ -145,6 +153,41 @@ nf.Cluster = (function () {
                             document.title = countersTitle;
                             $('#counters-header-text').text(countersTitle);
                         }).fail(nf.Common.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){
+                                        dialog.modal('resize');
+                                    }, 50, $(dialogs[i]));
+                                }
+                            }
+
+                            // 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){
+                                        gridElement.data('gridInstance').resizeCanvas();
+                                    }, 50, $(gridElements[j]));
+                                }
+                            }
+
+                            // toggle tabs .scrollable when appropriate
+                            var tabsContainers = $('.tab-container');
+                            var tabsContents = [];
+                            for (var k = 0, len = tabsContainers.length; k < len; k++) {
+                                if ($(tabsContainers[k]).is(':visible')){
+                                    tabsContents.push($('#' + $(tabsContainers[k]).attr('id') + '-content'));
+                                }
+                            }
+                            $.each(tabsContents, function (index, tabsContent) {
+                                nf.Common.toggleScrollable(tabsContent.get(0));
+                            });
+                        });
                     });
                 });
             });

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-lineage.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-lineage.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-lineage.js
index a1317e4..119ef51 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-lineage.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance-lineage.js
@@ -34,24 +34,10 @@ nf.ProvenanceLineage = (function () {
      * Initializes the lineage query dialog.
      */
     var initLineageQueryDialog = function () {
-        // initialize the progress bar
-        $('#lineage-percent-complete').progressbar();
-
         // initialize the dialog
         $('#lineage-query-dialog').modal({
             scrollableContentStyle: 'scrollable',
-            headerText: 'Computing FlowFile lineage...',
-            handler: {
-                close: function () {
-                    // reset the progress bar
-                    var lineageProgressBar = $('#lineage-percent-complete');
-                    lineageProgressBar.find('div.progress-label').remove();
-
-                    // update the progress bar
-                    var label = $('<div class="progress-label"></div>').text('0%');
-                    lineageProgressBar.progressbar('value', 0).append(label);
-                }
-            }
+            headerText: 'Computing FlowFile lineage...'
         });
     };
 

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/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 b68d7d0..f6bbbcd 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
@@ -461,24 +461,10 @@ nf.ProvenanceTable = (function () {
      * Initializes the provenance query dialog.
      */
     var initProvenanceQueryDialog = function () {
-        // initialize the progress bar
-        $('#provenance-percent-complete').progressbar();
-
         // initialize the dialog
         $('#provenance-query-dialog').modal({
             scrollableContentStyle: 'scrollable',
-            headerText: 'Searching provenance events...',
-            handler: {
-                close: function () {
-                    // reset the progress bar
-                    var provenanceProgressBar = $('#provenance-percent-complete');
-                    provenanceProgressBar.find('div.progress-label').remove();
-
-                    // update the progress bar
-                    var label = $('<div class="progress-label"></div>').text('0%');
-                    provenanceProgressBar.progressbar('value', 0).append(label);
-                }
-            }
+            headerText: 'Searching provenance events...'
         });
     };
 
@@ -1088,13 +1074,12 @@ nf.ProvenanceTable = (function () {
         updateProgress: function (progressBar, value) {
             // remove existing labels
             progressBar.find('div.progress-label').remove();
+            progressBar.find('md-progress-linear').remove();
 
             // update the progress bar
             var label = $('<div class="progress-label"></div>').text(value + '%');
-            if (value > 0) {
-                label.css('margin-top', '-19px');
-            }
-            progressBar.progressbar('value', value).append(label);
+            (nf.ng.Bridge.injector.get('$compile')($('<md-progress-linear ng-cloak ng-value="' + value + '" class="md-hue-2" md-mode="determinate" aria-label="Progress"></md-progress-linear>'))(nf.ng.Bridge.rootScope)).appendTo(progressBar);
+            progressBar.append(label);
         },
 
         /**

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance.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.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance.js
index f1ac3b9..2e57e1b 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/provenance/nf-provenance.js
@@ -18,6 +18,26 @@
 /* global nf, top */
 
 $(document).ready(function () {
+    //Create Angular App
+    var app = angular.module('ngProvenanceApp', ['ngResource', 'ngRoute', 'ngMaterial', 'ngMessages']);
+
+    //Define Dependency Injection Annotations
+    nf.ng.AppConfig.$inject = ['$mdThemingProvider', '$compileProvider'];
+    nf.ng.AppCtrl.$inject = ['$scope', 'serviceProvider'];
+    nf.ng.ServiceProvider.$inject = [];
+
+    //Configure Angular App
+    app.config(nf.ng.AppConfig);
+
+    //Define Angular App Controllers
+    app.controller('ngProvenanceAppCtrl', nf.ng.AppCtrl);
+
+    //Define Angular App Services
+    app.service('serviceProvider', nf.ng.ServiceProvider);
+
+    //Manually Boostrap Angular App
+    nf.ng.Bridge.injector = angular.bootstrap($('body'), ['ngProvenanceApp'], { strictDi: true });
+
     // initialize the status page
     nf.Provenance.init();
 });

http://git-wip-us.apache.org/repos/asf/nifi/blob/8db89c8c/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 623ae8a..3788e42 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
@@ -293,8 +293,8 @@ nf.SummaryTable = (function () {
                 default:
                     classes += '';
             }
-            var formattedValue = '<div class="' + classes + '"></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>';
+            var formattedValue = '<div layout="row"><div class="' + classes + '"></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></div>';
         };
 
         // define the input, read, written, and output columns (reused between both tables)
@@ -2287,7 +2287,7 @@ nf.SummaryTable = (function () {
         }
         storage.appendTo(storageUsageContainer);
 
-        (nf.ng.Bridge.injector.get('$compile')($('<md-progress-linear class="md-hue-2" value="' + (used/total)*100 + '" aria-label="FlowFile Repository Storage Usage"></md-progress-linear>'))(nf.ng.Bridge.rootScope)).appendTo(storageUsageContainer);
+        (nf.ng.Bridge.injector.get('$compile')($('<md-progress-linear class="md-hue-2" md-mode="determinate" value="' + (used/total)*100 + '" aria-label="FlowFile Repository Storage Usage"></md-progress-linear>'))(nf.ng.Bridge.rootScope)).appendTo(storageUsageContainer);
 
         var usageDetails = $('<div class="storage-usage-details"></div>').text(' (' + storageUsage.usedSpace + ' of ' + storageUsage.totalSpace + ')').prepend($('<b></b>').text(Math.round((used/total)*100) + '%'));
         $('<div class="storage-usage-header"></div>').append(usageDetails).append('<div class="clear"></div>').appendTo(storageUsageContainer);