X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/eebe1f1d3ed885e94725c07d24e0483f603f03da..33a2ccf560dbb4054d260a7ba9b4a572d4668ae9:/app/assets/javascripts/leaflet.layers.js?ds=inline diff --git a/app/assets/javascripts/leaflet.layers.js b/app/assets/javascripts/leaflet.layers.js index bbc84701c..82efab506 100644 --- a/app/assets/javascripts/leaflet.layers.js +++ b/app/assets/javascripts/leaflet.layers.js @@ -1,149 +1,156 @@ -L.OSM.layers = function(options) { - var control = L.control(options); +L.OSM.layers = function (options) { + var control = L.OSM.sidebarPane(options, "layers", "javascripts.map.layers.title", "javascripts.map.layers.header"); - control.onAdd = function (map) { + control.onAddPane = function (map, button, $ui, toggle) { var layers = options.layers; - var $container = $('
') - .attr('class', 'control-layers'); + var baseSection = $("
") + .attr("class", "base-layers d-grid gap-3 p-3 border-bottom border-secondary-subtle") + .appendTo($ui); - var link = $('') - .attr('class', 'control-button') - .attr('href', '#') - .attr('title', 'Layers') - .html('') - .on('click', toggle) - .appendTo($container); + layers.forEach(function (layer, i) { + var id = "map-ui-layer-" + i; - var $ui = $('
') - .attr('class', 'layers-ui') - .appendTo(options.uiPane); + var buttonContainer = $("
") + .appendTo(baseSection); - $('

') - .text(I18n.t('javascripts.map.layers.header')) - .appendTo($ui); + var mapContainer = $("
") + .appendTo(buttonContainer); - if (OSM.STATUS != 'api_offline' && OSM.STATUS != 'database_offline') { - var overlaySection = $('
') - .addClass('overlay-layers') - .appendTo($ui); + var input = $("") + .prop("id", id) + .prop("checked", map.hasLayer(layer)) + .appendTo(buttonContainer); - $('

') - .text(I18n.t('javascripts.map.layers.overlays')) - .appendTo(overlaySection); + var item = $("

    ') - .appendTo(overlaySection); + map.whenReady(function () { + var miniMap = L.map(mapContainer[0], { attributionControl: false, zoomControl: false, keyboard: false }) + .addLayer(new layer.constructor({ apikey: layer.options.apikey })); - function addOverlay(layer, name) { - var item = $('
  • ') - .appendTo(list); + miniMap.dragging.disable(); + miniMap.touchZoom.disable(); + miniMap.doubleClickZoom.disable(); + miniMap.scrollWheelZoom.disable(); - var label = $('