cst1/openstreetmap-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Pan map when showing/hiding sidebars depending on ltr/rtl

Browse source
This commit is contained in:
Anton Khorev 2022-09-22 16:33:28 +03:00
parent 09263bc4a1
commit c02b131a29
2 changed files with 16 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

11
app/assets/javascripts/leaflet.map.js
View file

@ -300,12 +300,17 @@ L.OSM.Map = L.Map.extend({
}, },
setSidebarOverlaid: function (overlaid) { setSidebarOverlaid: function (overlaid) {
var sidebarWidth = 350;
if (overlaid && !$("#content").hasClass("overlay-sidebar")) { if (overlaid && !$("#content").hasClass("overlay-sidebar")) {
$("#content").addClass("overlay-sidebar"); $("#content").addClass("overlay-sidebar");
this.invalidateSize({ pan: false }) this.invalidateSize({ pan: false });
.panBy([-350, 0], { animate: false }); if ($("html").attr("dir") !== "rtl") {
this.panBy([-sidebarWidth, 0], { animate: false });
}
} else if (!overlaid && $("#content").hasClass("overlay-sidebar")) { } else if (!overlaid && $("#content").hasClass("overlay-sidebar")) {
this.panBy([350, 0], { animate: false }); if ($("html").attr("dir") !== "rtl") {
this.panBy([sidebarWidth, 0], { animate: false });
}
$("#content").removeClass("overlay-sidebar"); $("#content").removeClass("overlay-sidebar");
this.invalidateSize({ pan: false }); this.invalidateSize({ pan: false });
} }

8
app/assets/javascripts/leaflet.sidebar.js
View file

@ -17,6 +17,8 @@ L.OSM.sidebar = function (selector) {
}; };
control.togglePane = function (pane, button) { control.togglePane = function (pane, button) {
var paneWidth = 250;
current current
.hide() .hide()
.trigger("hide"); .trigger("hide");
@ -25,12 +27,18 @@ L.OSM.sidebar = function (selector) {
.removeClass("active"); .removeClass("active");
if (current === pane) { if (current === pane) {
if ($("html").attr("dir") === "rtl") {
map.panBy([-paneWidth, 0], { animate: false });
}
$(sidebar).hide(); $(sidebar).hide();
current = currentButton = $(); current = currentButton = $();
} else { } else {
$(sidebar).show(); $(sidebar).show();
current = pane; current = pane;
currentButton = button || $(); currentButton = button || $();
if ($("html").attr("dir") === "rtl") {
map.panBy([paneWidth, 0], { animate: false });
}
} }
map.invalidateSize({ pan: false, animate: false }); map.invalidateSize({ pan: false, animate: false });