Re: [Dynapi-Help] Widget triggers event in another widget

Fri, 27 Apr 2001 07:03:53 -0700

Thanks Richard. Feel free to add it to your site (which is a great resource - thanks a lot for the effort you put in). There's still more I want to do to it, and I've been working on a 'heavyweight' version which includes scrollbar support for long lists.
 
But, I think you might be right in terms of re-writing the list.js code. I'll look into it!
 
Cheers, Ben
----- Original Message -----
Sent: Thursday, April 26, 2001 12:58 PM
Subject: Re: [Dynapi-Help] Widget tirggers event in another widget

Hi,
It seems to be an error in the onselect event of the list widget.
If you change this line:
    o.list.events.onselect=function(e){
To this:
    o.list.events.>
It works as it should.
Of course the real solution would be to debug the list widget, but I think you'll be better of writing your own slimmer version anyway.
 
Also, this line:
    this.id="selectList"+(selectList.Count++)
Should be deleted, as it can cause problems in the new API.
 
There were a few minor typo's in the code to , probably from pasting it, line 54 (o..addChild) and 90 (o..events).
Can I add the widget to my page?
 
Cheers,
Richard Bennett
 
[EMAIL PROTECTED]
www.richardinfo.com
(Everything running on, and ported to DynAPI2.51)
visit the DynAPI homepage (and FAQ) ::
http://dynapi.sourceforge.net/dynapi/index.php?menu=1
Browse (and search) the mailinglist here:
http://www.mail-archive.com/index.php3?hunt=dynapi
 
----- Original Message -----
From: Ben Empson
Sent: Thursday, April 26, 2001 1:05 PM
Subject: [Dynapi-Help] Widget tirggers event in another widget

I have built a select list widget, which when used once on a page works fine. However, when you add another (same) widget to the page, they each trigger the others onselect event. This I do not understand!
 
You can see what I mean here...
 
 
The alert that comes up when you select something is triggered in the onselect event for the selectList, and is the reference to the label which is the always visible part of the selectlist.
 
Thw widget code is below (selectlist2.js). Any help would be greatly appreciated.
 
Ben
 
----------------code start------------------
//define a function to set the list padding (not included in list.js)
List.prototype.setPadding = function(b){
 this.listStyle.padding = b;
 if (this.created) this.arrangeItems();
};
 
//imgW is the width of the arrow image to control the drop-down
//numItems is the number of items which will be added to the list
function selectList(x,y,w,h,imgW,numItems,maxDisplayItems,borderThickness,zIndex){
 this.superClass=DynLayer
 this.superClass()
 this.id="selectList"+(selectList.Count++)
 
 this.moveTo(x || 100, y || 100)
 this.setSize(w+(borderThickness*2)+100,h+(borderThickness*2))
 this.setZIndex(zIndex)
 
 var l=new EventListener(this)
 l.oncreate=function(e) {
  var o=e.getTarget()
  
  //o.label is the label which displays the selected item
  o.label = new Label('')
  o.label.moveTo(borderThickness,borderThickness)
  o.label.setBgColor('#eeeeee')
  o.label.setWidth(w-imgW)
  o.label.setHeight(h)
  
  //o.list is the drop-down list which presents the available options
  o.list = new List()
  o.list.moveTo(0,0-(numItems*h)) //move the list up so that it is hidden behind the label until the button is clicked
  o.list.setWidth(w+(borderThickness*2))
  o.list.setBgColor('#000000')
  o.list.boldOnSelect(true)
  o.list.setPadding(1)
  
  //o.button is the clickable button to activate the drop-down
  o.button = new DynLayer(null,(w-imgW)+borderThickness,0,imgW,h+borderThickness)
  o.button.imgUp = new Image()
  o.button.imgUp.src = " 'dynapi2_52/dynapi/src/lib/dynapi/images/scrollpane/arrowdn0.gif'  o.button.imgDn = new Image()
  o.button.imgDn.src = " 'dynapi2_52/dynapi/src/lib/dynapi/images/scrollpane/arrowdn1.gif'  o.button.setBgImage(o.button.imgUp.src)
  
  //set the borders of the whole widget
  o.topBorder = new DynLayer(null,0,0,w+(borderThickness*2),borderThickness,'black')
  o.bottomBorder = new DynLayer(null,0,h+borderThickness,w+(borderThickness*2),borderThickness,'black')
  o.leftBorder = new DynLayer(null,0,0,borderThickness,h+(borderThickness*2),'black')
  o.rightBorder = new DynLayer(null,w+borderThickness,0,borderThickness,h+(borderThickness*2),'black')
  
  //just insert o.?Border.setBgImage to create a styled border
  
  o.addChild(o.list)
  o..addChild(o.label)
  o.addChild(o.button)
  o.addChild(o.topBorder)
  o.addChild(o.bottomBorder)
  o.addChild(o.leftBorder)
  o.addChild(o.rightBorder)
  
  o.button.events = new EventListener(o.button)
   o.button.events.>    o.button.setBgImage(o.button.imgDn.src)
   }
 
   o.button.events.>    if (!o.open) {
     o.setSize(w+(borderThickness*2),(numItems*h)+h+(borderThickness*2))
     o.list.slideTo(0,h+(borderThickness*2),20,5)
     o.open=true
    } else {
     o.setSize(w+(borderThickness*2),h+(borderThickness*2))
     o.list.slideTo(0,0-((maxDisplayItems*h)-h),20,5)
     o.open=false
    }
    o.button.setBgImage(o.button.imgUp.src)
   }
  o.button.addEventListener(o.button.events)
  
  o.list.events = new EventListener(o.list)
   o.list.events.onselect=function(e){
    o.label.setHTML(o.list.getSelectedItem().getHTML())
    alert(o.label)
    o.open=false
    o.list.slideTo(0,0-((maxDisplayItems*h)-h),20,5)
    o.setSize(w+(borderThickness*2),h+(borderThickness*2))
   }
  o.list.addEventListener(o.list.events)
  
  o..events = new EventListener(o)
   o.events.>    if (o.open) {
     o.open=false
     o.list.slideTo(0,0-(numItems*h),20,5)
     o.setSize(w+(borderThickness*2),h+(borderThickness*2))
    }
   }
  o.addEventListener(o.events)
 }
 this.addEventListener(l)
 
 return this
}
selectList.Count=0
selectList.prototype=new DynLayer()
selectList.prototype.getSubClass=function() { return selectList }
-----------------code end----------------------

Reply via email to