X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/ef73cc1f574124b10cda75188aa542d9f4d802bb..HEAD:/app/assets/javascripts/leaflet.layers.js diff --git a/app/assets/javascripts/leaflet.layers.js b/app/assets/javascripts/leaflet.layers.js index 15f114a5c..3f577b532 100644 --- a/app/assets/javascripts/leaflet.layers.js +++ b/app/assets/javascripts/leaflet.layers.js @@ -1,92 +1,154 @@ -//= require templates/map/layers - -L.OSM.Layers = L.Control.extend({ - onAdd: function (map) { - this._map = map; - this._initLayout(map); - return this._container; - }, - - _initLayout: function () { - var className = 'leaflet-control-map-ui', - container = this._container = L.DomUtil.create('div', className); - - var link = L.DomUtil.create('a', 'control-button', container); - link.innerHTML = ""; - link.href = '#'; - link.title = 'Layers'; - - this._ui = $(L.DomUtil.create('div', 'layers-ui', this.options.uiPane)) - .html(JST["templates/map/layers"]()); - - var list = this._ui.find('.base-layers ul'); - - this.options.layers.forEach(function(layer) { - var item = $('
') - .appendTo(list); - - if (this._map.hasLayer(layer)) { - item.addClass('active'); - } - - var div = $('') - .appendTo(item); - - this._map.whenReady(function() { - var map = L.map(div[0], {attributionControl: false, zoomControl: false}) - .setView(this._map.getCenter(), Math.max(this._map.getZoom() - 2, 0)) - .addLayer(new layer.constructor); - - map.dragging.disable(); - map.touchZoom.disable(); - map.doubleClickZoom.disable(); - map.scrollWheelZoom.disable(); - }, this); - - var label = $('') - .text(layer.options.name) - .appendTo(item); - - item.on('click', function() { - this.options.layers.forEach(function(other) { - if (other === layer) { - this._map.addLayer(other); - } else { - this._map.removeLayer(other); - } - }, this); - }.bind(this)); +L.OSM.layers = function (options) { + var control = L.OSM.sidebarPane(options, "layers", "javascripts.map.layers.title", "javascripts.map.layers.header"); + + control.onAddPane = function (map, button, $ui, toggle) { + var layers = options.layers; + + var baseSection = $("