<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=us-ascii">
<META content="MSHTML 6.00.2900.2963" name=GENERATOR></HEAD>
<BODY>
<DIV><SPAN class=080571412-28112006><FONT face=Arial size=2>We are trying to
extend a control, mimicking the ZoomPan control. We extend the Control class,
and modify slightly the original code from ZoomPan.</FONT></SPAN></DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial
size=2></FONT></SPAN> </DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial size=2>Then when
we modify the buttonDown method, we get errors using new properties or
methods that are not in the original PanZoom class.</FONT></SPAN></DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial size=2>For instance, if we
create a new property like 'var pTest: 1' and try to use it inside
buttonDown, this property is allways 'undefined'.</FONT></SPAN></DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial
size=2></FONT></SPAN> </DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial size=2>For example, create
a copy of PanZoom.js and rename it to PanZoom2.js, then alter it like
this:</FONT></SPAN></DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial
size=2></FONT></SPAN> </DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial
size=2>OpenLayers.Control.PanZoom2 =
OpenLayers.Class.create();<BR>OpenLayers.Control.PanZoom2.X =
4;<BR>OpenLayers.Control.PanZoom2.Y =
4;<BR>OpenLayers.Control.PanZoom2.prototype =<BR>
OpenLayers.Class.inherit( OpenLayers.Control, {</FONT></SPAN></DIV>
<DIV><FONT face=Arial size=2></FONT> </DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial size=2>
/** @type int */<BR> slideFactor: 50,<BR>
pTest: 1,</FONT></SPAN></DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial
size=2> </DIV></FONT></SPAN>
<DIV><SPAN class=080571412-28112006><FONT face=Arial size=2>
/** @type Array of Button Divs */<BR> buttons:
null,</FONT></SPAN></DIV>
<DIV><FONT face=Arial size=2></FONT> </DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial size=2>
/** @type OpenLayers.Pixel */<BR> position:
null,</FONT></SPAN></DIV>
<DIV><FONT face=Arial size=2></FONT> </DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial size=2>
/**<BR> * @constructor<BR>
*/<BR> initialize: function()
{<BR>
OpenLayers.Control.prototype.initialize.apply(this,
arguments);<BR> this.position = new
OpenLayers.Pixel(OpenLayers.Control.PanZoom2.X,<BR>
OpenLayers.Control.PanZoom2.Y);<BR> },<BR></FONT></SPAN><SPAN
class=080571412-28112006><FONT face=Arial size=2>/*... same code as in ZoomPan
is included here except for the slightly different buttonDown method
...*/</FONT></SPAN></DIV>
<DIV><SPAN class=080571412-28112006><FONT face=Arial><PRE style="COLOR: black; FONT-FAMILY: Consolas,Bitstream Vera Sans Mono,Lucida Console,Courier New; BACKGROUND-COLOR: white"><FONT size=2> buttonDown<FONT color=darkblue>:</FONT> <FONT color=blue>function</FONT> <FONT color=darkblue>(</FONT>evt<FONT color=darkblue>)</FONT> {
<FONT color=blue>if</FONT> <FONT color=darkblue>(</FONT><FONT color=darkblue>!</FONT>OpenLayers<FONT color=darkblue>.</FONT>Event<FONT color=darkblue>.</FONT>isLeftClick<FONT color=darkblue>(</FONT>evt<FONT color=darkblue>)</FONT><FONT color=darkblue>)</FONT> <FONT color=blue>return</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>switch</FONT> <FONT color=darkblue>(</FONT><FONT color=blue>this</FONT><FONT color=darkblue>.</FONT>action<FONT color=darkblue>)</FONT> {
<FONT color=blue>case</FONT> <FONT color=maroon>"panup"</FONT><FONT color=darkblue>:</FONT>
<FONT color=blue>this</FONT><FONT color=darkblue>.</FONT>map<FONT color=darkblue>.</FONT>pan<FONT color=darkblue>(</FONT><FONT color=red>0</FONT><FONT color=darkblue>,</FONT> <FONT color=darkblue>-</FONT><FONT color=red>50</FONT><FONT color=darkblue>)</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>break</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>case</FONT> <FONT color=maroon>"pandown"</FONT><FONT color=darkblue>:</FONT>
<FONT color=blue>this</FONT><FONT color=darkblue>.</FONT>map<FONT color=darkblue>.</FONT>pan<FONT color=darkblue>(</FONT><FONT color=red>0</FONT><FONT color=darkblue>,</FONT> <FONT color=red>50</FONT><FONT color=darkblue>)</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>break</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>case</FONT> <FONT color=maroon>"panleft"</FONT><FONT color=darkblue>:</FONT>
alert(<FONT color=#0000ff>'New property:' + this.pTest</FONT><FONT color=darkblue>)</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>break</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>case</FONT> <FONT color=maroon>"panright"</FONT><FONT color=darkblue>:</FONT>
<FONT color=blue>this</FONT><FONT color=darkblue>.</FONT>map<FONT color=darkblue>.</FONT>pan<FONT color=darkblue>(</FONT><FONT color=red>50</FONT><FONT color=darkblue>,</FONT> <FONT color=red>0</FONT><FONT color=darkblue>)</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>break</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>case</FONT> <FONT color=maroon>"zoomin"</FONT><FONT color=darkblue>:</FONT>
<FONT color=blue>this</FONT><FONT color=darkblue>.</FONT>map<FONT color=darkblue>.</FONT>zoomIn<FONT color=darkblue>(</FONT><FONT color=darkblue>)</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>break</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>case</FONT> <FONT color=maroon>"zoomout"</FONT><FONT color=darkblue>:</FONT>
<FONT color=blue>this</FONT><FONT color=darkblue>.</FONT>map<FONT color=darkblue>.</FONT>zoomOut<FONT color=darkblue>(</FONT><FONT color=darkblue>)</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>break</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>case</FONT> <FONT color=maroon>"zoomworld"</FONT><FONT color=darkblue>:</FONT>
<FONT color=blue>this</FONT><FONT color=darkblue>.</FONT>map<FONT color=darkblue>.</FONT>zoomToMaxExtent<FONT color=darkblue>(</FONT><FONT color=darkblue>)</FONT><FONT color=darkblue>;</FONT>
<FONT color=blue>break</FONT><FONT color=darkblue>;</FONT>
}</FONT></PRE></DIV>
<DIV><SPAN class=080571412-28112006></SPAN><FONT size=2>I<SPAN
class=080571412-28112006>f you then create a PanZoom2 control in your
map and try to pan left you'll see that this.pTest is
undefined.</SPAN></FONT></DIV>
<DIV><FONT size=2><SPAN class=080571412-28112006>If you try to use a new method
you get an error "this.method is not a function".</SPAN></FONT></DIV>
<DIV><SPAN class=080571412-28112006></SPAN><FONT size=2>I<SPAN
class=080571412-28112006>s there a correct way to solve this?
</SPAN></FONT></DIV>
<DIV><FONT size=2><SPAN class=080571412-28112006></SPAN></FONT> </DIV>
<DIV><FONT size=2><SPAN class=080571412-28112006>It's curious that it works
inside the constructor. It seems there is something I'm not aware of in the
subclassing mechanism...</SPAN></FONT></DIV>
<DIV><FONT size=2><SPAN class=080571412-28112006></SPAN></FONT> </DIV>
<DIV><FONT size=2><SPAN class=080571412-28112006></SPAN></FONT><FONT
size=2><SPAN class=080571412-28112006>Thank you.</SPAN></FONT></DIV>
<DIV><FONT size=2><SPAN class=080571412-28112006>Duarte Carreira</SPAN></DIV>
<DIV><BR></DIV></FONT></FONT></SPAN></BODY></HTML>