app/assets/javascripts/notes.js.erb

   1 function addNoteLayer(map, notesUrl, newNoteControls, newNoteForm, minZoom) {
   2   var newNotes;
   3
   4   var saveNewNotes = function (o) {
   5     var layer = o.object;
   6     newNotes = layer.getFeaturesByAttribute("status", "new")
   7     layer.removeFeatures(newNotes, { silent: true });
   8   };
   9
  10   var restoreNewNotes = function (o) {
  11     var layer = o.object;
  12     layer.addFeatures(newNotes);
  13     newNotes = undefined;
  14   };
  15
  16   var noteSelected = function (o) {
  17     var feature = o.feature;
  18     var location = feature.geometry.getBounds().getCenterLonLat();
  19     var content;
  20     var close;
  21
  22     if (feature.attributes.status === "new") {
  23       var form = newNoteForm.clone();
  24       form.removeClass("hidden");
  25       content = form.html();
  26       close = false;
  27     } else {
  28       content = "<p>" + feature.attributes.id + "</p>";
  29       close = true;
  30     };
  31
  32     feature.popup = new OpenLayers.Popup.FramedCloud(
  33       feature.attributes.id, location, null, content, null, close,
  34       function (e) { map.noteSelector.unselect(feature) }
  35     );
  36
  37     map.addPopup(feature.popup);
  38     // feature.popup.show();
  39
  40     $(feature.popup.contentDiv).find("textarea").autoGrow();
  41
  42     $(feature.popup.contentDiv).find("input#note-submit").click(function (e) {
  43       var location = unproj(feature.geometry.getBounds().getCenterLonLat());
  44       var form = $(e.target).parents("form").first();
  45
  46       $.ajax(form.prop("action"), {
  47         type: form.prop("method"),
  48         data: {
  49           lon: location.lon,
  50           lat: location.lat,
  51           text: form.find("textarea#comment").val()
  52         },
  53         success: function (data) {
  54           map.noteSelector.unselect(feature);
  55
  56           feature.attributes.status = "open";
  57           feature.attributes.id = data;
  58
  59           map.noteLayer.drawFeature(feature);
  60
  61           map.noteMover.deactivate();
  62         }
  63       });
  64
  65       e.preventDefault();
  66     });
  67
  68     $(feature.popup.contentDiv).find("input#note-cancel").click(function (e) {
  69       feature.attributes.status = "cancelled";
  70
  71       map.noteSelector.unselect(feature);
  72       map.noteLayer.removeFeatures(feature);
  73
  74       feature.destroy();
  75
  76       map.noteMover.deactivate();
  77
  78       e.preventDefault();
  79     });
  80
  81     feature.popup.updateSize();
  82   };
  83
  84   var noteUnselected = function (o) {
  85     var feature = o.feature;
  86
  87     map.removePopup(feature.popup);
  88
  89     delete feature.popup;
  90   };
  91
  92   var allowNoteReports = function () {
  93     if (map.getZoom() > minZoom) {
  94       newNoteControls.show();
  95     } else {
  96       newNoteControls.hide();
  97     }
  98   };
  99
 100   var addNote = function () {
 101     var lonlat = map.getCenter();
 102     var layer = map.noteLayer;
 103     var geometry = new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat);
 104     var feature = new OpenLayers.Feature.Vector(geometry, {
 105       status: "new"
 106     });
 107
 108     layer.addFeatures(feature);
 109     map.noteSelector.unselectAll();
 110     map.noteSelector.select(feature);
 111     map.noteMover.activate();
 112     map.noteLayer.setVisibility(true);
 113   };
 114
 115   map.noteLayer = new OpenLayers.Layer.Vector("Notes", {
 116     visibility: false,
 117     displayInLayerSwitcher: false,
 118     projection: new OpenLayers.Projection("EPSG:4326"),
 119     styleMap: new OpenLayers.StyleMap(new OpenLayers.Style({
 120       graphicWidth: 22,
 121       graphicHeight: 22,
 122       graphicOpacity: 0.7,
 123       graphicXOffset: -11,
 124       graphicYOffset: -11
 125     }, {
 126       rules: [
 127         new OpenLayers.Rule({
 128           filter: new OpenLayers.Filter.Comparison({
 129             type: OpenLayers.Filter.Comparison.EQUAL_TO,
 130             property: "status",
 131             value: "new"
 132           }),
 133           symbolizer: {
 134             externalGraphic: "<%= image_path 'new_note_marker.png' %>"
 135           }
 136         }),
 137         new OpenLayers.Rule({
 138           filter: new OpenLayers.Filter.Comparison({
 139             type: OpenLayers.Filter.Comparison.EQUAL_TO,
 140             property: "status",
 141             value: "open"
 142           }),
 143           symbolizer: {
 144             externalGraphic: "<%= image_path 'open_note_marker.png' %>"
 145           }
 146         }),
 147         new OpenLayers.Rule({
 148           filter: new OpenLayers.Filter.Comparison({
 149             type: OpenLayers.Filter.Comparison.EQUAL_TO,
 150             property: "status",
 151             value: "closed"
 152           }),
 153           symbolizer: {
 154             externalGraphic: "<%= image_path 'closed_note_marker.png' %>"
 155           }
 156         })
 157       ]
 158     })),
 159     strategies: [
 160       new OpenLayers.Strategy.BBOX()
 161     ],
 162     protocol: new OpenLayers.Protocol.HTTP({
 163       url: notesUrl,
 164       format: new OpenLayers.Format.GeoJSON()
 165     })
 166   });
 167
 168   map.noteLayer.events.register("beforefeaturesremoved", map, saveNewNotes);
 169   map.noteLayer.events.register("featuresremoved", map, restoreNewNotes);
 170   map.noteLayer.events.register("featureselected", map, noteSelected);
 171   map.noteLayer.events.register("featureunselected", map, noteUnselected);
 172
 173   map.addLayer(map.noteLayer);
 174
 175   map.noteSelector = new OpenLayers.Control.SelectFeature(map.noteLayer, {
 176     autoActivate: true
 177   });
 178
 179   map.addControl(map.noteSelector);
 180
 181   map.noteMover = new OpenLayers.Control.DragFeature(map.noteLayer, {
 182     onDrag: function (feature, pixel) {
 183       feature.popup.lonlat = feature.geometry.getBounds().getCenterLonLat();
 184       feature.popup.updatePosition();
 185     },
 186     featureCallbacks: {
 187       over: function (feature) {
 188         if (feature.attributes.status === "new") {
 189           map.noteMover.overFeature.apply(map.noteMover, [feature]);
 190         }
 191       }
 192     }
 193   });
 194
 195   map.addControl(map.noteMover);
 196
 197   newNoteControls.click(addNote);
 198
 199   map.events.register("zoomend", map, allowNoteReports);
 200
 201   return map.noteLayer;
 202 }