90 lines
2.2 KiB
JavaScript
90 lines
2.2 KiB
JavaScript
L.OSM.key = function (options) {
|
|
var control = L.control(options);
|
|
|
|
control.onAdd = function (map) {
|
|
var $container = $("<div>")
|
|
.attr("class", "control-key");
|
|
|
|
var button = $("<a>")
|
|
.attr("class", "control-button")
|
|
.attr("href", "#")
|
|
.html("<span class=\"icon key\"></span>")
|
|
.on("click", toggle)
|
|
.appendTo($container);
|
|
|
|
var $ui = $("<div>")
|
|
.attr("class", "key-ui");
|
|
|
|
$("<div>")
|
|
.attr("class", "sidebar_heading")
|
|
.appendTo($ui)
|
|
.append(
|
|
$("<span>")
|
|
.text(I18n.t("javascripts.close"))
|
|
.attr("class", "icon close")
|
|
.bind("click", toggle))
|
|
.append(
|
|
$("<h4>")
|
|
.text(I18n.t("javascripts.key.title")));
|
|
|
|
var $section = $("<div>")
|
|
.attr("class", "section")
|
|
.appendTo($ui);
|
|
|
|
options.sidebar.addPane($ui);
|
|
|
|
$ui
|
|
.on("show", shown)
|
|
.on("hide", hidden);
|
|
|
|
map.on("baselayerchange", updateButton);
|
|
|
|
updateButton();
|
|
|
|
function shown() {
|
|
map.on("zoomend baselayerchange", update);
|
|
$section.load("/key", update);
|
|
}
|
|
|
|
function hidden() {
|
|
map.off("zoomend baselayerchange", update);
|
|
}
|
|
|
|
function toggle(e) {
|
|
e.stopPropagation();
|
|
e.preventDefault();
|
|
if (!button.hasClass("disabled")) {
|
|
options.sidebar.togglePane($ui, button);
|
|
}
|
|
$(".leaflet-control .control-button").tooltip("hide");
|
|
}
|
|
|
|
function updateButton() {
|
|
var disabled = ["mapnik", "cyclemap"].indexOf(map.getMapBaseLayerId()) === -1;
|
|
button
|
|
.toggleClass("disabled", disabled)
|
|
.attr("data-original-title",
|
|
I18n.t(disabled ?
|
|
"javascripts.key.tooltip_disabled" :
|
|
"javascripts.key.tooltip"));
|
|
}
|
|
|
|
function update() {
|
|
var layer = map.getMapBaseLayerId(),
|
|
zoom = map.getZoom();
|
|
|
|
$(".mapkey-table-entry").each(function () {
|
|
var data = $(this).data();
|
|
if (layer === data.layer && zoom >= data.zoomMin && zoom <= data.zoomMax) {
|
|
$(this).show();
|
|
} else {
|
|
$(this).hide();
|
|
}
|
|
});
|
|
}
|
|
|
|
return $container[0];
|
|
};
|
|
|
|
return control;
|
|
};
|