X-Git-Url: https://git.openstreetmap.org/rails.git/blobdiff_plain/d1660a1c4fb71b61b7bd9181a2ec3822652bc29e..168a9fc3272777fa7ab533e936715525376f8ebf:/app/assets/javascripts/index/notes.js.erb diff --git a/app/assets/javascripts/index/notes.js.erb b/app/assets/javascripts/index/notes.js.erb index 4d796a3de..2121c21a7 100644 --- a/app/assets/javascripts/index/notes.js.erb +++ b/app/assets/javascripts/index/notes.js.erb @@ -7,18 +7,18 @@ $(document).ready(function () { var noteIcons = { "new": L.icon({ iconUrl: "<%= image_path 'new_note_marker.png' %>", - iconSize: [22, 22], - iconAnchor: [11, 11] + iconSize: [25, 40], + iconAnchor: [12, 40] }), "open": L.icon({ iconUrl: "<%= image_path 'open_note_marker.png' %>", - iconSize: [22, 22], - iconAnchor: [11, 11] + iconSize: [25, 40], + iconAnchor: [12, 40] }), "closed": L.icon({ iconUrl: "<%= image_path 'closed_note_marker.png' %>", - iconSize: [22, 22], - iconAnchor: [11, 11] + iconSize: [25, 40], + iconAnchor: [12, 40] }) }; @@ -26,6 +26,11 @@ $(document).ready(function () { var notes = {}; var newNote; + layers.push({ + layer: noteLayer, + layerCode: "N" + }); + map.on("layeradd", function (e) { if (e.layer == noteLayer) { loadNotes(); @@ -41,9 +46,12 @@ $(document).ready(function () { } }); - map.on("popupopen", function (e) { - $(e.popup._container).find(".comment").focus(); - }); + // Don't focus the text area on touch devices to avoid flashing the keyboard + if (!('ontouchstart' in document.documentElement)) { + map.on("popupopen", function (e) { + $(e.popup._container).find(".comment").focus(); + }); + } map.on("popupclose", function (e) { if (newNote && e.popup == newNote._popup) { @@ -57,6 +65,7 @@ $(document).ready(function () { if (OSM.STATUS != 'api_offline' && OSM.STATUS != 'database_offline') { map.layersControl.addOverlay(noteLayer, I18n.t("browse.start_rjs.notes_layer_name")); + if (params.layers) setMapLayers(params.layers); if (params.notes) map.addLayer(noteLayer); if (params.note) { @@ -78,13 +87,16 @@ $(document).ready(function () { if (marker) { marker.setIcon(noteIcons[feature.properties.status]); - marker._popup.setContent(createPopupContent(marker, feature.properties)); + marker._popup.setContent(createPopupContent( + marker, feature.properties, + $(marker._popup._content).find("textarea").val() + )); } else { marker = L.marker(feature.geometry.coordinates.reverse(), { icon: noteIcons[feature.properties.status], - opacity: 0.7 + opacity: 0.9 }); marker.addTo(noteLayer).bindPopup( @@ -103,7 +115,7 @@ $(document).ready(function () { var size = bounds.getSize(); if (size <= OSM.MAX_NOTE_REQUEST_AREA) { - var url = "/api/" + OSM.API_VERSION + "/notes.json?bbox=" + bounds.toBBOX(); + var url = "/api/" + OSM.API_VERSION + "/notes.json?bbox=" + bounds.toBBoxString(); if (noteLoader) noteLoader.abort(); @@ -139,12 +151,12 @@ $(document).ready(function () { minWidth: 320, maxWidth: mapSize.y * 1 / 3, maxHeight: mapSize.y * 2 / 3, - offset: new L.Point(0, -3), + offset: new L.Point(0, -40), autoPanPadding: new L.Point(60, 40) }; } - function createPopupContent(marker, properties) { + function createPopupContent(marker, properties, comment) { var content = $(JST["templates/notes/show"]({ note: properties })); content.find("textarea").on("input", function (e) { @@ -165,6 +177,10 @@ $(document).ready(function () { updateNote(marker, e.target.form, data.method, data.url); }); + if (comment) { + content.find("textarea").val(comment).trigger("input"); + } + return content[0]; } @@ -186,6 +202,8 @@ $(document).ready(function () { text: $(form.text).val() }, success: function (feature) { + $(marker._popup._content).find("textarea").val(""); + notes[feature.properties.id] = updateMarker(marker, feature); newNote = null; @@ -219,7 +237,7 @@ $(document).ready(function () { }); } - $("#createnoteanchor").click(function (e) { + $(".leaflet-control-attribution").on("click", "#createnoteanchor", function (e) { e.preventDefault(); if ($(e.target).hasClass("disabled")) return; @@ -246,7 +264,7 @@ $(document).ready(function () { newNote = L.marker(map.containerPointToLatLng(markerPosition), { icon: noteIcons["new"], - opacity: 0.7, + opacity: 0.9, draggable: true });