[OpenLayers-Users] how to extend/inherit class

[Duarte Carreira]

We are trying to extend a control, mimicking the ZoomPan control. We
extend the Control class, and modify slightly the original code from
ZoomPan.
 
Then when we modify the buttonDown method, we get errors using new
properties or methods that are not in the original PanZoom class.
For instance, if we create a new property like 'var pTest: 1' and try to
use it inside buttonDown, this property is allways 'undefined'.
 
For example, create a copy of PanZoom.js and rename it to PanZoom2.js,
then alter it like this:
 
OpenLayers.Control.PanZoom2 = OpenLayers.Class.create();
OpenLayers.Control.PanZoom2.X = 4;
OpenLayers.Control.PanZoom2.Y = 4;
OpenLayers.Control.PanZoom2.prototype =
  OpenLayers.Class.inherit( OpenLayers.Control, {
 
    /** @type int */
    slideFactor: 50,
    pTest: 1,
 
    /** @type Array of Button Divs */
    buttons: null,
 
    /** @type OpenLayers.Pixel */
    position: null,
 
    /**
     * @constructor
     */
    initialize: function() {
        OpenLayers.Control.prototype.initialize.apply(this, arguments);
        this.position = new
OpenLayers.Pixel(OpenLayers.Control.PanZoom2.X,
 
OpenLayers.Control.PanZoom2.Y);
    },
/*... same code as in ZoomPan is included here except for the slightly
different buttonDown method ...*/
    buttonDown: function (evt) {
        if (!OpenLayers.Event.isLeftClick(evt)) return;

        switch (this.action) {
            case "panup":
                this.map.pan(0, -50);
                break;
            case "pandown":
                this.map.pan(0, 50);
                break;
            case "panleft":
                alert('New property:' + this.pTest);
                break;
            case "panright":
                this.map.pan(50, 0);
                break;
            case "zoomin":
                this.map.zoomIn();
                break;
            case "zoomout":
                this.map.zoomOut();
                break;
            case "zoomworld":
                this.map.zoomToMaxExtent();
                break;
        }
If you then create a PanZoom2 control in your map and try to pan left
you'll see that this.pTest is undefined.
If you try to use a new method you get an error "this.method is not a
function".
Is there a correct way to solve this? 
 
It's curious that it works inside the constructor. It seems there is
something I'm not aware of in the subclassing mechanism...
 
Thank you.
Duarte Carreira

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.osgeo.org/pipermail/openlayers-users/attachments/20061128/8e67a664/attachment.html