Admin: polygon edition

4 files changed, 84 insertions, 32 deletions

diff --git a/chimere/admin.py b/chimere/admin.py
index e51bc3d..ce1f2b9 100644
--- a/chimere/admin.py
+++ b/chimere/admin.py
@@ -434,7 +434,7 @@ class PolygonAdmin(MarkerAdmin):
                export_to_shapefile, export_to_csv]
     readonly_fields = [
         'submiter_email', 'submiter_comment', 'import_source',
-        'submiter_name', 'ref_item', 'modified_since_import',]
+        'submiter_name', 'ref_item', 'modified_since_import']
     exclude = ['submiter_session_key', 'import_key', 'import_version',
                'ref_item']
     inlines = []
diff --git a/chimere/static/chimere/js/jquery.chimere.js b/chimere/static/chimere/js/jquery.chimere.js
index a94670c..057854a 100644
--- a/chimere/static/chimere/js/jquery.chimere.js
+++ b/chimere/static/chimere/js/jquery.chimere.js
@@ -383,13 +383,31 @@ function transform(obj) {
                 target.style.cursor = hit ? 'pointer' : '';
             });
 
+            settings.WKT = new ol.format.WKT();
 
             /* Vectors layer */
             settings.layerVectors = new ol.layer.Vector();
             settings.map.addLayer(settings.layerVectors);
             if (settings.edition && (settings.edition_type == 'polygon'
                                      || settings.edition_type == 'route')){
-                settings.editionSource = new ol.source.Vector({wrapX: false});
+
+                settings.features = new ol.Collection();
+
+                settings.editionSource = new ol.source.Vector(
+                    {features: settings.features});
+
+                settings.editionSource.on(
+                    'changefeature',
+                    function(changed) {
+                        if (changed) methods.updateInput();
+                    });
+
+                settings.editionSource.on(
+                    'addfeature',
+                    function(changed) {
+                        if (changed) methods.updateInput();
+                    });
+
                 settings.editionVector = new ol.layer.Vector({
                   source: settings.editionSource,
                   style: new ol.style.Style({
@@ -419,6 +437,21 @@ function transform(obj) {
                     source: settings.editionSource,
                     type: (edition_type),
                 });
+                settings.draw_activated = false;
+
+                settings.draw.on("drawend", function() {
+                    settings.map.removeInteraction(settings.draw);
+                    settings.draw_activated = false;
+                });
+
+                settings.modify = new ol.interaction.Modify({
+                    features: settings.features,
+                    deleteCondition: function(event) {
+                        return ol.events.condition.shiftKeyOnly(event) &&
+                            ol.events.condition.singleClick(event);
+                    }
+                });
+                settings.modify_activated = false;
             }
             // OL3-deprecated settings.layerVectors.setOpacity(0.8);
             /* OL3-deprecated-routing
@@ -1033,9 +1066,19 @@ function transform(obj) {
         },
         activateDraw: function (){
             settings.map.addInteraction(settings.draw);
+            settings.map.addInteraction(settings.modify);
+            settings.draw_activated = true;
+            settings.modify_activated = true;
         },
         deactivateDraw: function (){
-            settings.map.removeInteraction(settings.draw);
+            if (settings.draw_activated){
+                settings.map.removeInteraction(settings.draw);
+                settings.draw_activated = false;
+            }
+            if (settings.modify_activated){
+                settings.map.removeInteraction(settings.modify);
+                settings.modify_activated = false;
+            }
         },
         /*
         * Put a marker on the map
@@ -1801,6 +1844,14 @@ function transform(obj) {
             }
 
         },
+        updateInput: function(){
+            if (settings.edition_type == 'linestring'){
+                methods.updateRoutingInput();
+            }
+            if (settings.edition_type == 'polygon'){
+                methods.updatePolygonInput();
+            }
+        },
         updateRoutingInput: function(){
             if (!settings.current_routes_features) {
                 return;
@@ -1822,6 +1873,17 @@ function transform(obj) {
             var linestring = new OpenLayers.Geometry.LineString(point_array);
             jQuery('#id_route').val(String(linestring));
         },
+        updatePolygonInput: function(){
+            var features = settings.editionSource.getFeatures();
+            if (!features.length) {
+                jQuery('#id_polygon').val('');
+                return;
+            }
+            var wkt = settings.WKT.writeFeature(features[0], {
+                dataProjection: EPSG_DISPLAY_PROJECTION,
+                featureProjectsion: EPSG_PROJECTION});
+            jQuery('#id_polygon').val(String(wkt));
+        },
         activateCurrentControl: function(){
             if (settings.current_control){
                 settings.current_control.activate();
@@ -1843,18 +1905,18 @@ function transform(obj) {
                 settings.current_control.deactivate();
             }
         },
-        initFeature: function(json_geometry){
-            var json = new OpenLayers.Format.JSON();
-            var polyline = json.read(json_geometry);
-            var point_array = new Array();
-            for (i=0; i<polyline.coordinates.length; i++){
-                var point = new OpenLayers.Geometry.Point(
-                                    polyline.coordinates[i][0],
-                                    polyline.coordinates[i][1]);
-                point_array.push(point);
+        initFeature: function(wkt_geometry){
+            feature = settings.WKT.readFeature(wkt_geometry, {
+                dataProjection: EPSG_DISPLAY_PROJECTION,
+                featureProjectsion: EPSG_PROJECTION});
+            if (settings.draw_activated){
+                settings.map.removeInteraction(settings.draw);
+                settings.draw_activated = false;
             }
-            var linestring = new OpenLayers.Geometry.LineString(point_array);
-            methods.initFeatureFromGeometry(linestring);
+            settings.map.getView().fit(feature.getGeometry(),
+                                       settings.map.getSize());
+            settings.editionSource.addFeature(feature);
+            methods.updateInput();
         },
         initFeatureFromWkt: function(wkt_geometry){
             var linestring = OpenLayers.Geometry.fromWKT(wkt_geometry);
diff --git a/chimere/templates/chimere/blocks/polygon_edit.html b/chimere/templates/chimere/blocks/polygon_edit.html
index 7c773b4..98d5f7f 100644
--- a/chimere/templates/chimere/blocks/polygon_edit.html
+++ b/chimere/templates/chimere/blocks/polygon_edit.html
@@ -20,27 +20,16 @@
 </div>
 
 <div id='popup'></div>
-<div id='map_edit'>
-<div class='map_button'>
-  <a href='#' id='polygon_move' class='toggle-button toggle-button-active'>{% trans "Move on the map" %}</a>
-  <a href='#' id='polygon_draw' class='toggle-button toggle-button-inactive'>{% trans "Draw" %}</a>
-</div>
-</div>
-  <input type='hidden' name='{{name}}' id='id_{{name}}' value='{{val}}'/>
+<div id='map_edit'></div>
+<div class='help'>{% trans "To delete a vertice, hold the SHIFT key and click." %}</div>
+  <input type='hidden' name='{{name}}' id='id_{{name}}' value='{{value}}'/>
 
 <script type="text/javascript">
     function init_map_edit(){% raw %}{{{% endraw %}
         $('#map_edit').chimere(chimere_init_options);
+        $('#map_edit').chimere('activateDraw');
+        {% if value %}$('#map_edit').chimere('initFeature', '{{value}}');
+        {% endif %}
     {% raw %}}}{% endraw %}
     {% if initialized %}init_map_edit();{% endif %}
-    $('#polygon_draw').click(function(){% raw %}{{{% endraw %}
-        $('#polygon_move').removeClass('toggle-button-active').addClass('toggle-button-inactive');
-        $('#polygon_draw').removeClass('toggle-button-inactive').addClass('toggle-button-active');
-        $('#map_edit').chimere('activateDraw');
-    {% raw %}}}{% endraw %});
-    $('#polygon_move').click(function(){% raw %}{{{% endraw %}
-        $('#polygon_draw').removeClass('toggle-button-active').addClass('toggle-button-inactive');
-        $('#polygon_move').removeClass('toggle-button-inactive').addClass('toggle-button-active');
-        $('#map_edit').chimere('deactivateDraw');
-    {% raw %}}}{% endraw %});
 </script>
diff --git a/chimere/widgets.py b/chimere/widgets.py
index 5795b77..f76b4b2 100644
--- a/chimere/widgets.py
+++ b/chimere/widgets.py
@@ -624,7 +624,8 @@ class PolygonChooserWidget(forms.TextInput):
             'chimere/blocks/polygon_edit.html',
             {'name': name, 'val': val, 'initialized': initialized,
              'isvalue': bool(value),
-             'default_area': "true" if default_area else "false"}
+             'default_area': "true" if default_area else "false",
+             'value': value}
         )
         # TODO: manage area
         return mark_safe(tpl.format(