Added a "page loading" image.

vasl_templates/webapp/static/help/index.html

@@ -15,6 +15,8 @@
     <div style="margin:1em;"> Javascript is disabled. Please enable it, then reload this page. </div>
 </noscript>
 
+<img id="loader" src='images/loader.gif' style="position:fixed;top:50%;left:50%;margin-top:-16px;margin-left:-16px;">
+
 <!-- ----------------------------------------------------------------- -->
 
 <div id="helptabs" style="display:none;">

vasl_templates/webapp/static/help/main.js

@@ -38,7 +38,8 @@ $(document).ready( function() {
         $( "#helptabs li:eq(0)" ).remove() ;
         $( "#helptabs-installation" ).remove() ;
     }
-    $("#helptabs").tabs().show() ;
+    $("#loader").fadeOut( 500 ) ;
+    $("#helptabs").tabs().fadeIn( 500 ) ;
     $("#helptabs .ui-tabs-nav a").click( function() { $(this).blur() ; } ) ;
 
     // check if we should auto-select a tab

vasl_templates/webapp/static/main.js

@@ -375,8 +375,9 @@ function update_page_load_status( id )
     if ( gPageLoadStatus.length === 0 ) {
         // yup - update the UI
         $("#tabs").tabs({ disabled: [] }) ;
+        $("#loader").fadeOut( 500 ) ;
         adjust_footer_vspacers() ;
-        // NOTE: The wtermark image appears briefly in IE when reloading the page, but not even
+        // NOTE: The watermark image appears briefly in IE when reloading the page, but not even
         // creating the watermark dynamically and removing it when the page unloads fixes it :-(
         $("#watermark").fadeIn( 5*1000 ) ;
         // notify the test suite

vasl_templates/webapp/templates/index.html

@@ -20,6 +20,8 @@
     <div style="margin:1em;"> Javascript is disabled. Please enable it, then reload this page. </div>
 </noscript>
 
+<img id="loader" src="{{url_for('static',filename='images/loader.gif')}}" style="position:fixed;top:50%;left:50%;margin-top:-16px;margin-left:-16px;z-index:999;">
+
 <!-- ----------------------------------------------------------------- -->
 
 <div id="menu" style="display:none;">
@@ -45,7 +47,6 @@
 <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
 
 <div id="tabs-scenario">
-
 <div class="left">
 
     <fieldset name="scenario" class="tl" style="display:none;"> <legend>S<u>c</u>enario</legend>