Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Merge pull request #48 from tschaub/minzoom-slider

Fixing the ZoomSlider size for OpenLayers >2.11. Thanks @tschaub for the improvements and additional tests.
  • Loading branch information...
commit 34c8cd22a774c90fee55f8c4648c98d4ec5fa188 2 parents c30007f + 68a9844
@ahocevar ahocevar authored
View
49 lib/GeoExt/widgets/ZoomSlider.js
@@ -177,14 +177,19 @@ GeoExt.ZoomSlider = Ext.extend(Ext.slider.SingleSlider, {
bind: function(map) {
this.map = map;
this.map.events.on({
- zoomend: this.update,
+ zoomend: this.onZoomEnd,
+ updatesize: this.initZoomValues,
changebaselayer: this.initZoomValues,
scope: this
});
- if(this.map.baseLayer) {
- this.initZoomValues();
- this.update();
- }
+ this.initZoomValues();
+ },
+
+ /** private: method[onZoomEnd]
+ * Registered as a listener for zoomend.
+ */
+ onZoomEnd: function() {
+ this.update();
},
/** private: method[unbind]
@@ -192,7 +197,8 @@ GeoExt.ZoomSlider = Ext.extend(Ext.slider.SingleSlider, {
unbind: function() {
if(this.map && this.map.events) {
this.map.events.un({
- zoomend: this.update,
+ zoomend: this.onZoomEnd,
+ updatesize: this.initZoomValues,
changebaselayer: this.initZoomValues,
scope: this
});
@@ -204,12 +210,18 @@ GeoExt.ZoomSlider = Ext.extend(Ext.slider.SingleSlider, {
*/
initZoomValues: function() {
var layer = this.map.baseLayer;
- if(this.initialConfig.minValue === undefined) {
- this.minValue = layer.minZoomLevel || 0;
- }
- if(this.initialConfig.maxValue === undefined) {
- this.maxValue = layer.minZoomLevel == null ?
- layer.numZoomLevels - 1 : layer.maxZoomLevel;
+ if (layer) {
+ if(this.initialConfig.minValue === undefined) {
+ //TODO remove check for getMinZoom when we require OpenLayers 2.12.
+ var minZoom = this.map.getMinZoom ? this.map.getMinZoom() : 0;
+ this.minValue = Math.max(minZoom, layer.minZoomLevel || 0);
+ }
+ if(this.initialConfig.maxValue === undefined) {
+ this.maxValue = layer.minZoomLevel == null ?
+ layer.numZoomLevels - 1 : layer.maxZoomLevel;
+ }
+ // reset the thumb value so it gets repositioned when we call update
+ this.update(true);
}
},
@@ -253,11 +265,22 @@ GeoExt.ZoomSlider = Ext.extend(Ext.slider.SingleSlider, {
},
/** private: method[update]
+ * :param force: ``Boolean`` Force an update of the thumb position even
+ * if the value may not have changed (but min/max or length have).
+ *
* Registered as a listener for map zoomend. Updates the value of the slider.
*/
- update: function() {
+ update: function(force) {
if(this.rendered && this.map) {
this.updating = true;
+ if (force) {
+ /**
+ * This triggers repositioning even if the value doesn't
+ * change. We want this when the min/max values change but
+ * the zoom level doesn't.
+ */
+ this.thumbs[0].value = null;
+ }
this.setValue(this.map.getZoom());
this.updating = false;
}
View
68 tests/lib/GeoExt/widgets/ZoomSlider.html
@@ -85,6 +85,74 @@
slider2.destroy();
}
+ function test_more_aggressive(t) {
+ t.plan(2);
+
+ var panel = new GeoExt.MapPanel({
+ title: "Map",
+ renderTo: "map",
+ height: 256,
+ width: 512,
+ map: {
+ controls: [new OpenLayers.Control.Navigation()],
+ maxResolution: 0.703125
+ },
+ layers: [new OpenLayers.Layer.WMS(
+ "Global Imagery",
+ "http://maps.opengeo.org/geowebcache/service/wms",
+ {layers: "bluemarble"}
+ )],
+ extent: [-5, 35, 15, 55]
+ });
+
+ // create a separate slider bound to the map but displayed elsewhere
+ var slider = new GeoExt.ZoomSlider({
+ map: panel.map,
+ aggressive: true,
+ width: 200,
+ plugins: new GeoExt.ZoomSliderTip({
+ template: "<div>Zoom Level: {zoom}</div>"
+ }),
+ renderTo: document.body
+ });
+
+ t.eq(panel.map.getZoom(), 3, "map zoom");
+ t.eq(slider.getValue(), 3, "slider value");
+
+ slider.destroy();
+ panel.destroy();
+
+ }
+
+
+ function test_zoomslider_update(t) {
+ t.plan(4);
+
+ var map = new OpenLayers.Map({
+ div: "map",
+ allOverlays: true
+ });
+ map.addLayer(new OpenLayers.Layer("", {wrapDateLine: true}));
+ map.zoomToMaxExtent();
+
+ var slider = new GeoExt.ZoomSlider({
+ map: map,
+ renderTo: document.body
+ });
+
+ t.eq(slider.minValue, 1, "slider min is 1 (restricted zoom range)");
+ t.eq(slider.maxValue, 15, "slider can go to 15");
+
+ map.div.style.width = "1024px";
+ map.updateSize();
+
+ t.eq(slider.minValue, 2, "slider min is 2 (restricted zoom range)");
+ t.eq(slider.maxValue, 15, "slider can go to 15");
+
+ map.div.style.width = "512px";
+ map.destroy();
+ }
+
</script>
</head>
<body>
Please sign in to comment.
Something went wrong with that request. Please try again.