Update leaflet.locationfilter

This commit is contained in:
John Firebaugh 2012-10-20 16:49:45 -07:00
parent 6054eea238
commit 378d08f2c9
3 changed files with 38 additions and 39 deletions

View file

@ -42,10 +42,11 @@ $(document).ready(function () {
var locationFilter = new L.LocationFilter({ var locationFilter = new L.LocationFilter({
enableButton: false, enableButton: false,
adjustButton: false, adjustButton: false
onChange: getData
}).addTo(map); }).addTo(map);
locationFilter.on("change", getData);
$("#sidebar_title").html(I18n.t('browse.start_rjs.data_frame_title')); $("#sidebar_title").html(I18n.t('browse.start_rjs.data_frame_title'));
$("#sidebar_content").html(sidebarHtml); $("#sidebar_content").html(sidebarHtml);
@ -77,6 +78,7 @@ $(document).ready(function () {
map.removeLayer(dataLayer); map.removeLayer(dataLayer);
map.removeLayer(locationFilter); map.removeLayer(locationFilter);
map.off("moveend", updateData); map.off("moveend", updateData);
locationFilter.off("change", getData);
}); });
function enableFilter() { function enableFilter() {

View file

@ -16,9 +16,10 @@ $(document).ready(function () {
var locationFilter = new L.LocationFilter({ var locationFilter = new L.LocationFilter({
enableButton: false, enableButton: false,
adjustButton: false, adjustButton: false,
onChange: filterChanged
}).addTo(map); }).addTo(map);
locationFilter.on("change", filterChanged);
map.on("moveend", mapMoved); map.on("moveend", mapMoved);
map.on("baselayerchange", htmlUrlChanged); map.on("baselayerchange", htmlUrlChanged);
@ -54,6 +55,7 @@ $(document).ready(function () {
map.off("moveend", mapMoved); map.off("moveend", mapMoved);
map.off("baselayerchange", htmlUrlChanged); map.off("baselayerchange", htmlUrlChanged);
locationFilter.off("change", filterChanged);
}); });
function getBounds() { function getBounds() {

View file

@ -91,6 +91,8 @@ L.Control.ButtonContainer = L.Control.extend({
}); });
L.LocationFilter = L.Class.extend({ L.LocationFilter = L.Class.extend({
includes: L.Mixin.Events,
options: { options: {
enableButton: { enableButton: {
enableText: "Select area", enableText: "Select area",
@ -136,7 +138,7 @@ L.LocationFilter = L.Class.extend({
this._sw = bounds.getSouthWest(); this._sw = bounds.getSouthWest();
this._se = bounds.getSouthEast(); this._se = bounds.getSouthEast();
this._draw(); this._draw();
this._callCallback("onChange"); this.fire("change", {bounds: bounds});
}, },
isEnabled: function() { isEnabled: function() {
@ -187,10 +189,10 @@ L.LocationFilter = L.Class.extend({
var markerPos = that._moveMarker.getLatLng(), var markerPos = that._moveMarker.getLatLng(),
latDelta = markerPos.lat-that._nw.lat, latDelta = markerPos.lat-that._nw.lat,
lngDelta = markerPos.lng-that._nw.lng; lngDelta = markerPos.lng-that._nw.lng;
that._nw = new L.LatLng(that._nw.lat+latDelta, that._nw.lng+lngDelta); that._nw = new L.LatLng(that._nw.lat+latDelta, that._nw.lng+lngDelta, true);
that._ne = new L.LatLng(that._ne.lat+latDelta, that._ne.lng+lngDelta); that._ne = new L.LatLng(that._ne.lat+latDelta, that._ne.lng+lngDelta, true);
that._sw = new L.LatLng(that._sw.lat+latDelta, that._sw.lng+lngDelta); that._sw = new L.LatLng(that._sw.lat+latDelta, that._sw.lng+lngDelta, true);
that._se = new L.LatLng(that._se.lat+latDelta, that._se.lng+lngDelta); that._se = new L.LatLng(that._se.lat+latDelta, that._se.lng+lngDelta, true);
that._draw(); that._draw();
}); });
this._setupDragendListener(this._moveMarker); this._setupDragendListener(this._moveMarker);
@ -216,8 +218,8 @@ L.LocationFilter = L.Class.extend({
latMarker = options.moveAlong.lat, latMarker = options.moveAlong.lat,
lngMarker = options.moveAlong.lng; lngMarker = options.moveAlong.lng;
// Move follower markers when this marker is moved // Move follower markers when this marker is moved
latMarker.setLatLng(new L.LatLng(curPosition.lat, latMarker.getLatLng().lng)); latMarker.setLatLng(new L.LatLng(curPosition.lat, latMarker.getLatLng().lng, true));
lngMarker.setLatLng(new L.LatLng(lngMarker.getLatLng().lat, curPosition.lng)); lngMarker.setLatLng(new L.LatLng(lngMarker.getLatLng().lat, curPosition.lng, true));
// Sort marker positions in nw, ne, sw, se order // Sort marker positions in nw, ne, sw, se order
var corners = [that._nwMarker.getLatLng(), var corners = [that._nwMarker.getLatLng(),
that._neMarker.getLatLng(), that._neMarker.getLatLng(),
@ -239,22 +241,13 @@ L.LocationFilter = L.Class.extend({
this._setupDragendListener(marker); this._setupDragendListener(marker);
}, },
/* Call the callback (given by name) if it was supplied in options */ /* Emit a change event whenever dragend is triggered on the
_callCallback: function(callbackName) {
if (this.options[callbackName]) {
this.options[callbackName](this.getBounds());
}
},
/* Call the onChange callback whenever dragend is triggered on the
given marker */ given marker */
_setupDragendListener: function(marker) { _setupDragendListener: function(marker) {
if (this.options.onChange) { var that = this;
var that = this; marker.on('dragend', function(e) {
marker.on('dragend', function(e) { that.fire("change", {bounds: that.getBounds()});
that._callCallback("onChange"); });
});
}
}, },
/* Create bounds for the mask rectangles and the location /* Create bounds for the mask rectangles and the location
@ -263,9 +256,9 @@ L.LocationFilter = L.Class.extend({
var mapBounds = this._map.getBounds(), var mapBounds = this._map.getBounds(),
outerBounds = new L.LatLngBounds( outerBounds = new L.LatLngBounds(
new L.LatLng(mapBounds.getSouthWest().lat-0.1, new L.LatLng(mapBounds.getSouthWest().lat-0.1,
mapBounds.getSouthWest().lng-0.1), mapBounds.getSouthWest().lng-0.1, true),
new L.LatLng(mapBounds.getNorthEast().lat+0.1, new L.LatLng(mapBounds.getNorthEast().lat+0.1,
mapBounds.getNorthEast().lng+0.1) mapBounds.getNorthEast().lng+0.1, true)
); );
// The south west and north east points of the mask */ // The south west and north east points of the mask */
@ -273,10 +266,10 @@ L.LocationFilter = L.Class.extend({
this._one = outerBounds.getNorthEast(); this._one = outerBounds.getNorthEast();
// Bounds for the mask rectangles // Bounds for the mask rectangles
this._northBounds = new L.LatLngBounds(new L.LatLng(this._ne.lat, this._osw.lng), this._one), this._northBounds = new L.LatLngBounds(new L.LatLng(this._ne.lat, this._osw.lng, true), this._one);
this._westBounds = new L.LatLngBounds(new L.LatLng(this._sw.lat, this._osw.lng), this._nw), this._westBounds = new L.LatLngBounds(new L.LatLng(this._sw.lat, this._osw.lng, true), this._nw);
this._eastBounds = new L.LatLngBounds(this._se, new L.LatLng(this._ne.lat, this._one.lng)), this._eastBounds = new L.LatLngBounds(this._se, new L.LatLng(this._ne.lat, this._one.lng, true));
this._southBounds = new L.LatLngBounds(this._osw, new L.LatLng(this._sw.lat, this._one.lng)); this._southBounds = new L.LatLngBounds(this._osw, new L.LatLng(this._sw.lat, this._one.lng, true));
}, },
/* Initializes rectangles and markers */ /* Initializes rectangles and markers */
@ -411,8 +404,8 @@ L.LocationFilter = L.Class.extend({
this._enabled = true; this._enabled = true;
// Call the enabled callback // Fire the enabled event
this._callCallback("onEnabled"); this.fire("enabled");
}, },
/* Disable the location filter */ /* Disable the location filter */
@ -440,8 +433,8 @@ L.LocationFilter = L.Class.extend({
this._enabled = false; this._enabled = false;
// Call the disabled callback // Fire the disabled event
this._callCallback("onDisabled"); this.fire("disabled");
}, },
/* Create a button that allows the user to adjust the location /* Create a button that allows the user to adjust the location
@ -454,7 +447,7 @@ L.LocationFilter = L.Class.extend({
onClick: function(event) { onClick: function(event) {
that._adjustToMap(); that._adjustToMap();
that._callCallback("onAdjustToZoomClick"); that.fire("adjustToZoomClick");
} }
}).addTo(this._buttonContainer); }).addTo(this._buttonContainer);
}, },
@ -474,16 +467,18 @@ L.LocationFilter = L.Class.extend({
if (!that._enabled) { if (!that._enabled) {
// Enable the location filter // Enable the location filter
that.enable(); that.enable();
that._callCallback("onEnableClick"); that.fire("enableClick");
} else { } else {
// Disable the location filter // Disable the location filter
that.disable(); that.disable();
that._callCallback("onDisableClick"); that.fire("disableClick");
} }
} }
}).addTo(this._buttonContainer); }).addTo(this._buttonContainer);
} }
this._buttonContainer.addTo(this._map); if (this.options.enableButton || this.options.adjustButton) {
this._buttonContainer.addTo(this._map);
}
} }
}); });