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