From 512751c9bf026277d58e4a1cb904b444287d8cd2 Mon Sep 17 00:00:00 2001
From: Étienne Loks <etienne.loks@peacefrogs.net>
Date: Tue, 25 Sep 2012 12:37:49 +0200
Subject: Main map: add a waiting image while loading markers/routes on the map

---
 chimere/static/chimere/css/styles.css       | 20 ++++++++++++++++++++
 chimere/static/chimere/js/jquery.chimere.js |  4 ++++
 chimere/templates/chimere/blocks/map.html   |  5 +++++
 chimere/templatetags/chimere_tags.py        |  3 ++-
 4 files changed, 31 insertions(+), 1 deletion(-)

diff --git a/chimere/static/chimere/css/styles.css b/chimere/static/chimere/css/styles.css
index f8ed3fe..336f6e2 100644
--- a/chimere/static/chimere/css/styles.css
+++ b/chimere/static/chimere/css/styles.css
@@ -596,6 +596,26 @@ table.inline-table td input[type=file]{
 }
 
 
+#waiting{ /* Fixed position to provide the vertical offset */
+    position:fixed;
+    top:40%;
+    width:100%;
+    z-index:40002;
+    display:none;
+}
+
+#waiting-content {
+    width:33px;
+    position:relative;
+    margin:0 auto;
+    background-color:white;
+    padding:10px;
+    border:1px solid black;
+}
+
+
+
+
 /* openlayer customisation */
 .olControlPermalink {
     display: block;
diff --git a/chimere/static/chimere/js/jquery.chimere.js b/chimere/static/chimere/js/jquery.chimere.js
index 9ec51e6..7ad3a9b 100644
--- a/chimere/static/chimere/js/jquery.chimere.js
+++ b/chimere/static/chimere/js/jquery.chimere.js
@@ -229,6 +229,7 @@ OpenLayers.Layer.MapQuestOSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
         * Load markers and route from DB
         */
         loadGeoObjects: function () {
+            if($('#waiting').length){$('#waiting').show();}
             helpers.retrieve_checked_categories();
             var ids = settings.checked_categories.join('_');
             if (!ids) ids = '0';
@@ -251,6 +252,9 @@ OpenLayers.Layer.MapQuestOSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
                     error: function (data) {
                         settings.layerMarkers.clearMarkers();
                         settings.layerVectors.removeAllFeatures();
+                    },
+                    complete: function () {
+                        if($('#waiting').length){$('#waiting').hide();}
                     }
                 });
         },
diff --git a/chimere/templates/chimere/blocks/map.html b/chimere/templates/chimere/blocks/map.html
index 7855bbf..6eeb7a5 100644
--- a/chimere/templates/chimere/blocks/map.html
+++ b/chimere/templates/chimere/blocks/map.html
@@ -3,6 +3,11 @@
 <script type="text/javascript">
    $("#{{map_id}}").show();
 </script>
+<div id="waiting">
+    <div id="waiting-content">
+        <img src='{{STATIC_URL}}chimere/img/ajax-loader.gif'/>
+    </div>
+</div>
 <script type="text/javascript">
     {% if single_category %}
     $(function() {$('#panel').hide()});{% endif %}
diff --git a/chimere/templatetags/chimere_tags.py b/chimere/templatetags/chimere_tags.py
index 538f0fa..637767e 100644
--- a/chimere/templatetags/chimere_tags.py
+++ b/chimere/templatetags/chimere_tags.py
@@ -113,7 +113,8 @@ def head_chimere(context):
 
 @register.inclusion_tag('chimere/blocks/map.html', takes_context=True)
 def map(context, map_id='map'):
-    context_data =  {'map_id':map_id}
+    context_data =  {'map_id':map_id,
+                     "STATIC_URL": settings.STATIC_URL}
     context_data['icon_offset_x'] = settings.CHIMERE_ICON_OFFSET_X
     context_data['icon_offset_y'] = settings.CHIMERE_ICON_OFFSET_Y
     context_data['icon_width'] = settings.CHIMERE_ICON_WIDTH
-- 
cgit v1.2.3