Re: [Dynapi-Widgetdev] Events fire all over the place on subclasses

SourceForge Headquarters 1320 Columbia Street Suite 310 San Diego, CA 92101 +1 (858) 422-6466

hi,
I did some research on this, see:
http://www.richardinfo.f2s.com/dynapi/Deli/

To cut a long story short, this problem happens with lists, scrollpanes, and
pushpanel.
The problem with lists is down to a bug in that widget itself, and only
happens when listening for onselect - use onmouseup instead.

The problem with scrollpanes and pushpanel, comes because these are the only
two widgets at the moment NOT prototyped off a DynLayer, but prototyped off
a viewport in this case.
Obviously our inheritance model isn't working as it should .
If you change scrollpane, so it inherits from DynLayer, and add viewport as
a child, it works as it should, regarding eventlisteners.
What changed since version 2, when I suspect this worked normally, has been
the setting of the IDs, I tried a few things here, but couldn't find the
final solution.
Nice but no cigar, as they say.
Maybe someone more at home with DynAPI's inheritance can help out here.

Richard.

----- Original Message -----
From: "A. Joannou" <ari...@nt...>
To: <dyn...@li...>
Sent: 20 May, 2001 22:12
Subject: [Dynapi-Widgetdev] Events fire all over the place on subclasses

> Hi,
> My name is Deli, and I am facing a HUGE problem.
> On objects made from other objects which in turn are made from the
DynLayer
> (e.g. scrollPane),  eventListeners placed on one object, fire on ALL of
them
> as outlined in the following example. Why is this? Is there a solution?
> This problem is apparent on any objects created in the same way (e.g. if I
> create an object 'A' based on DynLayer, and then create an object 'B'
based
> on object 'A', the same problem occurs).
> This makes programming of complex objects IMPOSSIBLE.
>
> Looking forward to your prompt reply.
> Deli.
>
> PS. Below is a simple Scrollpane example (example#1) outlining the
problem.
> Scrollpane#1 and Scrollpane#2 are created, but only Scrollpane#1 is given
an
> eventlistener to listen for the 'create' event.
> The problem is that the event fires ALSO when the Scrollpane#2 is created,
> when REALLY I haven't asked it to.
> This does NOT happen if the example was made with DynLayers (example#2).
>
> example#1
> <html>
> <head>
> <title>CoreLib example</title>
>
> </head>
>
> <script language="Javascript" src="../src/dynapi.js"></script>
> <script language="Javascript">
>
> DynAPI.setLibraryPath('../src/lib/')
> DynAPI.include('dynapi.api.*');
> DynAPI.include('dynapi.event.*')
> DynAPI.include('dynapi.util.thread.js');
> DynAPI.include('dynapi.util.pathanim.js');
> DynAPI.include('dynapi.gui.dynimage.js');
> DynAPI.include('dynapi.gui.button.js');
> DynAPI.include('dynapi.gui.scrollbar.js');
> DynAPI.include('dynapi.gui.viewport.js');
> DynAPI.include('dynapi.gui.scrollpane.js');
> DynAPI.include('dynapi.gui.label.js');
>
>
>
//##########################################################################
> ##################
> DynAPI.onLoad=function() {
> label1 = new Label('<table border=1><tr><td width=160 height=160>label 1
> alk jskj slkj k dkjkj dk skslkdjf lskd f</td></tr></table>')
> label1.setWrap(false)
> label1.setPadding(5)
> label1.setBgColor('cyan')
> label1.setSize(160,160)
>
> label2 = new Label('<table border=1><tr><td width=160 height=160>label 1
> alk jskj slkj k dkjkj dk skslkdjf lskd f</td></tr></table>')
> label2.setWrap(false)
> label2.setPadding(5)
> label2.setBgColor('cyan')
> label2.setSize(160,160)
>
>
>
>
//##########################################################################
> #################//
> //SCROLLPANE#1
>
>
//##########################################################################
> #################//
> var scrollpane1 = new ScrollPane(label1);
> scrollpane1.setSize(150,150)
> scrollpane1.moveTo(250,50)
> scrollpane1.setBgColor('#c0c0c0')
>
>
>
//##########################################################################
> ##
> //EVENT LISTENERS
>
>
//##########################################################################
> ##
> var EListener1 = new EventListener();
>
>
//##########################################################################
> ##
> EListener1.oncreate = function(e) {
> var o=e.getSource();
> alert("from SP1: "+o.id);
> };
> scrollpane1.addEventListener(EListener1);
>
> DynAPI.document.addChild(scrollpane1);
>
>
>
//##########################################################################
> #################//
> //SCROLLPANE#2
>
>
//##########################################################################
> #################//
> var scrollpane2 = new ScrollPane(label2);
> scrollpane2.setSize(150,150)
> scrollpane2.moveTo(250,300)
> scrollpane2.setBgColor('#c0c0c0')
> DynAPI.document.addChild(scrollpane2);
>
>
>
>
> }
>
> </script>
>
>
> <body bgcolor="#ffffff">
> </body>
> </html>
>
>
> Below is the DynLayer example in which THIS effect does NOT happen.
> The code has not been changed apart from the declarations of the objects
>  new ScrollPane(label2) -> new DynLayer() )
>
> example#2
> <html>
> <head>
> <title>CoreLib example</title>
>
> </head>
>
> <script language="Javascript" src="../src/dynapi.js"></script>
> <script language="Javascript">
>
> DynAPI.setLibraryPath('../src/lib/')
> DynAPI.include('dynapi.api.*');
> DynAPI.include('dynapi.event.*')
> DynAPI.include('dynapi.util.thread.js');
> DynAPI.include('dynapi.util.pathanim.js');
> DynAPI.include('dynapi.gui.dynimage.js');
> DynAPI.include('dynapi.gui.button.js');
> DynAPI.include('dynapi.gui.scrollbar.js');
> DynAPI.include('dynapi.gui.viewport.js');
> DynAPI.include('dynapi.gui.scrollpane.js');
> DynAPI.include('dynapi.gui.label.js');
>
>
>
//##########################################################################
> ##################
> DynAPI.onLoad=function() {
> label1 = new Label('<table border=1><tr><td width=160 height=160>label 1
> alk jskj slkj k dkjkj dk skslkdjf lskd f</td></tr></table>')
> label1.setWrap(false)
> label1.setPadding(5)
> label1.setBgColor('cyan')
> label1.setSize(160,160)
>
> label2 = new Label('<table border=1><tr><td width=160 height=160>label 1
> alk jskj slkj k dkjkj dk skslkdjf lskd f</td></tr></table>')
> label2.setWrap(false)
> label2.setPadding(5)
> label2.setBgColor('cyan')
> label2.setSize(160,160)
>
>
>
>
//##########################################################################
> #################//
> //SCROLLPANE#1
>
>
//##########################################################################
> #################//
> var scrollpane1 = new DynLayer();
> scrollpane1.setSize(150,150)
> scrollpane1.moveTo(250,50)
> scrollpane1.setBgColor('#c0c0c0')
>
>
>
//##########################################################################
> ##
> //EVENT LISTENERS
>
>
//##########################################################################
> ##
> var EListener1 = new EventListener();
>
>
//##########################################################################
> ##
> EListener1.oncreate = function(e) {
> var o=e.getSource();
> alert("from SP1: "+o.id);
> };
> scrollpane1.addEventListener(EListener1);
>
> DynAPI.document.addChild(scrollpane1);
>
>
>
//##########################################################################
> #################//
> //SCROLLPANE#2
>
>
//##########################################################################
> #################//
> var scrollpane2 = new DynLayer();
> scrollpane2.setSize(150,150)
> scrollpane2.moveTo(250,300)
> scrollpane2.setBgColor('#c0c0c0')
> DynAPI.document.addChild(scrollpane2);
>
>
>
>
> }
>
> </script>
>
>
> <body bgcolor="#ffffff">
> </body>
> </html>
>
>
> _______________________________________________
> Dynapi-Widgetdev mailing list
> Dyn...@li...
> http://lists.sourceforge.net/lists/listinfo/dynapi-widgetdev
>