app/assets/javascripts/index_modules/note.js

   1 export default function (map) {
   2   const content = $("#sidebar_content"),
   3         page = {};
   4
   5   page.pushstate = page.popstate = function (path, id) {
   6     OSM.loadSidebarContent(path).then(function () {
   7       const data = $(".details").data();
   8       if (!data) return;
   9       const [lat, lng] = data.coordinates.split(",").map(parseFloat);
  10       initialize(path, id, map.getBounds().contains({ lat, lng }));
  11     });
  12   };
  13
  14   page.load = function (path, id) {
  15     initialize(path, id);
  16   };
  17
  18   function initialize(path, id, skipMoveToNote) {
  19     content.find("button[name]").on("click", function (e) {
  20       e.preventDefault();
  21       const { url, method } = $(e.target).data(),
  22             name = $(e.target).attr("name"),
  23             data = new URLSearchParams();
  24       content.find("button[name]").prop("disabled", true);
  25
  26       if (name !== "subscribe" && name !== "unsubscribe") {
  27         const textarea = content.find("textarea");
  28         if (textarea.length) {
  29           data.set("text", textarea.val());
  30         }
  31       }
  32
  33       fetch(url, {
  34         method: method,
  35         headers: { ...OSM.oauth },
  36         body: data
  37       })
  38         .then(response => {
  39           if (response.ok) return response;
  40           return response.text().then(text => {
  41             throw new Error(text || `HTTP Error ${response.status} ${response.statusText}`);
  42           });
  43         })
  44         .then(() => {
  45           OSM.loadSidebarContent(path)
  46             .then(() => initialize(path, id, false));
  47         })
  48         .catch(error => {
  49           content.find("#comment-error")
  50             .text(error.message)
  51             .prop("hidden", false)
  52             .get(0).scrollIntoView({ block: "nearest" });
  53           updateButtons();
  54         });
  55     });
  56
  57     content.find("textarea").on("input", function (e) {
  58       updateButtons(e.target.form);
  59     });
  60
  61     content.find("textarea").val("").trigger("input");
  62
  63     const data = $(".details").data();
  64
  65     if (data) {
  66       const hashParams = OSM.parseHash();
  67       map.addObject({
  68         type: "note",
  69         id: parseInt(id, 10),
  70         latLng: L.latLng(data.coordinates.split(",")),
  71         icon: OSM.noteMarkers[data.status]
  72       }, function () {
  73         if (!hashParams.center && !skipMoveToNote) {
  74           const latLng = L.latLng(data.coordinates.split(","));
  75           OSM.router.withoutMoveListener(function () {
  76             map.setView(latLng, 15, { reset: true });
  77           });
  78         }
  79       });
  80     }
  81   }
  82
  83   function updateButtons() {
  84     const resolveButton = content.find("button[name='close']");
  85     const commentButton = content.find("button[name='comment']");
  86
  87     content.find("button[name]").prop("disabled", false);
  88     if (content.find("textarea").val() === "") {
  89       resolveButton.text(resolveButton.data("defaultActionText"));
  90       commentButton.prop("disabled", true);
  91     } else {
  92       resolveButton.text(resolveButton.data("commentActionText"));
  93     }
  94   }
  95
  96   page.unload = function () {
  97     map.removeObject();
  98   };
  99
 100   return page;
 101 }