Added spinner image while loading data.

r738 www/trunk

www/index.html.de

@@ -176,5 +176,6 @@
 	<div class="rublogo"><a href="http://www.gmg.ruhr-uni-bochum.de/geophysik/seisobs"><img class="rublogo" src="logo_RUB_155x30.png" alt="Ruhr-Universität Bochum" title="Ruhr-Universität Bochum" border="0"/></a></div>
 	<!-- Map --> 
 	<div id="map" class="map"></div>
+	<div id="spinner" class="spinner" style="display:none;"><img id="img-spinner" src="spinner.gif" alt="Loading"/></br>Loading ...</div>
 </body>
 </html>

www/main.css

@@ -87,4 +87,16 @@
 	p.table-caption {
 		font-size: smaller;
 	}
+	div.spinner {
+	    position: fixed;
+	    top: 50%;
+	    left: 50%;
+	    margin-left: -64px; /* half width of the spinner gif */
+	    margin-top: -8px; /* half height of the spinner gif */
+	    text-align:center;
+	    z-index: 19000;
+	    overflow: auto;
+	    width: 128px; /* width of the spinner gif */
+	    height: 40px; /*hight of the spinner gif +2px to fix IE8 issue */
+	}	
 </style>

www/misc.js

@@ -192,4 +192,12 @@ $(document).ready(function() {
 		heightStyle: 'content',
 		animate: 200,
 	});
+        // spinner
+        $(document).bind("ajaxSend", function() {
+                $("#spinner").show();
+                console.log('Starting Spinner at '+Date());
+        }).bind("ajaxStop", function() {
+                $("#spinner").hide();
+                console.log('Stopping Spinner at '+Date());
+        });
 });