Don't require a second click to create an OpenStreetBug
authorKai Krueger <kakrueger@gmail.com>
Sat, 30 Apr 2011 05:15:57 +0000 (23:15 -0600)
committerKai Krueger <kakrueger@gmail.com>
Sat, 30 Apr 2011 05:15:57 +0000 (23:15 -0600)
app/views/site/index.html.erb
config/locales/en.yml
public/javascripts/openstreetbugs.js

index b668627a0bd6be427af77b3747882fd17d0f9157..681924444a7fefaf5aaa6d830fb00c5292b3008c 100644 (file)
@@ -161,8 +161,10 @@ end
       map.addControl(map.osbControl);
                
          var lBug = document.getElementById('ReportBug');
+     /* lBug.addEventListener('click',function (e) {
+               map.osbControl.activate(); document.getElementById("OpenLayers.Map_18_OpenLayers_Container").style.cursor = "crosshair" },false); */
       lBug.addEventListener('click',function (e) {
-               map.osbControl.activate(); document.getElementById("OpenLayers.Map_18_OpenLayers_Container").style.cursor = "crosshair" },false);
+               map.osbControl.activate(); map.osbControl.addTemporaryMarker(map.getCenter());},false);
 
      map.events.register("zoomend",map,function () { var zoom = map.getZoom(); var lBug = document.getElementById('ReportBug')
         if (zoom > 11) { lBug.style.visibility = 'visible';} else {lBug.style.visibility = "hidden";}});
index 6b6c3703684e704b1e26a4f52b044400d299d6f6..c0e7d26e4d9d52485dce0fc2e37c6554a08a0ce3 100644 (file)
@@ -1920,4 +1920,6 @@ en:
       Login: Login
       Details: Details
       edityourself: You can also edit the map directly your self
+      draghelp1: Please drag the marker to the location of the problem
+      draghelp2: and descripe it as accurate as possible
 
index a8aba9be711c2ba2c51684881df015805fb4d12a..6d2f62b35e137f60063b30ec7f2e823d317c2345 100644 (file)
@@ -638,11 +638,15 @@ OpenLayers.Control.OpenStreetBugs = new OpenLayers.Class(OpenLayers.Control, {
         * Map clicking event handler. Adds a temporary marker with a popup to the map, the popup contains the form to add a bug.
        */
        click: function(e) {
+               var lonlat = this.map.getLonLatFromViewPortPx(e.xy);
+               this.addTemporaryMarker(lonlat);
+       },
+
+       addTemporaryMarker: function(lonlat) {
                if(!this.map) return true;
                deactivateControl();
 
                var control = this;
-               var lonlat = this.map.getLonLatFromViewPortPx(e.xy);
                var lonlatApi = lonlat.clone().transform(this.map.getProjectionObject(), this.osbLayer.apiProjection);
                var feature = new OpenLayers.Feature(this.osbLayer, lonlat, { icon: this.icon.clone(), autoSize: true });
                feature.popupClass = OpenLayers.Popup.FramedCloud.OpenStreetBugs;
@@ -650,11 +654,39 @@ OpenLayers.Control.OpenStreetBugs = new OpenLayers.Class(OpenLayers.Control, {
                marker.feature = feature;
                this.osbLayer.addMarker(marker);
 
+
+               /** Implement a drag and drop for markers */
+               /* TODO: veryfy that the scoping of variables works correctly everywhere */             
+               var dragging = false;
+               var dragFunction = function(e) {
+                       map.events.unregister("mouseup",map,dragFunction);
+                       lonlat = map.getLonLatFromViewPortPx(e.xy);
+                       lonlatApi = lonlat.clone().transform(map.getProjectionObject(), map.osbLayer.apiProjection);
+                       marker.moveTo(map.getLayerPxFromViewPortPx(e.xy));
+                       marker.popup.moveTo(map.getLayerPxFromViewPortPx(e.xy));                        
+                       marker.popup.updateRelativePosition();
+                       dragging = false;
+                       return false;
+               };
+
+               marker.events.register("mouseover", this,
+                               function(){ document.getElementById("OpenLayers.Map_18_OpenLayers_Container").style.cursor = "move"; });
+               marker.events.register("mouseout", this,
+                               function(){ if (!dragging) {document.getElementById("OpenLayers.Map_18_OpenLayers_Container").style.cursor = "default"; }});
+               marker.events.register("mousedown", this,
+                               function() { dragging = true; map.events.register("mouseup",map, dragFunction); return false;});
+               
+
                var newContent = document.createElement("div");
                var el1,el2,el3;
                el1 = document.createElement("h3");
                el1.appendChild(document.createTextNode(i18n("javascripts.osb.Create bug")));
                newContent.appendChild(el1);
+               newContent.appendChild(document.createTextNode(i18n("javascripts.osb.draghelp1")));
+               newContent.appendChild(document.createElement("br"));
+               newContent.appendChild(document.createTextNode(i18n("javascripts.osb.draghelp2")));
+               newContent.appendChild(document.createElement("br"));
+               newContent.appendChild(document.createElement("br"));
 
                var el_form = document.createElement("form");
 
@@ -720,6 +752,7 @@ OpenLayers.Control.OpenStreetBugs = new OpenLayers.Class(OpenLayers.Control, {
                popup.events.register("close", this, function(){ feature.destroy(); });
                this.map.addPopup(popup);
                popup.updateSize();
+               marker.popup = popup;
        },
 
        CLASS_NAME: "OpenLayers.Control.OpenStreetBugs"