X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/fa0c12cdcd154a048f96a1934fc593ff9d509fe3..4ea6077ddb297bc56ce75bc62d7f371b80544166:/app/assets/javascripts/index/new_note.js diff --git a/app/assets/javascripts/index/new_note.js b/app/assets/javascripts/index/new_note.js index 7a82c5bc6..712d03dc5 100644 --- a/app/assets/javascripts/index/new_note.js +++ b/app/assets/javascripts/index/new_note.js @@ -35,37 +35,21 @@ OSM.NewNote = function (map) { OSM.router.route("/note/new"); }); - function createNote(marker, form, url) { - var location = marker.getLatLng().wrap(); - - marker.options.draggable = false; - marker.dragging.disable(); - + function createNote(location, text, callback) { $.ajax({ - url: url, + url: "/api/0.6/notes.json", type: "POST", oauth: true, data: { lat: location.lat, lon: location.lng, - text: $(form.text).val() + text }, - success: function (feature) { - noteCreated(feature, marker); - } + success: callback }); - - function noteCreated(feature, marker) { - content.find("textarea").val(""); - updateMarker(feature); - newNoteMarker = null; - noteLayer.removeLayer(marker); - addNoteButton.removeClass("active"); - OSM.router.route("/note/" + feature.properties.id); - } } - function updateMarker(feature) { + function addCreatedNoteMarker(feature) { var marker = L.marker(feature.geometry.coordinates.reverse(), { icon: noteIcons[feature.properties.status], opacity: 0.9, @@ -73,7 +57,24 @@ OSM.NewNote = function (map) { }); marker.id = feature.properties.id; marker.addTo(noteLayer); - return marker; + } + + function addHalo(latlng) { + if (halo) map.removeLayer(halo); + + halo = L.circleMarker(latlng, { + weight: 2.5, + radius: 20, + fillOpacity: 0.5, + color: "#FF6200" + }); + + map.addLayer(halo); + } + + function removeHalo() { + if (halo) map.removeLayer(halo); + halo = null; } page.pushstate = page.popstate = function (path) { @@ -82,25 +83,6 @@ OSM.NewNote = function (map) { }); }; - function newHalo(loc, a) { - var hasHalo = halo && map.hasLayer(halo); - - if (a === "dragstart" && hasHalo) { - map.removeLayer(halo); - } else { - if (hasHalo) map.removeLayer(halo); - - halo = L.circleMarker(loc, { - weight: 2.5, - radius: 20, - fillOpacity: 0.5, - color: "#FF6200" - }); - - map.addLayer(halo); - } - } - page.load = function (path) { if (addNoteButton.hasClass("disabled")) return; if (addNoteButton.hasClass("active")) return; @@ -129,11 +111,14 @@ OSM.NewNote = function (map) { }); newNoteMarker.on("dragstart dragend", function (a) { - newHalo(newNoteMarker.getLatLng(), a.type); + removeHalo(); + if (a.type !== "dragstart") { + addHalo(newNoteMarker.getLatLng()); + } }); - newNoteMarker.addTo(noteLayer); - newHalo(newNoteMarker.getLatLng()); + newNoteMarker.addTo(map); + addHalo(newNoteMarker.getLatLng()); newNoteMarker.on("remove", function () { addNoteButton.removeClass("active"); @@ -150,17 +135,30 @@ OSM.NewNote = function (map) { } content.find("input[type=submit]").on("click", function (e) { + const location = newNoteMarker.getLatLng().wrap(); + const text = content.find("textarea").val(); + e.preventDefault(); $(this).prop("disabled", true); - createNote(newNoteMarker, e.target.form, "/api/0.6/notes.json"); + newNoteMarker.options.draggable = false; + newNoteMarker.dragging.disable(); + + createNote(location, text, (feature) => { + content.find("textarea").val(""); + addCreatedNoteMarker(feature); + map.removeLayer(newNoteMarker); + newNoteMarker = null; + addNoteButton.removeClass("active"); + OSM.router.route("/note/" + feature.properties.id); + }); }); return map.getState(); }; page.unload = function () { - if (newNoteMarker) noteLayer.removeLayer(newNoteMarker); - if (halo) map.removeLayer(halo); + if (newNoteMarker) map.removeLayer(newNoteMarker); + removeHalo(); addNoteButton.removeClass("active"); };