X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/685eef338db5a90c1c18a880da2af20681f7328d..HEAD:/app/assets/javascripts/index/note.js

diff --git a/app/assets/javascripts/index/note.js b/app/assets/javascripts/index/note.js
index e5eb3a041..b9310a1af 100644
--- a/app/assets/javascripts/index/note.js
+++ b/app/assets/javascripts/index/note.js
@@ -1,8 +1,8 @@
 OSM.Note = function (map) {
-  var content = $("#sidebar_content"),
-      page = {};
+  const content = $("#sidebar_content"),
+        page = {};
 
-  var noteIcons = {
+  const noteIcons = {
     "new": L.icon({
       iconUrl: OSM.NEW_NOTE_MARKER,
       iconSize: [25, 40],
@@ -22,77 +22,90 @@ OSM.Note = function (map) {
 
   page.pushstate = page.popstate = function (path, id) {
     OSM.loadSidebarContent(path, function () {
-      initialize(path, id, function () {
-        var data = $(".details").data();
-        if (!data) return;
-        var latLng = L.latLng(data.coordinates.split(","));
-        if (!map.getBounds().contains(latLng)) moveToNote();
-      });
+      const data = $(".details").data();
+      if (!data) return;
+      const latLng = L.latLng(data.coordinates.split(","));
+      initialize(path, id, map.getBounds().contains(latLng));
     });
   };
 
   page.load = function (path, id) {
-    initialize(path, id, moveToNote);
+    initialize(path, id);
   };
 
-  function initialize(path, id, callback) {
-    content.find("input[type=submit]").on("click", function (e) {
+  function initialize(path, id, skipMoveToNote) {
+    content.find("button[name]").on("click", function (e) {
       e.preventDefault();
-      var data = $(e.target).data();
-      var form = e.target.form;
+      const { url, method } = $(e.target).data(),
+            name = $(e.target).attr("name"),
+            data = new URLSearchParams();
+      content.find("button[name]").prop("disabled", true);
 
-      $(form).find("input[type=submit]").prop("disabled", true);
+      if (name !== "subscribe" && name !== "unsubscribe" && name !== "reopen") {
+        data.set("text", content.find("textarea").val());
+      }
 
-      $.ajax({
-        url: data.url,
-        type: data.method,
-        oauth: true,
-        data: { text: $(form.text).val() },
-        success: function () {
-          OSM.loadSidebarContent(path, function () {
-            initialize(path, id, moveToNote);
+      fetch(url, {
+        method: method,
+        headers: { ...OSM.oauth },
+        body: data
+      })
+        .then(response => {
+          if (response.ok) return response;
+          return response.text().then(text => {
+            throw new Error(text);
           });
-        }
-      });
+        })
+        .then(() => {
+          OSM.loadSidebarContent(path, () => {
+            initialize(path, id, false);
+          });
+        })
+        .catch(error => {
+          content.find("#comment-error")
+            .text(error.message)
+            .prop("hidden", false)
+            .get(0).scrollIntoView({ block: "nearest" });
+          updateButtons();
+        });
     });
 
     content.find("textarea").on("input", function (e) {
-      var form = e.target.form;
-
-      if ($(e.target).val() === "") {
-        $(form.close).val(I18n.t("javascripts.notes.show.resolve"));
-        $(form.comment).prop("disabled", true);
-      } else {
-        $(form.close).val(I18n.t("javascripts.notes.show.comment_and_resolve"));
-        $(form.comment).prop("disabled", false);
-      }
+      updateButtons(e.target.form);
     });
 
     content.find("textarea").val("").trigger("input");
 
-    var data = $(".details").data();
+    const data = $(".details").data();
 
     if (data) {
+      const hashParams = OSM.parseHash(window.location.hash);
       map.addObject({
         type: "note",
         id: parseInt(id, 10),
         latLng: L.latLng(data.coordinates.split(",")),
         icon: noteIcons[data.status]
+      }, function () {
+        if (!hashParams.center && !skipMoveToNote) {
+          const latLng = L.latLng(data.coordinates.split(","));
+          OSM.router.withoutMoveListener(function () {
+            map.setView(latLng, 15, { reset: true });
+          });
+        }
       });
     }
-
-    if (callback) callback();
   }
 
-  function moveToNote() {
-    var data = $(".details").data();
-    if (!data) return;
-    var latLng = L.latLng(data.coordinates.split(","));
+  function updateButtons() {
+    const resolveButton = content.find("button[name='close']");
+    const commentButton = content.find("button[name='comment']");
 
-    if (!window.location.hash || window.location.hash.match(/^#?c[0-9]+$/)) {
-      OSM.router.withoutMoveListener(function () {
-        map.setView(latLng, 15, { reset: true });
-      });
+    content.find("button[name]").prop("disabled", false);
+    if (content.find("textarea").val() === "") {
+      resolveButton.text(resolveButton.data("defaultActionText"));
+      commentButton.prop("disabled", true);
+    } else {
+      resolveButton.text(resolveButton.data("commentActionText"));
     }
   }