app/assets/javascripts/leaflet.sidebar.js

   1 L.OSM.sidebar = function (selector) {
   2   const control = {},
   3         sidebar = $(selector);
   4   let current = $(),
   5       currentButton = $(),
   6       map;
   7
   8   control.addTo = function (_) {
   9     map = _;
  10     return control;
  11   };
  12
  13   control.addPane = function (pane) {
  14     pane
  15       .hide()
  16       .appendTo(sidebar);
  17   };
  18
  19   control.togglePane = function (pane, button) {
  20     const mediumDeviceWidth = window.getComputedStyle(document.documentElement).getPropertyValue("--bs-breakpoint-md");
  21     const isMediumDevice = window.matchMedia(`(max-width: ${mediumDeviceWidth})`).matches;
  22     const paneWidth = 250;
  23
  24     current
  25       .hide()
  26       .trigger("hide");
  27
  28     currentButton
  29       .parent()
  30       .removeClass("active");
  31
  32     if (current === pane) {
  33       $(sidebar).hide();
  34       $("#content").addClass("overlay-right-sidebar");
  35       current = currentButton = $();
  36       if (isMediumDevice) {
  37         map.panBy([0, -$("#map").height() / 2], { animate: false });
  38       } else if ($("html").attr("dir") === "rtl") {
  39         map.panBy([-paneWidth, 0], { animate: false });
  40       }
  41     } else {
  42       $(sidebar).show();
  43       $("#content").removeClass("overlay-right-sidebar");
  44       current = pane;
  45       currentButton = button || $();
  46       if (isMediumDevice) {
  47         map.panBy([0, $("#map").height()], { animate: false });
  48       } else if ($("html").attr("dir") === "rtl") {
  49         map.panBy([paneWidth, 0], { animate: false });
  50       }
  51     }
  52
  53     map.invalidateSize({ pan: false, animate: false });
  54
  55     current
  56       .show()
  57       .trigger("show");
  58
  59     currentButton
  60       .parent()
  61       .addClass("active");
  62   };
  63
  64   sidebar.find(".sidebar-close-controls button").on("click", () => {
  65     control.togglePane(current, currentButton);
  66   });
  67
  68   return control;
  69 };