double click to start editing?

natevw · Dec 7, 2011 · 65bc116 · 65bc116
1 parent 2c6248b
commit 65bc116
Showing 1 changed file with 22 additions and 5 deletions.
diff --git a/templates/editor.html b/templates/editor.html
@@ -48,17 +48,37 @@
             editor = po_metakaolin_editor();
         map.add(vector).add(editor);
 
+        vector.on('load', po.stylist().attr('fill', "grey").attr('fill-opacity', 0.5).attr('stroke', "black"));
+        vector.on('load', function (loadEvent) {
+            loadEvent.features.forEach(function (f) {
+                d3.select(f.element).on("dblclick", function () {
+                    d3.event.stopPropagation();
+                    d3.event.preventDefault();
+                    editGeometry(f.data.geometry);
+                }).on("mouseover", function () {
+                    d3.select(this).attr('fill-opacity', 0.25);
+                }).on("mouseout", function () {
+                    d3.select(this).attr('fill-opacity', 0.5);
+                })
+            });        
+        });
+
         var geojson_content = d3.select("#geojson_content").node();
         if (geojson_content.value) {
             var geometry = JSON.parse(geojson_content.value),
                 bounds = d3.geo.bounds(geometry).map(function (c) { return {lon:c[0], lat:c[1]}; });
-            vector.features([{type:"Feature", properties:null, geometry:geometry}]);    // TODO: style, set dblclick handler to edit each feature
+            vector.features([{type:"Feature", properties:null, geometry:geometry}]);    // TODO: style, set dblclick handler to edit each feature11
             map.extent(bounds).zoomBy(-0.25);
         } else if (navigator.geolocation) navigator.geolocation.getCurrentPosition(function (p) {
             map.center({lat:p.coords.latitude, lon:p.coords.longitude}).zoom(14);
             addEditablePoint();
         });
 
+        function editGeometry(geom) {
+            editor.geometry(geom);
+        }
+
+
         function addEditablePoint () {
             var shape = {type:"Polygon", coordinates:[[]]},
                 size = 0.00125,
@@ -75,10 +95,7 @@
             } else if (1) {
                 shape = {type:"GeometryCollection", geometries:[shape]};
             }
-
-            var editor = po_metakaolin_editor();
-            editor.geometry(shape);
-            map.add(editor);
+            editGeometry(shape);
         }
     </script>
 </body>