Merge branch 'control-inheritance' of https://github.com/marcjansen/openlayers

lib/OpenLayers/Control/Pan.js

@@ -4,7 +4,7 @@
  * full text of the license. */
 
 /**
- * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Control/Button.js
  */
 
 /**
@@ -15,7 +15,7 @@
  * Inherits from:
  *  - <OpenLayers.Control>
  */
-OpenLayers.Control.Pan = OpenLayers.Class(OpenLayers.Control, {
+OpenLayers.Control.Pan = OpenLayers.Class(OpenLayers.Control.Button, {
 
     /** 
      * APIProperty: slideFactor
@@ -40,14 +40,6 @@ OpenLayers.Control.Pan = OpenLayers.Class(OpenLayers.Control, {
      */
     direction: null,
 
-    /**
-     * Property: type
-     * {String} The type of <OpenLayers.Control> -- When added to a 
-     *     <Control.Panel>, 'type' is used by the panel to determine how to 
-     *     handle our events.
-     */
-    type: OpenLayers.Control.TYPE_BUTTON,
-
     /**
      * Constructor: OpenLayers.Control.Pan 
      * Control which handles the panning (in any of the cardinal directions)
@@ -70,26 +62,27 @@ OpenLayers.Control.Pan = OpenLayers.Class(OpenLayers.Control, {
      * Method: trigger
      */
     trigger: function(){
+        if (this.map) {
+            var getSlideFactor = OpenLayers.Function.bind(function (dim) {
+                return this.slideRatio ?
+                    this.map.getSize()[dim] * this.slideRatio :
+                    this.slideFactor;
+            }, this);
     
-        var getSlideFactor = OpenLayers.Function.bind(function (dim) {
+            switch (this.direction) {
-            return this.slideRatio ?
+                case OpenLayers.Control.Pan.NORTH: 
-                this.map.getSize()[dim] * this.slideRatio :
+                    this.map.pan(0, -getSlideFactor("h"));
-                this.slideFactor;
+                    break;
-        }, this);
+                case OpenLayers.Control.Pan.SOUTH: 
-
+                    this.map.pan(0, getSlideFactor("h"));
-        switch (this.direction) {
+                    break;
-            case OpenLayers.Control.Pan.NORTH: 
+                case OpenLayers.Control.Pan.WEST: 
-                this.map.pan(0, -getSlideFactor("h"));
+                    this.map.pan(-getSlideFactor("w"), 0);
-                break;
+                    break;
-            case OpenLayers.Control.Pan.SOUTH: 
+                case OpenLayers.Control.Pan.EAST: 
-                this.map.pan(0, getSlideFactor("h"));
+                    this.map.pan(getSlideFactor("w"), 0);
-                break;
+                    break;
-            case OpenLayers.Control.Pan.WEST: 
+            }   
-                this.map.pan(-getSlideFactor("w"), 0);
-                break;
-            case OpenLayers.Control.Pan.EAST: 
-                this.map.pan(getSlideFactor("w"), 0);
-                break;
         }
     },
 

lib/OpenLayers/Control/ZoomIn.js

@@ -4,7 +4,7 @@
  * full text of the license. */
 
 /**
- * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Control/Button.js
  */
 
 /**
@@ -14,21 +14,15 @@
  * Inherits from:
  *  - <OpenLayers.Control>
  */
-OpenLayers.Control.ZoomIn = OpenLayers.Class(OpenLayers.Control, {
+OpenLayers.Control.ZoomIn = OpenLayers.Class(OpenLayers.Control.Button, {
 
-    /**
-     * Property: type
-     * {String} The type of <OpenLayers.Control> -- When added to a 
-     *     <Control.Panel>, 'type' is used by the panel to determine how to 
-     *     handle our events.
-     */
-    type: OpenLayers.Control.TYPE_BUTTON,
-    
     /**
      * Method: trigger
      */
     trigger: function(){
-        this.map.zoomIn();
+        if (this.map) {
+            this.map.zoomIn();
+        }
     },
 
     CLASS_NAME: "OpenLayers.Control.ZoomIn"

lib/OpenLayers/Control/ZoomOut.js

@@ -4,7 +4,7 @@
  * full text of the license. */
 
 /**
- * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Control/Button.js
  */
 
 /**
@@ -14,21 +14,15 @@
  * Inherits from:
  *  - <OpenLayers.Control>
  */
-OpenLayers.Control.ZoomOut = OpenLayers.Class(OpenLayers.Control, {
+OpenLayers.Control.ZoomOut = OpenLayers.Class(OpenLayers.Control.Button, {
 
-    /**
-     * Property: type
-     * {String} The type of <OpenLayers.Control> -- When added to a 
-     *     <Control.Panel>, 'type' is used by the panel to determine how to 
-     *     handle our events.
-     */
-    type: OpenLayers.Control.TYPE_BUTTON,
-    
     /**
      * Method: trigger
      */
     trigger: function(){
-        this.map.zoomOut();
+        if (this.map) {
+            this.map.zoomOut();
+        }
     },
 
     CLASS_NAME: "OpenLayers.Control.ZoomOut"

lib/OpenLayers/Control/ZoomToMaxExtent.js

@@ -4,7 +4,7 @@
  * full text of the license. */
 
 /**
- * @requires OpenLayers/Control.js
+ * @requires OpenLayers/Control/Button.js
  */
 
 /**
@@ -16,19 +16,14 @@
  * Inherits from:
  *  - <OpenLayers.Control>
  */
-OpenLayers.Control.ZoomToMaxExtent = OpenLayers.Class(OpenLayers.Control, {
+OpenLayers.Control.ZoomToMaxExtent = OpenLayers.Class(OpenLayers.Control.Button, {
 
     /**
-     * Property: type
-     * {String} The type of <OpenLayers.Control> -- When added to a 
-     *     <Control.Panel>, 'type' is used by the panel to determine how to 
-     *     handle our events.
-     */
-    type: OpenLayers.Control.TYPE_BUTTON,
-    
-    /*
      * Method: trigger
-     * Do the zoom.
+     * 
+     * Called whenever this control is being rendered inside of a panel and a 
+     *     click occurs on this controls element. Actually zooms to the maximum
+     *     extent of this controls map.
      */
     trigger: function() {
         if (this.map) {

tests/Control/Pan.html

@@ -0,0 +1,201 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <script src="../OLLoader.js"></script>
+        <script type="text/javascript">
+        
+function test_Pan_constructor (t) {
+    t.plan( 2 );
+    
+    // setup
+    var control = new OpenLayers.Control.Pan(
+        "Gargoyle" // the direction, here mocked up
+    );
+    
+    // tests
+    //
+    t.ok( 
+        control instanceof OpenLayers.Control.Pan, 
+        "new OpenLayers.Control.Pan returns object"
+    );
+    t.eq( 
+        control.displayClass, "olControlPanGargoyle", 
+        "displayClass is correct"
+    );
+    
+    // tear down
+    control.destroy();
+}
+
+function test_Pan_type (t) {
+    t.plan( 1 );
+    
+    // setup
+    var control = new OpenLayers.Control.Pan();
+    
+    // tests
+    //
+    t.eq( 
+        control.type, 
+        OpenLayers.Control.TYPE_BUTTON,
+        "Pan control is of type OpenLayers.Control.TYPE_BUTTON"
+    );
+    
+    // tear down
+    control.destroy();
+}
+
+function test_Pan_constants (t) {
+    var dirs = [
+            'North',
+            'East',
+            'South',
+            'West'
+        ],
+        numDirs = dirs.length,
+        dir, uc_dir;
+    
+    t.plan(numDirs);
+    
+    for ( ; numDirs > 0; numDirs-- ) {
+        dir = dirs[numDirs - 1 ];
+        uc_dir = dir.toUpperCase();
+        
+        t.eq(
+            OpenLayers.Control.Pan[ uc_dir ],
+            dir,
+            "A constant 'OpenLayers.Control.Pan." + uc_dir + "' is defined "+
+                "and has the correct value of '" + dir + "'."
+        );
+    }
+}
+
+function test_Pan_trigger (t) {
+    t.plan( 12 );
+    
+    // set up
+    var controls = {
+            n: new OpenLayers.Control.Pan(OpenLayers.Control.Pan.NORTH),
+            e: new OpenLayers.Control.Pan(OpenLayers.Control.Pan.EAST),
+            s: new OpenLayers.Control.Pan(OpenLayers.Control.Pan.SOUTH),
+            w: new OpenLayers.Control.Pan(OpenLayers.Control.Pan.WEST)
+        },
+        controlKey, control,
+        zoomlevel = 5,
+        center = new OpenLayers.LonLat(25,25),
+        log = {
+            dx: null,
+            dy: null
+        },
+        map = new OpenLayers.Map("map", {
+            allOverlays: true,
+            layers: [
+                new OpenLayers.Layer.Vector()
+            ],
+            center: center,
+            zoom: zoomlevel
+        }),
+        oldZoom;
+    
+    // overwrite native Map::pan
+    map.pan = function(dx, dy) {
+        log = {
+            dx: dx,
+            dy: dy
+        };
+        OpenLayers.Map.prototype.pan.apply(map, arguments);
+    };
+    
+    oldCenter = map.getCenter().toString();
+    
+    for (controlKey in controls) {
+        if (controls.hasOwnProperty(controlKey)) {
+            control = controls[controlKey];
+            // trigger the control; nothing should change, we aren't added yet.
+            control.trigger();
+            
+            t.ok(
+                log.dx === null && log.dy === null, 
+                'Calling trigger on a non added control doesn\'t do anything.'
+            );
+            
+            // reset log object
+            log = {
+                dx: null,
+                dy: null
+            };
+        }
+    }
+    
+    // now lets add the controls, and trigger them again
+    for (controlKey in controls) {
+        if (controls.hasOwnProperty(controlKey)) {
+            control = controls[controlKey];
+            map.addControl(control);
+            // trigger again, now ...
+            control.trigger();
+            
+            // ... the center should change ...
+            t.ok(
+                log.dx !== null && log.dy !== null,
+                'Calling trigger on an added pan control calls map.pan()... '
+            );
+            
+            // ... with sane arguments according to the passed direction.
+            switch (control.direction) {
+                case OpenLayers.Control.Pan.NORTH: 
+                    t.ok(
+                        log.dx === 0 && log.dy < 0,
+                        '... with sane arguments: pan north only results in ' +
+                            'negative delta y'
+                    );
+                    break;
+                case OpenLayers.Control.Pan.SOUTH: 
+                    t.ok(
+                        log.dx === 0 && log.dy > 0,
+                        '... with sane arguments: pan south only results in ' +
+                            'positive delta y'
+                    );
+                    break;
+                case OpenLayers.Control.Pan.WEST: 
+                    t.ok(
+                        log.dx < 0 && log.dy === 0,
+                        '... with sane arguments: pan west only results in ' +
+                            'negative delta x'
+                    );
+                    break;
+                case OpenLayers.Control.Pan.EAST: 
+                    t.ok(
+                        log.dx > 0 && log.dy === 0,
+                        '... with sane arguments: pan east only results in ' +
+                            'positive delta x'
+                    );
+                    break;
+            }
+            
+            // reset log-object
+            log = {
+                dx: null,
+                dy: null
+            };
+            // always set to initial center and zoom:
+            map.setCenter(center, zoomlevel);
+        }
+    }
+    
+    // tear down
+    for (controlKey in controls) {
+        if (controls.hasOwnProperty(controlKey)) {
+            control = controls[controlKey];
+            control.destroy();
+        }
+    }
+    map.destroy();
+}
+    
+        </script>
+    </head>
+    <body>
+        <div id="map" style="width: 1000px; height: 1000px;"></div>
+    </body>
+</html>

tests/Control/ZoomIn.html

@@ -0,0 +1,101 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <script src="../OLLoader.js"></script>
+        <script type="text/javascript">
+        
+function test_ZoomIn_constructor (t) {
+    t.plan( 2 );
+    
+    // setup
+    var control = new OpenLayers.Control.ZoomIn();
+    
+    // tests
+    //
+    t.ok( 
+        control instanceof OpenLayers.Control.ZoomIn, 
+        "new OpenLayers.Control.ZoomIn returns object"
+    );
+    t.eq( 
+        control.displayClass, "olControlZoomIn", 
+        "displayClass is correct"
+    );
+    
+    // tear down
+    control.destroy();
+}
+
+function test_ZoomIn_type (t) {
+    t.plan( 1 );
+    
+    // setup
+    var control = new OpenLayers.Control.ZoomIn();
+    
+    // tests
+    //
+    t.eq( 
+        control.type, 
+        OpenLayers.Control.TYPE_BUTTON,
+        "ZoomIn control is of type OpenLayers.Control.TYPE_BUTTON"
+    );
+    
+    // tear down
+    control.destroy();
+}
+
+function test_ZoomIn_trigger (t) {
+    t.plan( 2 );
+    
+    // set up
+    var control = new OpenLayers.Control.ZoomIn(),
+        zoomlevel = 5,
+        map = new OpenLayers.Map("map", {
+            allOverlays: true,
+            layers: [
+                new OpenLayers.Layer.Vector()
+            ],
+            center: new OpenLayers.LonLat(1,1),
+            zoom: zoomlevel
+        }),
+        oldZoom;
+    
+    oldZoom = map.getZoom();
+    
+    // tests
+    //
+    // trigger the control before it is being added,
+    // nothing should change
+    control.trigger();
+    
+    t.eq(
+        oldZoom, 
+        zoomlevel,
+        'Calling trigger on a non added control doesn\'t do anything ' +
+            '(map zoom is ' + oldZoom + ').'
+    );
+            
+    // now lets add the control
+    map.addControl(control);
+
+    // trigger it again, now the map should have a different extent
+    control.trigger();
+    
+    t.eq(
+        map.getZoom(),
+        zoomlevel + 1,
+        'Calling trigger on a added control changes the map zoom ' +
+            '(map zoom was ' + zoomlevel + 
+            ' and is now ' + map.getZoom() + ').'
+    );
+    
+    // tear down
+    control.destroy();
+    map.destroy();
+}
+    
+        </script>
+    </head>
+    <body>
+        <div id="map" style="width: 1000px; height: 1000px;"></div>
+    </body>
+</html>

tests/Control/ZoomOut.html

@@ -0,0 +1,100 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <script src="../OLLoader.js"></script>
+        <script type="text/javascript">
+        
+function test_ZoomOut_constructor (t) {
+    t.plan( 2 );
+    
+    // setup
+    var control = new OpenLayers.Control.ZoomOut();
+    
+    // tests
+    //
+    t.ok( 
+        control instanceof OpenLayers.Control.ZoomOut, 
+        "new OpenLayers.Control.ZoomOut returns object"
+    );
+    t.eq( 
+        control.displayClass, "olControlZoomOut", 
+        "displayClass is correct"
+    );
+    
+    // tear down
+    control.destroy();
+}
+
+function test_ZoomOut_type(t){
+    t.plan( 1 );
+    
+    // setup
+    var control = new OpenLayers.Control.ZoomOut();
+    
+    // check that the type of the control equals OpenLayers.Control.TYPE_BUTTON
+    t.eq(
+        control.type,
+        OpenLayers.Control.TYPE_BUTTON,
+        'ZoomOut-control is of type "OpenLayers.Control.TYPE_BUTTON".'
+    );
+    
+    // tear down
+    control.destroy();
+}
+
+function test_ZoomOut_trigger (t) {
+    t.plan( 2 );
+    
+    // set up
+    var control = new OpenLayers.Control.ZoomOut(),
+        zoomlevel = 5,
+        map = new OpenLayers.Map("map", {
+            allOverlays: true,
+            layers: [
+                new OpenLayers.Layer.Vector()
+            ],
+            center: new OpenLayers.LonLat(1,1),
+            zoom: zoomlevel
+        }),
+        oldZoom;
+    
+    oldZoom = map.getZoom();
+    
+    // tests
+    //
+    // trigger the control before it is being added,
+    // nothing should change
+    control.trigger();
+    
+    t.eq(
+        oldZoom, 
+        zoomlevel,
+        'Calling trigger on a non added control doesn\'t do anything ' +
+            '(map zoom is ' + oldZoom + ').'
+    );
+            
+    // now lets add the control
+    map.addControl(control);
+
+    // trigger it again, now the map should have a different extent
+    control.trigger();
+    
+    t.eq(
+        map.getZoom(),
+        zoomlevel - 1,
+        'Calling trigger on a added control changes the map zoom ' +
+            '(map zoom was ' + zoomlevel + 
+            ' and is now ' + map.getZoom() + ').'
+    );
+    
+    // tear down
+    control.destroy();
+    map.destroy();
+}
+    
+        </script>
+    </head>
+    <body>
+        <div id="map" style="width: 1000px; height: 1000px;"></div>
+    </body>
+</html>

tests/Control/ZoomToMaxExtent.html

@@ -0,0 +1,102 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <script src="../OLLoader.js"></script>
+        <script type="text/javascript">
+        
+function test_ZoomToMaxExtent_constructor (t) {
+    t.plan( 2 );
+    
+    // setup
+    var control = new OpenLayers.Control.ZoomToMaxExtent();
+    
+    // tests
+    //
+    t.ok( 
+        control instanceof OpenLayers.Control.ZoomToMaxExtent, 
+        "new OpenLayers.Control.ZoomToMaxExtent returns object"
+    );
+    t.eq( 
+        control.displayClass, "olControlZoomToMaxExtent", 
+        "displayClass is correct"
+    );
+    
+    // tear down
+    control.destroy();
+}
+
+function test_ZoomToMaxExtent_type (t) {
+    t.plan( 1 );
+    
+    // setup
+    var control = new OpenLayers.Control.ZoomToMaxExtent();
+    
+    // check that the type of the control equals OpenLayers.Control.TYPE_BUTTON
+    t.eq(
+        control.type,
+        OpenLayers.Control.TYPE_BUTTON,
+        'ZoomToMaxExtent-control is of type "OpenLayers.Control.TYPE_BUTTON".'
+    );
+    
+    // tear down
+    control.destroy();
+}
+
+function test_ZoomToMaxExtent_trigger (t) {
+    t.plan( 2 );
+    
+    // set up
+    var mapsMaxExtent = new OpenLayers.Bounds(0, 0, 45, 45),
+        mapsInitialExtent = new OpenLayers.Bounds(5, 5, 7, 7),
+        control = new OpenLayers.Control.ZoomToMaxExtent(),
+        map = new OpenLayers.Map("map", {
+            maxExtent: mapsMaxExtent,
+            allOverlays: true,
+            fractionalZoom: true,
+            layers: [
+                new OpenLayers.Layer.Vector()
+            ]
+        }),
+        oldExtent;
+    
+    map.zoomToExtent(mapsInitialExtent);
+    
+    oldExtent = map.getExtent().toString();
+    
+    // tests
+    //
+    // trigger the control before it is being added,
+    // nothing should change
+    control.trigger();
+    t.eq(
+        oldExtent, 
+        map.getExtent().toString(),
+        'Calling trigger on a non added control doesn\'t do anything ' +
+            '(map extent is "' + oldExtent + '").'
+    );
+            
+    // now lets add the control
+    map. addControl(control);
+    
+    // trigger it again, now the map should have a different extent
+    control.trigger();
+    
+    t.eq(
+        map.getExtent().toString(),
+        mapsMaxExtent.toString(),
+        'Calling trigger on a added control changes the map extent ' +
+            '(map extent was "' + oldExtent + '"' + 
+            ' and is now "' + mapsMaxExtent.toString() + '").'
+    );
+    
+    // tear down
+    control.destroy();
+    map.destroy();
+}
+    
+        </script>
+    </head>
+    <body>
+        <div id="map" style="width: 1000px; height: 1000px;"></div>
+    </body>
+</html>

tests/list-tests.html

@@ -46,9 +46,13 @@
     <li>Control/UTFGrid.html</li>
     <li>Control/WMSGetFeatureInfo.html</li>
     <li>Control/WMTSGetFeatureInfo.html</li>
+    <li>Control/Pan.html</li>
     <li>Control/PanPanel.html</li>
     <li>Control/SLDSelect.html</li>
     <li>Control/Zoom.html</li>
+    <li>Control/ZoomIn.html</li>
+    <li>Control/ZoomOut.html</li>
+    <li>Control/ZoomToMaxExtent.html</li>
     <li>Events.html</li>
     <li>Events/buttonclick.html</li>
     <li>Extras.html</li>