-L.OSM.sidebar = function(selector) {
+L.OSM.sidebar = function (selector) {
var control = {},
- sidebar = $(selector),
- current = $();
+ sidebar = $(selector),
+ current = $(),
+ currentButton = $(),
+ map;
- control.addPane = function(pane) {
+ control.addTo = function (_) {
+ map = _;
+ return control;
+ };
+
+ control.addPane = function (pane) {
pane
.hide()
.appendTo(sidebar);
};
- control.togglePane = function(pane) {
- var controlContainer = $('.leaflet-control-container .leaflet-top.leaflet-right');
-
+ control.togglePane = function (pane, button) {
current
.hide()
- .trigger('hide');
+ .trigger("hide");
+
+ currentButton
+ .removeClass("active");
if (current === pane) {
$(sidebar).hide();
- controlContainer.css({paddingRight: '0'});
- current = $();
+ current = currentButton = $();
} else {
$(sidebar).show();
- controlContainer.css({paddingRight: '200px'});
current = pane;
+ currentButton = button || $();
}
+ map.invalidateSize({ pan: false, animate: false });
+
current
.show()
- .trigger('show');
+ .trigger("show");
+
+ currentButton
+ .addClass("active");
};
return control;