added feedback to reload button

4 files changed, 47 insertions, 10 deletions

diff --git a/data.php b/data.php
index b5c0b51..8f26a68 100644
--- a/data.php
+++ b/data.php
@@ -141,11 +141,11 @@ foreach ($links as $link)
 }

 echo "</links>\n";

 

-echo "<count>\n";

+echo "<counts>\n";

 printf("\t" . '<count number="');

 echo sizeof($count);

 printf('" />' . "\n");

-echo "</count>\n";

+echo "</counts>\n";

 

 echo "</root>";

 

diff --git a/index.php b/index.php
index 82fe779..f255816 100644
--- a/index.php
+++ b/index.php
@@ -45,11 +45,16 @@ if(empty($marker)) $marker="online";
         <tr><td align="center"><img src="./img/link_blue.png" /></td><td>&nbsp;</td><td>Tunnel</td></tr>

       </table>

     </div>

+    <div id="countbox" class="box">

+    </div>

     <div id="visibox" class="box">

       <b>Elemente<br />ausblenden</b>

       <form name="visibleform">

         <table class="legend">

-          <tr><td><input type="checkbox" name="offline" value="true" onclick="javascript:toggleVisible('offline')" <?php if($marker == "online") printf(' checked="checked"'); ?> ></td><td>&nbsp;</td><td>Offline</td></tr>

+          <tr>

+            <td><input type="checkbox" name="offline" value="true" onclick="javascript:toggleVisible('offline')" <?php if($marker == "online") printf(' checked="checked"'); ?> ></td>

+            <td>&nbsp;</td><td><img src="./img/marker_offline.png" /> Offline</td>

+          </tr>

         </table>

       </from>

     </div>

diff --git a/map.css b/map.css
index a197481..f203e98 100644
--- a/map.css
+++ b/map.css
@@ -32,6 +32,19 @@ div.box {
   top: 4em;
 }
 
+#countbox {
+  position: absolute;
+  top: 20em;
+  right: 10px;
+  font-weight: bold;
+}
+
+#visibox {
+  position: absolute;
+  top: 24em;
+  right: 10px;
+}
+
 #addressbox {
   position: absolute;
   right: 10px;
@@ -53,12 +66,6 @@ div.box {
   text-align: center;
 }
 
-#visibox {
-  position: absolute;
-  top: 20em;
-  right: 10px;
-}
-
 div.btn {
   color: #0000cc;
   background-color: white;
diff --git a/map.js b/map.js
index 553ba9e..75e9bc6 100644
--- a/map.js
+++ b/map.js
@@ -1,11 +1,13 @@
 var map = null;
 var physicalMaxLevel;
 var geocoder = null;
+var countboxText = null;
 var overlays = new Array();
 overlays["newmarker"] = null;
 overlays["ruler"] = new Array();
 overlays["locations"] = new Array();
 var locations = new Array();
+var reloadcon = null;
 
 function initialize(lat, lng, res) {
   if (!checkBrowser()) {
@@ -27,7 +29,8 @@ function initialize(lat, lng, res) {
     map.setZoom(res);
   }
   map.addControl(new RulerControl());
-  map.addControl(new ReloadControl());
+  reloadcon = new ReloadControl();
+  map.addControl(reloadcon);
   map.addControl(new GSmallMapControl(), new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(10,20)));
   map.addControl(new GMapTypeControl(), new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(50,10)));
 
@@ -43,6 +46,12 @@ function initialize(lat, lng, res) {
 
   geocoder = new GClientGeocoder();
 
+  var countbox = document.getElementById("countbox");
+  countboxText = document.createTextNode("Aktiv: 0");
+  countbox.appendChild(countboxText);
+
+  document.getElementById("map").style.cursor = "wait";
+  reloadcon.started();
   GDownloadUrl("data.php", onData);
 }
 
@@ -94,6 +103,7 @@ function onMapClick(overlay, point)
 
 function onData(data, responseCode) {
   if (responseCode < 200 || responseCode > 299) {
+    reloadcon.finished();
     return alert("Fehler: Konnte die Daten nicht laden!\n(Server Antwort-Code: " + responseCode + ")");
   }
   xmlData = GXml.parse(data);
@@ -104,6 +114,12 @@ function onData(data, responseCode) {
   overlays["locations"] = [];
   locations = [];
   drawLocations(xmlData);
+
+  var element = xmlData.getElementsByTagName("count");
+  var count = element[0].getAttribute("number");
+  countboxText.data = "Aktiv: " + count;
+  
+  reloadcon.finished();
 }
 
 function drawLocations(xmlData) {
@@ -263,6 +279,7 @@ ReloadControl.prototype.initialize = function(map) {
   btnText = document.createTextNode("Daten neu laden");
   btnDiv.appendChild(btnText);
   GEvent.addDomListener(btnDiv, "click", function() {
+      reloadcon.started(); 
       GDownloadUrl("data.php", onData);
     });
 
@@ -270,6 +287,14 @@ ReloadControl.prototype.initialize = function(map) {
   return container;
 }
 
+ReloadControl.prototype.started = function() {
+  btnText.data = "wird geladen...";
+}
+
+ReloadControl.prototype.finished = function() {
+  btnText.data = "Daten neu laden";
+}
+
 ReloadControl.prototype.getDefaultPosition = function() {
   return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 7));
 }