[Commits] r1078 - in core/trunk/geoext: examples lib/GeoExt/widgets tests/lib/GeoExt/widgets

[commits at geoext.org]

Author: fredj
Date: 2009-06-15 08:31:36 +0200 (Mon, 15 Jun 2009)
New Revision: 1078

Modified:
   core/trunk/geoext/examples/zoomslider.js
   core/trunk/geoext/lib/GeoExt/widgets/ZoomSlider.js
   core/trunk/geoext/tests/lib/GeoExt/widgets/ZoomSlider.html
Log:
zoom slider: add a new 'aggressive' option to choose which slider event will
zoom the map. If aggressive is true the map will zoom when the thumb is moved,
else the map is zoomed when the thumb is released (default). Thanks ahocevar
for the review and unit test. (closes #89) 



Modified: core/trunk/geoext/examples/zoomslider.js
===================================================================
--- core/trunk/geoext/examples/zoomslider.js	2009-06-13 12:48:11 UTC (rev 1077)
+++ core/trunk/geoext/examples/zoomslider.js	2009-06-15 06:31:36 UTC (rev 1078)
@@ -38,6 +38,7 @@
     // create a separate slider bound to the map but displayed elsewhere
     slider = new GeoExt.ZoomSlider({
         map: panel.map,
+        aggressive: true,                                                                                                                                                   
         width: 200,
         plugins: new GeoExt.ZoomSliderTip({
             template: "<div>Zoom Level: {zoom}</div>"

Modified: core/trunk/geoext/lib/GeoExt/widgets/ZoomSlider.js
===================================================================
--- core/trunk/geoext/lib/GeoExt/widgets/ZoomSlider.js	2009-06-13 12:48:11 UTC (rev 1077)
+++ core/trunk/geoext/lib/GeoExt/widgets/ZoomSlider.js	2009-06-15 06:31:36 UTC (rev 1078)
@@ -47,6 +47,7 @@
  *          extent: [-5, 35, 15, 55],
  *          items: [{
  *              xtype: "gx_zoomslider",
+ *              aggressive: true,
  *              vertical: true,
  *              height: 100,
  *              x: 10,
@@ -73,6 +74,13 @@
      *  The CSS class name for the slider elements.  Default is "gx-zoomslider".
      */
     baseCls: "gx-zoomslider",
+
+    /** api: config[aggressive]
+     *  ``Boolean``
+     *  If set to true, the map is zoomed as soon as the thumb is moved. Otherwise 
+     *  the map is zoomed when the thumb is released (default).
+     */
+    aggressive: false,
     
     /** private: property[updating]
      *  ``Boolean``
@@ -92,12 +100,13 @@
             }
             this.bind(this.map);
         }
-        this.on({
-            "changecomplete": this.changeHandler,
-            "beforedestroy": this.unbind,
-            scope: this
-        });
-        
+
+        if (this.aggressive === true) {
+            this.on('change', this.changeHandler, this);
+        } else {
+            this.on('changecomplete', this.changeHandler, this);
+        }
+        this.on("beforedestroy", this.unbind, this);        
     },
     
     /** private: method[onRender]

Modified: core/trunk/geoext/tests/lib/GeoExt/widgets/ZoomSlider.html
===================================================================
--- core/trunk/geoext/tests/lib/GeoExt/widgets/ZoomSlider.html	2009-06-13 12:48:11 UTC (rev 1077)
+++ core/trunk/geoext/tests/lib/GeoExt/widgets/ZoomSlider.html	2009-06-15 06:31:36 UTC (rev 1078)
@@ -57,8 +57,36 @@
             map.destroy();
 
         }
+        
+        function test_zoomslider_aggressive(t) {
+            t.plan(2);
+            var slider1 = new GeoExt.ZoomSlider({
+                renderTo: document.body
+            });
+            slider1.on({
+                "changecomplete": function() {
+                    t.ok(true, "changecomplete triggered in non-aggressive mode");
+                }
+            });
+            var slider2 = new GeoExt.ZoomSlider({
+                renderTo: document.body,
+                aggressive: true
+            });
+            slider2.on({
+                "change": function() {
+                    t.ok(true, "change triggered in aggressive mode");
+                }
+            });
+            
+            slider1.setValue(slider1.maxValue, undefined, true);
+            slider2.setValue(slider2.maxValue, undefined, true);
+            
+            slider1.destroy();
+            slider2.destroy();
+        }
 
     </script>
+  </head>
   <body>
     <div id="map" style="width: 512px; height: 256px;"></div>
   </body>