app/assets/javascripts/diary_entry.js

   1 $(document).ready(function () {
   2   var marker, map;
   3
   4   function setLocation(e) {
   5     const latlng = e.latlng.wrap();
   6
   7     $("#latitude").val(latlng.lat);
   8     $("#longitude").val(latlng.lng);
   9
  10     if (marker) {
  11       map.removeLayer(marker);
  12     }
  13
  14     marker = L.marker(e.latlng, { icon: OSM.getUserIcon() }).addTo(map)
  15       .bindPopup(I18n.t("diary_entries.edit.marker_text"));
  16   }
  17
  18   $("#usemap").click(function (e) {
  19     e.preventDefault();
  20
  21     $("#map").show();
  22     $("#usemap").hide();
  23
  24     var params = $("#map").data();
  25     var centre = [params.lat, params.lon];
  26     var position = $("html").attr("dir") === "rtl" ? "topleft" : "topright";
  27
  28     map = L.map("map", {
  29       attributionControl: false,
  30       zoomControl: false
  31     }).addLayer(new L.OSM.Mapnik());
  32
  33     L.OSM.zoom({ position: position })
  34       .addTo(map);
  35
  36     map.setView(centre, params.zoom);
  37
  38     if ($("#latitude").val() && $("#longitude").val()) {
  39       marker = L.marker(centre, { icon: OSM.getUserIcon() }).addTo(map)
  40         .bindPopup(I18n.t("diary_entries.edit.marker_text"));
  41     }
  42
  43     map.on("click", setLocation);
  44   });
  45 });