Added a spinner message to the submission steps

edivorce/apps/core/static/css/main.scss

@@ -2338,7 +2338,7 @@ div#progress-overlay {
 	left: 0;
 	right: 0;
 	z-index: 10000;
-	background: rgba(0,0,0,0.35);
+	background: rgba(0,0,0,0.5);
 }
 
 div#progress-overlay-spinner {
@@ -2349,6 +2349,27 @@ div#progress-overlay-spinner {
 	right: 0;
 	z-index: 5000;
 }
+
+div#progress-overlay-message {
+	top: calc(50% + 55px); 
+	position: absolute; 
+	width: 100%;
+	padding-left: 60px;
+	padding-right: 60px;
+
+	& > div {
+		margin-left: auto; 
+		margin-right: auto; 
+		color: #e9e9e9; 
+		line-height: 1.0;
+		text-shadow: 2px 2px #333; 
+		text-align: center; 
+		font-size: 36px;
+		text-transform: uppercase;
+	}
+
+}
+
 /* Prequalification hard-stop indicator */
 span.hard-stop {
 	font-size: 2.8em;

edivorce/apps/core/static/js/filing.js

@@ -35,7 +35,8 @@ $(window).ready(function () {
             errorBox.hide();
             // show the spinner overlay
             $('div#progress-overlay').show();
-            $('div#progress-overlay-spinner').spin('large');            
+            $('div#progress-overlay-message').show();
+            $('div#progress-overlay-spinner').spin('xlarge');            
         }
     });
 });

edivorce/apps/core/static/js/vendor/spin.min.js

@@ -42,6 +42,7 @@
     tiny:  { lines:  8, length: 2, width: 2, radius: 3 }
   , small: { lines:  8, length: 4, width: 3, radius: 5 }
   , large: { lines: 10, length: 8, width: 4, radius: 8 }
+  , xlarge: { lines: 16, length: 25, width: 6, radius: 18 }
   }
 
 }));

edivorce/apps/core/templates/base.html

@@ -167,7 +167,14 @@
             </div>
         </footer>
 
-        <div id="progress-overlay" style="display: none"><div id="progress-overlay-spinner"></div></div>
+        <div id="progress-overlay" style="display: none">
+            <div id="progress-overlay-spinner"></div>
+            <div id="progress-overlay-message" style="display: none">
+                <div>
+                    Please wait.  Submission may take several minutes.
+                </div>
+            </div>
+        </div>
 
 {% if request.user.is_authenticated and not request.user.has_accepted_terms and request.path != '/current' %}
         <div id="terms_modal" class="modal" tabindex="-1" role="dialog" data-backdrop="static">