NIFI-655:

- Showing a logging in notification during the log in process.

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/login.jsp

@@ -45,6 +45,7 @@
             <jsp:include page="/WEB-INF/partials/login/login-form.jsp"/>
             <jsp:include page="/WEB-INF/partials/login/nifi-registration-form.jsp"/>
             <jsp:include page="/WEB-INF/partials/login/login-submission.jsp"/>
+            <jsp:include page="/WEB-INF/partials/login/login-progress.jsp"/>
         </div>
         <jsp:include page="/WEB-INF/partials/ok-dialog.jsp"/>
         <div id="faded-background"></div>

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/login/login-progress.jsp

@@ -0,0 +1,22 @@
+<%--
+ Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+--%>
+<%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %>
+<div id="login-progress-container" class="login-container hidden">
+    <div id="login-progress-spinner" class="loading-container ajax-loading"></div>
+    <div id="login-progress-label">Logging in...</div>
+    <div class="clear"></div>
+</div>

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/login/login-submission.jsp

@@ -15,6 +15,6 @@
   limitations under the License.
 --%>
 <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %>
-<div id="login-submission-container" class="hidden">
+<div id="login-submission-container" class="login-container hidden">
     <div id="login-submission-button" class="button">Log in</div>
 </div>

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/login/nifi-registration-form.jsp

@@ -15,7 +15,7 @@
   limitations under the License.
 --%>
 <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %>
-<div id="nifi-registration-container" class="hidden">
+<div id="nifi-registration-container" class="login-container hidden">
     <div id="nifi-registration-title" class="login-title nifi-submit-justification">Submit Justification</div>
     <div id="nifi-user-submit-justification-container" class="nifi-submit-justification">
         <div class="setting">

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/login.css

@@ -56,14 +56,14 @@ body.login-body input, body.login-body textarea {
     width: 400px;
 }
 
+div.login-container {
+    width: 412px;
+}
+
 /*
     NiFi Registration
 */
 
-#nifi-registration-container {
-    width: 412px;
-}
-
 #nifi-user-submit-justification-container {
     margin-bottom: 10px;
 }
@@ -77,13 +77,19 @@ body.login-body input, body.login-body textarea {
 }
 
 /*
-    Submission
+    Login Progress
 */
 
-#login-submission-container {
+#login-progress-label {
-    width: 412px;
+    float: right;
+    font-weight: bold;
+    line-height: 16px;
 }
 
-#login-submission-button {
+#login-progress-spinner {
-    
+    float: right;
+    width: 16px;
+    height: 16px;
+    background-color: transparent;
+    margin-left: 3px;
 }

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/login/nf-login.js

@@ -87,6 +87,10 @@ nf.Login = (function () {
     };
 
     var login = function () {
+        // show the logging message...
+        $('#login-progress-container').show();
+        $('#login-submission-container').hide();
+        
         // login submit
         $.ajax({
             type: 'POST',
@@ -119,6 +123,10 @@ nf.Login = (function () {
                     // show the registration form
                     initializeNiFiRegistration();
                     showNiFiRegistration();
+                    
+                    // update the form visibility
+                    $('#login-submission-container').show();
+                    $('#login-progress-container').hide();
                 } else {
                     // reload as appropriate - no need to schedule token refresh as the page is reloading
                     if (top !== window) {
@@ -139,6 +147,10 @@ nf.Login = (function () {
                 if (xhr.status === 401) {
                     initializeNiFiRegistration();
                     showNiFiRegistration();
+                    
+                    // update the form visibility
+                    $('#login-submission-container').show();
+                    $('#login-progress-container').hide();
                 } else {
                     $('#login-message-title').text('Unable to log in');
                     $('#login-message').text(xhr.responseText);
@@ -146,6 +158,7 @@ nf.Login = (function () {
                     // update visibility
                     $('#login-container').hide();
                     $('#login-submission-container').hide();
+                    $('#login-progress-container').hide();
                     $('#login-message-container').show();
                 }
             });
@@ -155,6 +168,10 @@ nf.Login = (function () {
                     dialogContent: nf.Common.escapeHtml(xhr.responseText),
                     overlayBackground: false
                 });
+                
+                // update the form visibility
+                $('#login-submission-container').show();
+                $('#login-progress-container').hide();
             } else {
                 $('#login-message-title').text('Unable to log in');
                 $('#login-message').text(xhr.responseText);
@@ -162,6 +179,7 @@ nf.Login = (function () {
                 // update visibility
                 $('#login-container').hide();
                 $('#login-submission-container').hide();
+                $('#login-progress-container').hide();
                 $('#login-message-container').show();
             }
         });
@@ -194,12 +212,8 @@ nf.Login = (function () {
         });
     };
 
-    var logout = function () {
-        nf.Storage.removeItem('jwt');
-    };
-
     var showLogoutLink = function () {
-        $('#user-logout-container').show();
+        nf.Common.showLogoutLink();
     };
 
     return {

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-common.js

@@ -424,11 +424,7 @@ nf.Common = (function () {
          * Closes the canvas by removing the splash screen and stats poller.
          */
         closeCanvas: function () {
-            if (nf.Storage.getItem('jwt') === null) {
+            nf.Common.showLogoutLink();
-                $('#user-logout-container').hide();
-            } else {
-                $('#user-logout-container').show();
-            }
             
             // ensure this javascript has been loaded in the nf canvas page
             if (nf.Common.isDefinedAndNotNull(nf.Canvas)) {
@@ -446,6 +442,17 @@ nf.Common = (function () {
             }
         },
 
+        /**
+         * Shows the logout link if appropriate.
+         */
+        showLogoutLink: function () {
+            if (nf.Storage.getItem('jwt') === null) {
+                $('#user-logout-container').hide();
+            } else {
+                $('#user-logout-container').show();
+            }
+        },
+
         /**
          * Populates the specified field with the specified value. If the value is 
          * undefined, the field will read 'No value set.' If the value is an empty