cartodb/Leaflet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

clean up Control.Layers

Browse Source
This commit is contained in:
Vladimir Agafonkin 2013-12-04 14:18:00 +02:00
parent 81aa8e7298
commit 14afb4fa8f
1 changed files with 28 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
src/control/Control.Layers.js
View File

@ -29,43 +29,35 @@ L.Control.Layers = L.Control.extend({
this._initLayout();
this._update();
map
.on('layeradd', this._onLayerChange, this)
.on('layerremove', this._onLayerChange, this);
map.on('layeradd layerremove', this._onLayerChange, this);
return this._container;
},
onRemove: function (map) {
map
.off('layeradd', this._onLayerChange)
.off('layerremove', this._onLayerChange);
map.off('layeradd layerremove', this._onLayerChange, this);
},
addBaseLayer: function (layer, name) {
this._addLayer(layer, name);
this._update();
return this;
return this._update();
},
addOverlay: function (layer, name) {
this._addLayer(layer, name, true);
this._update();
return this;
return this._update();
},
removeLayer: function (layer) {
var id = L.stamp(layer);
delete this._layers[id];
this._update();
return this;
delete this._layers[L.stamp(layer)];
return this._update();
},
_initLayout: function () {
var className = 'leaflet-control-layers',
container = this._container = L.DomUtil.create('div', className);
//Makes this work on IE10 Touch devices by stopping it from firing a mouseout event when the touch is released
// makes this work on IE touch devices by stopping it from firing a mouseout event when the touch is released
container.setAttribute('aria-haspopup', true);
if (!L.Browser.touch) {
@ -84,6 +76,7 @@ L.Control.Layers = L.Control.extend({
.on(container, 'mouseover', this._expand, this)
.on(container, 'mouseout', this._collapse, this);
}
var link = this._layersLink = L.DomUtil.create('a', className + '-toggle', container);
link.href = '#';
link.title = 'Layers';
@ -92,11 +85,11 @@ L.Control.Layers = L.Control.extend({
L.DomEvent
.on(link, 'click', L.DomEvent.stop)
.on(link, 'click', this._expand, this);
}
else {
} else {
L.DomEvent.on(link, 'focus', this._expand, this);
}
//Work around for Firefox android issue https://github.com/Leaflet/Leaflet/issues/2033
// work around for Firefox Android issue https://github.com/Leaflet/Leaflet/issues/2033
L.DomEvent.on(form, 'click', function () {
setTimeout(L.bind(this._onInputClick, this), 0);
}, this);
@ -130,16 +123,12 @@ L.Control.Layers = L.Control.extend({
},
_update: function () {
if (!this._container) {
return;
}
if (!this._container) { return; }
this._baseLayersList.innerHTML = '';
this._overlaysList.innerHTML = '';
var baseLayersPresent = false,
overlaysPresent = false,
i, obj;
var baseLayersPresent, overlaysPresent, i, obj;
for (i in this._layers) {
obj = this._layers[i];
@ -149,6 +138,8 @@ L.Control.Layers = L.Control.extend({
}
this._separator.style.display = overlaysPresent && baseLayersPresent ? '' : 'none';
return this;
},
_onLayerChange: function (e) {
@ -172,11 +163,8 @@ L.Control.Layers = L.Control.extend({
// IE7 bugs out if you create a radio dynamically, so you have to do it this hacky way (see http://bit.ly/PqYLBe)
_createRadioElement: function (name, checked) {
var radioHtml = '<input type="radio" class="leaflet-control-layers-selector" name="' + name + '"';
if (checked) {
radioHtml += ' checked="checked"';
}
radioHtml += '/>';
var radioHtml = '<input type="radio" class="leaflet-control-layers-selector" name="' +
name + '"' + (checked ? ' checked="checked"' : '') + '/>';
var radioFragment = document.createElement('div');
radioFragment.innerHTML = radioHtml;
@ -186,8 +174,8 @@ L.Control.Layers = L.Control.extend({
_addItem: function (obj) {
var label = document.createElement('label'),
input,
checked = this._map.hasLayer(obj.layer);
checked = this._map.hasLayer(obj.layer),
input;
if (obj.overlay) {
input = document.createElement('input');
@ -215,21 +203,21 @@ L.Control.Layers = L.Control.extend({
},
_onInputClick: function () {
var i, input, obj,
inputs = this._form.getElementsByTagName('input'),
inputsLen = inputs.length;
var inputs = this._form.getElementsByTagName('input'),
input, layer, hasLayer;
this._handlingClick = true;
for (i = 0; i < inputsLen; i++) {
for (var i = 0, len = inputs.length; i < len; i++) {
input = inputs[i];
obj = this._layers[input.layerId];
layer = this._layers[input.layerId].layer;
hasLayer = this._map.hasLayer(layer);
if (input.checked && !this._map.hasLayer(obj.layer)) {
this._map.addLayer(obj.layer);
if (input.checked && !hasLayer) {
this._map.addLayer(layer);
} else if (!input.checked && this._map.hasLayer(obj.layer)) {
this._map.removeLayer(obj.layer);
} else if (!input.checked && hasLayer) {
this._map.removeLayer(layer);
}
}