stat page added for stop mapping sprint and merged

README

@@ -1,5 +1,6 @@
 Note: If running postgres 9.1 and Django < 1.4, you will probably need this patch for things to work: https://code.djangoproject.com/raw-attachment/ticket/16778/postgis-adapter-2.patch . Reasons are explained here: http://stackoverflow.com/questions/7667724/error-saving-geodjango-pointfield
 
+Don't forget to install python-psycopg2 and python-gdal for the sake of GeoDjango.
 
 chaloBEST
 

chaloBEST/imports/make_slugs.py

@@ -2,6 +2,11 @@ from django.template.defaultfilters import slugify
 from mumbai.models import *
 
 
+def clear_slugs():
+    for cls in [Road, Area, Stop]:
+        for obj in cls.objects.all():
+            obj.slug = ''
+            obj.save()
 
 def do():
     for cls in [Road, Area, Stop]:

chaloBEST/mumbai/models.py

@@ -147,8 +147,9 @@ class Stop(models.Model):
                 a.delete()
             for a in data['alternative_names'].split(","):
                 alt_name = AlternativeName()
-                alt_name.name = a['name']
+                alt_name.name = a
                 alt_name.typ = 'common'
+                alt_name.content_object = self
                 alt_name.save()
                 self.alt_names.add(alt_name)    
             

chaloBEST/static/css/editstops.css

@@ -1,6 +1,7 @@
 html, body {
     width: 100%;
     height: 100%;
+    font-family: Arial, Helvetica, Verdana, sans-serif;
 }
 
 #wrapper {
@@ -38,6 +39,7 @@ html, body {
 
 .listItem {
     cursor: pointer;
+    font-size: 13px;
 }
 
 .tabButton {
@@ -49,12 +51,19 @@ html, body {
     padding: 4px;
 }
 
+
+.listItemText {
+    display: block;
+}
+
 .selectedListItem .listItemText {
-    color: blue;
+    background: #ccc;
 }
 
 .selectedStop {
-    color: blue !important;
+    background: #ffff00;
+    color: #666 !important;
+    font-weight: bold;
 }
 
 .clear {
@@ -66,15 +75,37 @@ html, body {
 }
 
 .no_has_point {
-    color: #666;
+    color: #ff8282;
 }
 
 ul {
     list-style-type: none;
-    padding-left: 4px;
+    padding: 4px;
+    font-size: 12px;
 }
 
 .highlightedStop {
     background-color: #FFFF00;
 }
 
+#formCol {
+    font-size: 13px;
+    padding: 4px;
+}
+
+#formCol div {
+    margin-bottom: 4px;
+}
+
+.stopSlug {
+    font-style: italic;
+}
+
+#stopForm label {
+    margin-top: 12px;
+    display: block;
+}
+
+#stopForm input {
+    width: 90%;
+}

chaloBEST/static/js/editstops.js

@@ -43,10 +43,19 @@ var API_BASE = "/1.0/",
             if ($target.data("loading")) {
                 return;
             }
-            $('.selectedListItem').find(".stopsList").hide();
+            if ($target.hasClass("selectedListItem")) {
+                $target.find(".stopsList").hide().remove();
+                $target.removeClass("selectedListItem");
+                return;
+            }
+            $('.selectedListItem').find(".stopsList").hide().remove();
             $('.selectedListItem').removeClass("selectedListItem");
             $target.addClass("selectedListItem");
             if ($target.data("hasList")) {
+                var $stopsList = $target.find(".stopsList"); 
+                $stopsList.slideDown();
+                return;
+                /*
                 var $stopsList = $target.find(".stopsList"); 
                 if (!$stopsList.is(":visible")) {
                     $stopsList.slideDown();    
@@ -55,6 +64,7 @@ var API_BASE = "/1.0/",
                     $target.removeClass("selectedListItem");
                 }
                 return;
+                */         
             } 
             var url = API_BASE + name + "/" + $target.find(".listItemText").text();
             $target.data("loading", true);
@@ -70,14 +80,17 @@ var API_BASE = "/1.0/",
                         stopsWithGeom.push(v);
                     }    
                 });
+
                 stopsGeojson.features = stopsWithGeom;
                 var currFeatures = jsonLayer.features;
                 jsonLayer.removeFeatures(currFeatures);
-                jsonLayer.addFeatures(geojson_format.read(stopsGeojson));
+                if (stopsWithGeom.length !== 0) {
-                var maxExtent = jsonLayer.getDataExtent();
+                    jsonLayer.addFeatures(geojson_format.read(stopsGeojson));
-                map.zoomToExtent(maxExtent);                
+                    var maxExtent = jsonLayer.getDataExtent();
+                    map.zoomToExtent(maxExtent);                                                                
+                }                
                 $target.append($stopsList);
-                $target.data("hasList", true);
+                // $target.data("hasList", true);
                 $target.data("loading", false);
             });
         });
@@ -120,6 +133,7 @@ var API_BASE = "/1.0/",
                 }
                 
                 $('#formCol').find("#stopForm").remove();
+                $('#formCol').empty();
                 $('#formCol').append($form);
             });
 
@@ -141,13 +155,17 @@ var API_BASE = "/1.0/",
 
     function getStopForm(stop, geom) {
     //    console.log(stop);
-        console.log(geom);
+    //    console.log(geom);
         var lon = !$.isEmptyObject(geom) ? geom.coordinates[0] : '';
         var lat = !$.isEmptyObject(geom) ? geom.coordinates[1] : '';
         var $div = $('<div />');
-        var $displayName = $('<div />').text(stop.display_name).appendTo($div);
+        var $displayName = $('<h2 />').text(stop.display_name).appendTo($div);
+        var $slug = $('<div />').addClass("stopSlug").text(stop.slug).appendTo($div);
+        var $road = $("<div />").addClass("stopRoad").text("Road: " + stop.road).appendTo($div);
         var $routes = $('<div />').text("Routes: " + stop.routes).appendTo($div); 
+//        var $formLabel = $("<div />").text("Edit:").appendTo($div);
         var $form = $('<form />').attr("id", "stopForm").appendTo($div);
+        var $display_name_label = $('<label />').attr("for", "displayName").text("Display Name:").appendTo($form);;        
         var $display_name_input = $('<input />')
             .val(stop.display_name)
             .attr("id", "displayName")
@@ -155,6 +173,8 @@ var API_BASE = "/1.0/",
                 $form.submit();
              })
             .appendTo($form);
+        $('<br />').appendTo($form);
+        var $name_mr_label = $('<label />').attr("for", "displayNameMr").text("Marathi Name:").appendTo($form);
         var $name_mr_input = $('<input />')
             .val(stop.name_mr)
             .attr("id", "displayNameMr")
@@ -162,6 +182,8 @@ var API_BASE = "/1.0/",
                 $form.submit();
             })
             .appendTo($form);
+        $('<br />').appendTo($form);
+        var $alt_names_label = $('<label />').attr("for", "altNames").text("Alternative Names:").appendTo($form);
         var $alt_names_input = $('<input />')
             .val(stop.alternative_names)
             .attr("id", "altNames")
@@ -173,6 +195,8 @@ var API_BASE = "/1.0/",
         var $lon_input = $('<input />').attr("type", "hidden").val(lon).attr("id", "lon").appendTo($form);
         $form.submit(function(e) {
             e.preventDefault();
+            var oldProps = $('.selectedStop').data("properties");
+            
             var geojson = {
                 'type': 'Feature',
                 'properties': {
@@ -185,12 +209,17 @@ var API_BASE = "/1.0/",
                     'coordinates': [parseFloat($lon_input.val()), parseFloat($lat_input.val())]
                 }    
             };
+            var props = $.extend(oldProps, geojson.properties);
+            $('.selectedStop').data("properties", props);
             var geojsonString = JSON.stringify(geojson);
             //console.log(geojsonString);
             var url = API_BASE + "stop/" + stop.slug + "?srid=3857";
             $.post(url, {'geojson': geojsonString}, function(response) {
-                console.log(response);
+                if (response.errors) {
-            });
+                    alert("error saving");
+                }
+                //console.log(response);
+            }, "json");
         });   
         return $div;
     }
@@ -204,23 +233,60 @@ var API_BASE = "/1.0/",
 //        layers[0] = new OpenLayers.Layer.OSM();
 
         layers[0] = new OpenLayers.Layer.OSM();
+        layers[1] = new OpenLayers.Layer.Bing({
+                name: "Bing Aerial",
+                type: "Aerial",
+                key: "AqGpO7N9ioFw3YHoPV3C8crGfJqW5YST4gGKgIOnijrUbitLlgcAS2A0M9SJrUv9",
+        });
         geojson_format = new OpenLayers.Format.GeoJSON();
         //yes, jsonLayer is global. Yes, I know it's wrong.
-        jsonLayer = layers[1] = new OpenLayers.Layer.Vector({
+        jsonLayer = layers[2] = new OpenLayers.Layer.Vector("Bus Stops");
-                geometryType: 'Point'
-//                projection: new OpenLayers.Projection("EPSG:4326")
-                });
-        //  map.addLayer(vector_layer);
         map.addLayers(layers);
         map.setCenter(center, 12);
-
+        var navigationControl = new OpenLayers.Control.Navigation({
-        mapControl = new OpenLayers.Control.SelectFeature(layers[1]);
+            defaultDblClick: function(event) {
-        zoomControl = new OpenLayers.Control.ZoomToMaxExtent();
+                //var xy = event.xy;
+                var lonlat = map.getLonLatFromPixel(event.xy);
+                var $stopForm = $('#stopForm');
+                if ($stopForm.length === 0) {
+                    return;
+                }
+                var slug = $('#formCol').find('.stopSlug').text();
+                //console.log("slug", slug);
+                var stop = $('.selectedStop').data("properties");
+                $('.selectedStop').data("geometry", {
+                    'coordinates': [lonlat.x, lonlat.y]
+                });
+                var hasPoint = $('.selectedStop').hasClass('has_point');
+                $('#lon').val(lonlat.lon);
+                $('#lat').val(lonlat.lat);
+                $stopForm.submit();
+                if (hasPoint) {
+                    var feature = getStopFromSlug(slug);
+                    feature.move(lonlat);
+                } else {
+                    var pt = new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat);
+                    var feature = new OpenLayers.Feature.Vector(pt, stop);
+                    $('.selectedStop').removeClass("no_has_point").addClass("has_point");
+                    //console.log("trying to add", feature);
+                    jsonLayer.addFeatures([feature]);
+                    mapControl.select(feature);
+                }                
+//                console.log(lonlat);    
+                return;
+            }
+        });
+        map.addControl(navigationControl);
+        mapControl = new OpenLayers.Control.SelectFeature(jsonLayer, {
+            clickout: false,
+            toggle: true
+        });
+        map.addControl(new OpenLayers.Control.LayerSwitcher());
         map.addControl(mapControl);
         //  map.addControl(zoomControl);
         mapControl.activate();
         //  zoomControl.activate();
-        layers[1].events.on({
+        jsonLayer.events.on({
            'featureselected': onFeatureSelect,
            'featureunselected': onFeatureUnselect
         });  
@@ -229,9 +295,18 @@ var API_BASE = "/1.0/",
     function onFeatureSelect(e) {
         //alert(arguments);
         //console.log(feature);
+        // console.log(e.feature);
         var slug = e.feature.attributes.slug;
         //alert("selected " + slug);
         highlightStop(slug);
+        var stop = e.feature.attributes;
+        var geom = {
+            'coordinates': [e.feature.geometry.x, e.feature.geometry.y]
+        };
+        var $form = getStopForm(stop, geom);
+        $('#stopForm').remove();
+        $('#formCol').empty();
+        $('#formCol').append($form);
 //        var matchedStops = $('.' + slug);
 //        matchedStops.click();
 //        matchedStops.addClass('highlightedStop');
@@ -242,6 +317,8 @@ var API_BASE = "/1.0/",
         var slug = e.feature.attributes.slug;
         //alert("unselected " + slug);
         unhighlightStop(slug);
+        $('#stopForm').remove();
+        $('#formCol').empty();
 //        var matchedStops = $('.' + slug);
 //        matchedStops.removeClass('selectedStop');      
     }

chaloBEST/templates/editstops.html

@@ -1,5 +1,9 @@
 {% extends 'base.html' %}
 
+{% block title %}
+    Edit Stops
+{% endblock %}
+
 {% block head %}
 <link rel="stylesheet" href="/static/css/editstops.css" />
 <script type="text/javascript" src="/static/js/editstops.js"></script>