//= require sidebar
//= require richtext
//= require resize
-//= require notes
function zoomPrecision(zoom) {
var decimals = Math.pow(10, Math.floor(zoom/3));
//= require index/browse
//= require index/export
//= require index/key
+//= require index/notes
$(document).ready(function () {
var marker;
--- /dev/null
+$(document).ready(function () {
+ var params = OSM.mapParams();
+ var newNotes;
+
+ function saveNewNotes(o) {
+ var layer = o.object;
+ newNotes = layer.getFeaturesByAttribute("status", "new")
+ layer.removeFeatures(newNotes, { silent: true });
+ }
+
+ function restoreNewNotes(o) {
+ var layer = o.object;
+ layer.addFeatures(newNotes);
+ newNotes = undefined;
+ }
+
+ function describeNote(n) {
+ var description = "<h2>Note " + n.id + "</h2>";
+
+ n.comments.forEach(function (c) {
+ description += "<p><small class='deemphasize'>" + c.action + " by ";
+ description += c.user + " at " + c.date + "</small><br/>" + c.text + "</p>";
+ });
+
+ return description;
+ }
+
+ function noteSelected(o) {
+ var feature = o.feature;
+ var location = feature.geometry.getBounds().getCenterLonLat();
+ var content;
+ var close;
+
+ if (feature.attributes.status === "new") {
+ var form = $("#new-note").clone();
+ form.removeClass("hidden");
+ content = form.html();
+ close = false;
+ } else {
+ content = describeNote(feature.attributes);
+ close = true;
+ };
+
+ feature.popup = new OpenLayers.Popup.FramedCloud(
+ feature.attributes.id, location, null, content, null, close,
+ function (e) { map.noteSelector.unselect(feature) }
+ );
+
+ map.addPopup(feature.popup);
+ // feature.popup.show();
+
+ $(feature.popup.contentDiv).find("textarea").autoGrow();
+
+ $(feature.popup.contentDiv).find("input#note-submit").click(function (e) {
+ var location = unproj(feature.geometry.getBounds().getCenterLonLat());
+ var form = $(e.target).parents("form").first();
+
+ $.ajax(form.prop("action"), {
+ type: form.prop("method"),
+ data: {
+ lon: location.lon,
+ lat: location.lat,
+ text: form.find("textarea#comment").val()
+ },
+ success: function (data) {
+ map.noteSelector.unselect(feature);
+
+ feature.attributes.status = "open";
+ feature.attributes.id = data;
+
+ map.noteLayer.drawFeature(feature);
+
+ map.noteMover.deactivate();
+ }
+ });
+
+ e.preventDefault();
+ });
+
+ $(feature.popup.contentDiv).find("input#note-cancel").click(function (e) {
+ feature.attributes.status = "cancelled";
+
+ map.noteSelector.unselect(feature);
+ map.noteLayer.removeFeatures(feature);
+
+ feature.destroy();
+
+ map.noteMover.deactivate();
+
+ e.preventDefault();
+ });
+
+ feature.popup.updateSize();
+ }
+
+ function noteUnselected(o) {
+ var feature = o.feature;
+
+ map.removePopup(feature.popup);
+ }
+
+ function addNote() {
+ var lonlat = map.getCenter();
+ var layer = map.noteLayer;
+ var geometry = new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat);
+ var feature = new OpenLayers.Feature.Vector(geometry, {
+ status: "new"
+ });
+
+ layer.addFeatures(feature);
+ map.noteSelector.unselectAll();
+ map.noteSelector.select(feature);
+ map.noteMover.activate();
+ map.noteLayer.setVisibility(true);
+ }
+
+ $("#map").on("initialised", function () {
+ map.noteLayer = new OpenLayers.Layer.Vector("Notes", {
+ visibility: params.notes,
+ displayInLayerSwitcher: false,
+ projection: new OpenLayers.Projection("EPSG:4326"),
+ styleMap: new OpenLayers.StyleMap(new OpenLayers.Style({
+ graphicWidth: 22,
+ graphicHeight: 22,
+ graphicOpacity: 0.7,
+ graphicXOffset: -11,
+ graphicYOffset: -11
+ }, {
+ rules: [
+ new OpenLayers.Rule({
+ filter: new OpenLayers.Filter.Comparison({
+ type: OpenLayers.Filter.Comparison.EQUAL_TO,
+ property: "status",
+ value: "new"
+ }),
+ symbolizer: {
+ externalGraphic: "<%= image_path 'new_note_marker.png' %>"
+ }
+ }),
+ new OpenLayers.Rule({
+ filter: new OpenLayers.Filter.Comparison({
+ type: OpenLayers.Filter.Comparison.EQUAL_TO,
+ property: "status",
+ value: "open"
+ }),
+ symbolizer: {
+ externalGraphic: "<%= image_path 'open_note_marker.png' %>"
+ }
+ }),
+ new OpenLayers.Rule({
+ filter: new OpenLayers.Filter.Comparison({
+ type: OpenLayers.Filter.Comparison.EQUAL_TO,
+ property: "status",
+ value: "closed"
+ }),
+ symbolizer: {
+ externalGraphic: "<%= image_path 'closed_note_marker.png' %>"
+ }
+ })
+ ]
+ })),
+ strategies: [
+ new OpenLayers.Strategy.BBOX()
+ ],
+ protocol: new OpenLayers.Protocol.HTTP({
+ url: $("#show_notes").attr("href"),
+ format: new OpenLayers.Format.GeoJSON()
+ })
+ });
+
+ map.noteLayer.events.register("beforefeaturesremoved", map, saveNewNotes);
+ map.noteLayer.events.register("featuresremoved", map, restoreNewNotes);
+ map.noteLayer.events.register("featureselected", map, noteSelected);
+ map.noteLayer.events.register("featureunselected", map, noteUnselected);
+
+ map.addLayer(map.noteLayer);
+
+ map.noteSelector = new OpenLayers.Control.SelectFeature(map.noteLayer, {
+ autoActivate: true
+ });
+
+ map.addControl(map.noteSelector);
+
+ map.noteMover = new OpenLayers.Control.DragFeature(map.noteLayer, {
+ onDrag: function (feature, pixel) {
+ feature.popup.lonlat = feature.geometry.getBounds().getCenterLonLat();
+ feature.popup.updatePosition();
+ },
+ featureCallbacks: {
+ over: function (feature) {
+ if (feature.attributes.status === "new") {
+ map.noteMover.overFeature.apply(map.noteMover, [feature]);
+ }
+ }
+ }
+ });
+
+ map.addControl(map.noteMover);
+
+ $("#show_notes").click(function (e) {
+ map.noteLayer.setVisibility(true);
+
+ e.preventDefault();
+ });
+
+ $("#createnoteanchor").click(function (e) {
+ map.noteLayer.setVisibility(true);
+
+ addNote();
+
+ e.preventDefault();
+ });
+ });
+});
map.updateSize();
});
+ $("#" + divName).trigger("initialised");
+
return map;
}
+++ /dev/null
-$(document).ready(function () {
- var params = OSM.mapParams();
-
-// map.noteLayer = addNoteLayer(map, $("#show_notes").attr("href"), $("#createnoteanchor"), $("#new-note"), 11);
-
- $("#show_notes").click(function () {
- map.noteLayer.setVisibility(true);
- });
-
- if (params.notes) {
- map.noteLayer.setVisibility(true);
- }
-
- function addNoteLayer(map, notesUrl, newNoteControls, newNoteForm, minZoom) {
- var newNotes;
-
- var saveNewNotes = function (o) {
- var layer = o.object;
- newNotes = layer.getFeaturesByAttribute("status", "new")
- layer.removeFeatures(newNotes, { silent: true });
- };
-
- var restoreNewNotes = function (o) {
- var layer = o.object;
- layer.addFeatures(newNotes);
- newNotes = undefined;
- };
-
- var describeNote = function (n) {
- var description = "<h2>Note " + n.id + "</h2>";
-
- n.comments.forEach(function (c) {
- description += "<p><small class='deemphasize'>" + c.action + " by ";
- description += c.user + " at " + c.date + "</small><br/>" + c.text + "</p>";
- });
-
- return description;
- }
-
- var noteSelected = function (o) {
- var feature = o.feature;
- var location = feature.geometry.getBounds().getCenterLonLat();
- var content;
- var close;
-
- if (feature.attributes.status === "new") {
- var form = newNoteForm.clone();
- form.removeClass("hidden");
- content = form.html();
- close = false;
- } else {
- content = describeNote(feature.attributes);
- close = true;
- };
-
- feature.popup = new OpenLayers.Popup.FramedCloud(
- feature.attributes.id, location, null, content, null, close,
- function (e) { map.noteSelector.unselect(feature) }
- );
-
- map.addPopup(feature.popup);
- // feature.popup.show();
-
- $(feature.popup.contentDiv).find("textarea").autoGrow();
-
- $(feature.popup.contentDiv).find("input#note-submit").click(function (e) {
- var location = unproj(feature.geometry.getBounds().getCenterLonLat());
- var form = $(e.target).parents("form").first();
-
- $.ajax(form.prop("action"), {
- type: form.prop("method"),
- data: {
- lon: location.lon,
- lat: location.lat,
- text: form.find("textarea#comment").val()
- },
- success: function (data) {
- map.noteSelector.unselect(feature);
-
- feature.attributes.status = "open";
- feature.attributes.id = data;
-
- map.noteLayer.drawFeature(feature);
-
- map.noteMover.deactivate();
- }
- });
-
- e.preventDefault();
- });
-
- $(feature.popup.contentDiv).find("input#note-cancel").click(function (e) {
- feature.attributes.status = "cancelled";
-
- map.noteSelector.unselect(feature);
- map.noteLayer.removeFeatures(feature);
-
- feature.destroy();
-
- map.noteMover.deactivate();
-
- e.preventDefault();
- });
-
- feature.popup.updateSize();
- };
-
- var noteUnselected = function (o) {
- var feature = o.feature;
-
- map.removePopup(feature.popup);
-
- delete feature.popup;
- };
-
- var allowNoteReports = function () {
- if (map.getZoom() > minZoom) {
- newNoteControls.show();
- } else {
- newNoteControls.hide();
- }
- };
-
- var addNote = function () {
- var lonlat = map.getCenter();
- var layer = map.noteLayer;
- var geometry = new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat);
- var feature = new OpenLayers.Feature.Vector(geometry, {
- status: "new"
- });
-
- layer.addFeatures(feature);
- map.noteSelector.unselectAll();
- map.noteSelector.select(feature);
- map.noteMover.activate();
- map.noteLayer.setVisibility(true);
- };
-
- map.noteLayer = new OpenLayers.Layer.Vector("Notes", {
- visibility: false,
- displayInLayerSwitcher: false,
- projection: new OpenLayers.Projection("EPSG:4326"),
- styleMap: new OpenLayers.StyleMap(new OpenLayers.Style({
- graphicWidth: 22,
- graphicHeight: 22,
- graphicOpacity: 0.7,
- graphicXOffset: -11,
- graphicYOffset: -11
- }, {
- rules: [
- new OpenLayers.Rule({
- filter: new OpenLayers.Filter.Comparison({
- type: OpenLayers.Filter.Comparison.EQUAL_TO,
- property: "status",
- value: "new"
- }),
- symbolizer: {
- externalGraphic: "<%= image_path 'new_note_marker.png' %>"
- }
- }),
- new OpenLayers.Rule({
- filter: new OpenLayers.Filter.Comparison({
- type: OpenLayers.Filter.Comparison.EQUAL_TO,
- property: "status",
- value: "open"
- }),
- symbolizer: {
- externalGraphic: "<%= image_path 'open_note_marker.png' %>"
- }
- }),
- new OpenLayers.Rule({
- filter: new OpenLayers.Filter.Comparison({
- type: OpenLayers.Filter.Comparison.EQUAL_TO,
- property: "status",
- value: "closed"
- }),
- symbolizer: {
- externalGraphic: "<%= image_path 'closed_note_marker.png' %>"
- }
- })
- ]
- })),
- strategies: [
- new OpenLayers.Strategy.BBOX()
- ],
- protocol: new OpenLayers.Protocol.HTTP({
- url: notesUrl,
- format: new OpenLayers.Format.GeoJSON()
- })
- });
-
- map.noteLayer.events.register("beforefeaturesremoved", map, saveNewNotes);
- map.noteLayer.events.register("featuresremoved", map, restoreNewNotes);
- map.noteLayer.events.register("featureselected", map, noteSelected);
- map.noteLayer.events.register("featureunselected", map, noteUnselected);
-
- map.addLayer(map.noteLayer);
-
- map.noteSelector = new OpenLayers.Control.SelectFeature(map.noteLayer, {
- autoActivate: true
- });
-
- map.addControl(map.noteSelector);
-
- map.noteMover = new OpenLayers.Control.DragFeature(map.noteLayer, {
- onDrag: function (feature, pixel) {
- feature.popup.lonlat = feature.geometry.getBounds().getCenterLonLat();
- feature.popup.updatePosition();
- },
- featureCallbacks: {
- over: function (feature) {
- if (feature.attributes.status === "new") {
- map.noteMover.overFeature.apply(map.noteMover, [feature]);
- }
- }
- }
- });
-
- map.addControl(map.noteMover);
-
- newNoteControls.click(addNote);
-
- map.events.register("zoomend", map, allowNoteReports);
-
- return map.noteLayer;
- }
-});
padding: 5px;
}
+#permalink a.disabled {
+ color: #ccc;
+ cursor: default;
+ text-decoration: none;
+}
+
/* Rules for edit menu */
.menuicon {
<div id="permalink">
<a href="/" id="permalinkanchor" class="geolink llz layers object"><%= t 'site.index.permalink' %></a>
<a href="/" id="shortlinkanchor"><%= t 'site.index.shortlink' %></a>
- <a href="#" id="createnoteanchor">Report a problem</a>
+ <%= link_to t("site.index.createnote"), notes_url,
+ :id => "createnoteanchor",
+ :data => { :minzoom => 12 },
+ :title => "javascripts.site.createnote_tooltip",
+ :class => "geolink"
+ %>
</div>
</div>
js_2: "OpenStreetMap uses JavaScript for its slippy map."
permalink: Permalink
shortlink: Shortlink
+ createnote: Add a note
license:
copyright: "Copyright OpenStreetMap and contributors, under an open license"
license_url: "http://openstreetmap.org/copyright"
history_tooltip: View edits for this area
history_disabled_tooltip: Zoom in to view edits for this area
history_zoom_alert: You must zoom in to view edits for this area
+ createnote_tooltip: Add a note to the map
+ createnote_disabled_tooltip: Zoom in to add a note to the map
+ createnote_zoom_alert: You must zoom in to add a note to the map
note:
closed: Closed Note
open: Open Note