From 77c4e8a2e20ace72a88bcada608be89dd588f49a Mon Sep 17 00:00:00 2001
From: Étienne Loks <etienne.loks@peacefrogs.net>
Date: Sat, 25 Aug 2012 03:17:56 +0200
Subject: Improvement in route display and parsing

---
 chimere/route.py                              | 25 +++++++++++---
 chimere/static/chimere/css/styles.css         | 47 +++++++++++++++------------
 chimere/static/chimere/js/jquery.chimere.js   | 11 +++++--
 chimere/static/chimere/js/nominatim-widget.js |  7 ++--
 chimere/templates/chimere/blocks/routing.html |  8 +++++
 chimere/views.py                              | 11 ++++---
 chimere/widgets.py                            | 10 ++++--
 7 files changed, 84 insertions(+), 35 deletions(-)

diff --git a/chimere/route.py b/chimere/route.py
index bc08a39..9c8b59c 100644
--- a/chimere/route.py
+++ b/chimere/route.py
@@ -67,7 +67,7 @@ class RoutinoRouter(Router):
         p.communicate()
         ds = DataSource(tmp_dir + 'shortest-track.gpx')
         if not ds:
-            return [], None
+            return [], None, None
         layer = ds[0]
         trk_layer = None
         for layer in ds:
@@ -83,10 +83,27 @@ class RoutinoRouter(Router):
         for line in open(tmp_dir + 'shortest.html').readlines():
             if [True for r in self.re_desc if r.match(line)]:
                 desc.append(BeautifulSoup(line).prettify())
-        desc = ['<table>'] + desc[1:-2] + [desc[-1], '</table>']
-        desc = BeautifulSoup('\n'.join(desc)).prettify()
+        total = self.webify(desc[-1])
+        desc = desc[1:-2]
+        # very fragile piece of code but only break the numerotation
+        number_tpl = '<tr class="n"><span class="number">%d.</span>'
+        desc = [re.sub('<tr class="n">', number_tpl % (idx/2+1), d)
+                        if idx % 2 else d
+                        for idx, d in enumerate(desc)]
+        desc = self.webify(BeautifulSoup('\n'.join(desc)).prettify())
+        desc = re.sub("  \[", "", desc)
+        desc = re.sub("  \]", "", desc)
         shutil.rmtree(tmp_dir)
-        return res, desc
+        return res, desc, total
+
+    @staticmethod
+    def webify(lbl):
+        lbl = re.sub("<td", "<span", lbl)
+        lbl = re.sub("</td>", "</span>", lbl)
+        lbl = re.sub("</tr>", "</div>", lbl)
+        lbl = re.sub("<tr", "<div", lbl)
+        return lbl
+
 router = None
 if settings.CHIMERE_ROUTING_ENGINE['ENGINE'] == 'routino':
     router = RoutinoRouter()
diff --git a/chimere/static/chimere/css/styles.css b/chimere/static/chimere/css/styles.css
index 188cc3b..ecdd70c 100644
--- a/chimere/static/chimere/css/styles.css
+++ b/chimere/static/chimere/css/styles.css
@@ -26,6 +26,14 @@ h2, h3, th, .action li, .action li a,
     color:#333;
 }
 
+.nominatim-widget{
+    color:#aaa;
+}
+
+#chimere_total_label td.l{
+    color:#000;
+}
+
 /* background-color definition */
 
 body, h2, h3, th,
@@ -46,6 +54,7 @@ fieldset, .action li, #content,
 #welcome, #detail, .detail_footer a,
 #content .olControlLayerSwitcher .layersDiv,
 #content .olControlLayerSwitcher span,
+#chimere_total_label td.l,
 #main-map, .window{
     background-color:#FFF;
 }
@@ -157,7 +166,6 @@ h3{
 
 h4, caption{
     font-weight:normal;
-    font-style:italic;
     margin:0;
     text-align:left;
 }
@@ -433,15 +441,20 @@ ul#share li{
     margin:0.5em;
 }
 
+#total_label_div{
+    margin:5px 0;
+}
+
 .itinerary_label{
     font-size:0.9em;
     padding-top:0.5em;
-     font-style:italic;
+    font-style:italic;
 }
 
-.itinerary_label.label{
-  font-style:normal;
-  font-weight:bold;
+.itinerary_label .label{
+    font-style:normal;
+    font-weight:bold;
+    padding:3px 8px;
 }
 
 
@@ -451,29 +464,19 @@ ul#share li{
     margin-top:10px;
 }
 
-#chimere_itinerary_content table
-{
-    border-collapse:collapse;
-}
-
-#chimere_itinerary_content table td{
-    border:1px solid #333;
-}
-
-#chimere_itinerary_content td.l{
+#chimere_itinerary_content span.l{
     padding:5px;
     width:60px;
 }
 
-#chimere_itinerary_content td.r{
-    font-size:0.8em;
-    padding:0.8em;
-}
-
 #chimere_itinerary_content span.j{
     font-style:italic;
 }
 
+#chimere_itinerary_content .number{
+    font-weight:bold;
+}
+
 #chimere_itinerary_content span.t,
 #chimere_itinerary_content span.b
 {
@@ -518,6 +521,10 @@ ul#share li{
     height:2.8em;
 }
 
+.nominatim-widget{
+    font-style:italic;
+}
+
 .simple #panel{
     top:5px;
 }
diff --git a/chimere/static/chimere/js/jquery.chimere.js b/chimere/static/chimere/js/jquery.chimere.js
index c1d028c..6e0fa25 100644
--- a/chimere/static/chimere/js/jquery.chimere.js
+++ b/chimere/static/chimere/js/jquery.chimere.js
@@ -560,7 +560,10 @@ OpenLayers.Layer.MapQuestOSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
                                       settings.icon_end);
                 settings.layerRouteMarker.addMarker(settings.routing_end);
             }
-            if (settings.routing_end && settings.routing_start) methods.route();
+            if (settings.routing_end && settings.routing_start
+                && $('#search_routing').length) {
+                $('#search_routing').button('enable');
+            }
         },
 
         // set the start point for routing
@@ -621,11 +624,12 @@ OpenLayers.Layer.MapQuestOSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
             $('#nominatim_end_lat').val('');
             $('#nominatim_end_label').html('');
             $('#chimere_end_label').html('');
-            $('.nominatim-widget').val('');
+            $('.nominatim-widget').val(default_nominatim_lbl);
             $('#chimere_map_menu').hide();
             $('#map_menu_clear').hide();
             $('#chimere_itinerary').hide();
             $('#chimere_itinerary_form').show();
+            if($('#search_routing').length) $('#search_routing').button('disable');
             settings.layerRoute.removeAllFeatures();
             settings.layerRouteMarker.clearMarkers();
             settings.routing_start = null;
@@ -635,6 +639,7 @@ OpenLayers.Layer.MapQuestOSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
 
         // display a route
         route: function(){
+            if($('#search_routing').length) $('#search_routing').button('enable');
             if (!settings.routing_start || !settings.routing_end){
                 return;
             }
@@ -666,6 +671,8 @@ OpenLayers.Layer.MapQuestOSM = OpenLayers.Class(OpenLayers.Layer.XYZ, {
                         settings.map.zoomToExtent(
                                 settings.layerRoute.getDataExtent());
                         settings.map.zoomOut();
+                        $('#chimere_total_label').html(
+                                            data.properties.total);
                         $('#chimere_itinerary_content').html(
                                             data.properties.description);
                         $('#chimere_itinerary').show();
diff --git a/chimere/static/chimere/js/nominatim-widget.js b/chimere/static/chimere/js/nominatim-widget.js
index fea654d..e925cf2 100644
--- a/chimere/static/chimere/js/nominatim-widget.js
+++ b/chimere/static/chimere/js/nominatim-widget.js
@@ -1,4 +1,4 @@
-
+var default_nominatim_lbl = '';
 $(function(){
     $(".nominatim-widget").autocomplete({
            source: function (request, response) {
@@ -15,7 +15,8 @@ $(function(){
                                   value: item.display_name,
                                   lat: item.lat,
                                   lon: item.lon
-                              }}));
+                                }
+                              }));
 
                           }
                       })
@@ -27,7 +28,7 @@ $(function(){
                 $('#'+$(this).attr('id')+'_lon').val(ui.item.lon);
                 $('#'+$(this).attr('id')+'_label').html(ui.item.label);
                 $('#chimere_'+$(this).attr('id').substring(10)+'_label').html(ui.item.label);
-                $('#'+$(this).attr('id')).val('');
+                $('#'+$(this).attr('id')).val(default_nominatim_lbl);
                 jQuery("#map").chimere("routingInputChange");
                 return false;
             },
diff --git a/chimere/templates/chimere/blocks/routing.html b/chimere/templates/chimere/blocks/routing.html
index 4948a1c..639fd18 100644
--- a/chimere/templates/chimere/blocks/routing.html
+++ b/chimere/templates/chimere/blocks/routing.html
@@ -11,6 +11,7 @@
     {% if field.label %}<p><label for='{{field.auto_id}}'>{{ field.label }}</label></p>{%endif%}
     <p>{{field}}</p>
     {% endfor %}
+    <span id='search_routing'>{% trans "Search" %}</span>
     </div>
     <div id='chimere_itinerary'>
         <div id='chimere_itinerary_action'>
@@ -23,6 +24,9 @@
                 </li>
             </ul>
         </div>
+        <div class='itinerary_label' id='total_label_div'>
+            <span id='chimere_total_label'></span>
+        </div>
         <div class='itinerary_label'>
             <span class='label'>{% trans "Start:"%}</span> <span id='chimere_start_label'></span></div>
         <div id='chimere_itinerary_content'>
@@ -41,6 +45,7 @@ $(document).ready(function() {
             height: 360,
             resizable: false
     });
+    $('#search_routing').button({'disabled':true});
     $('#routing_button').click(function(){
         $('#chimere_itinerary_panel').dialog('open');
     });
@@ -51,6 +56,9 @@ $(document).ready(function() {
     $('#chimere_itinerary_new').click(function(){
         $('#map').chimere('routingClear');
     });
+    $('#search_routing').click(function(){
+        $('#map').chimere('route');
+    });
 });
 </script>
 {% endif%}
diff --git a/chimere/views.py b/chimere/views.py
index c71b4eb..c8097a1 100644
--- a/chimere/views.py
+++ b/chimere/views.py
@@ -653,13 +653,16 @@ def route(request, area_name, lon1, lat1, lonlat_steps, lon2, lat2,
         steps = [(steps[i*2], steps[i*2+1]) for i in range(len(steps)/2)]
     except ValueError:
         return HttpResponse('no results')
-    jsons, desc = router.route(lon1, lat1, lon2, lat2, steps=steps,
-                               transport=transport)
+    jsons, desc, total = router.route(lon1, lat1, lon2, lat2, steps=steps,
+                                      transport=transport)
     if not jsons:
         return HttpResponse('no results')
     jsonencoder = simplejson.JSONEncoder()
-    data = '{"properties":{"description":%s}, "type": "FeatureCollection",'\
-           '"features":[%s]}' % (jsonencoder.encode(desc), ",".join(jsons))
+    total = jsonencoder.encode(total)
+    desc = jsonencoder.encode(desc)
+    data = '{"properties":{"total":%s, "description":%s}, '\
+           '"type": "FeatureCollection", "features":[%s]}' % (total, desc,
+                                                              ",".join(jsons))
     return HttpResponse(data)
 
 def rss(request, area_name=''):
diff --git a/chimere/widgets.py b/chimere/widgets.py
index b520fcd..23095c7 100644
--- a/chimere/widgets.py
+++ b/chimere/widgets.py
@@ -166,12 +166,18 @@ class NominatimWidget(forms.TextInput):
         tpl = u"""
 <input type='hidden' name='nominatim_%(id)s_lat' id='nominatim_%(id)s_lat'/>
 <input type='hidden' name='nominatim_%(id)s_lon' id='nominatim_%(id)s_lon'/>
-<input type='text' class='nominatim-widget' name='nominatim_%(id)s' id='nominatim_%(id)s'/>
+<input type='text' class='nominatim-widget' name='nominatim_%(id)s' id='nominatim_%(id)s' value=""/>
 <label class='nominatim-label' id='nominatim_%(id)s_label'>&nbsp;</label>
 <script type='text/javascript'>
+var default_nominatim_lbl = "%(label)s";
 var nominatim_url = "%(nominatim_url)s";
+$("#nominatim_%(id)s").val(default_nominatim_lbl);
+$("#nominatim_%(id)s").click(function(){
+    $("#nominatim_%(id)s").val('');
+});
 </script>
-""" % {'id':name, 'nominatim_url':settings.NOMINATIM_URL}
+""" % {'id':name, 'nominatim_url':settings.NOMINATIM_URL,
+       'label':_(u"Street, City, Country")}
         return mark_safe(tpl)
 
 class PointChooserWidget(forms.TextInput):
-- 
cgit v1.2.3