Webmaster Forum / HTML, CSS, Scripts / JavaScript / December 2007

Hey guys!

I'm writing a widget wherein I want the pages using it to be able to
subscribe to events on it. I did my own research, not asking anyone to
write it for me, just want to make sure I'm on the right track here.

Basically, I'm creating a private collection of listeners, then
providing a mechanism for adding functions to that event.

A dispatch function loops through the listeners, finds the right one,
and calls the observer.

// Constructor
function mySampleWidget () {
 // Collection of listeners (private)
 var listeners = [];

 // Function for adding listeners
 this.addEventListener =
  function (evName, observer, stopHere) {
   listeners.push(
    {
      "event":evName,
      "observer":observer,
      "stop":stopHere} );
   };
           
 // the dispatch function.
 this.dispatch =
  function (calEvent) {
   for (var i = 0; i < listeners.length; ++i) {
    var listener = listeners[i];
    if (listener.event == "on" + calEvent) {
     listener.observer();
     if (listener.stop) {
    break;               
     }
    }
   }
 }         

mySampleWidget.prototype.show =
  function() {
    this.dispatch("beforeshow");
    // code to display widget
    this.dispatch("aftershow");
  }

I'm a little worried about the dispatch method, right now it has
pseudo-protected access, which means someone could call it from outside
on a whim. I would like to make it private, but I was unable to wrap my
head all the way around Crockford's article on public/private/protected
pseudo access sufficiently.

The code works in my tests so far (unless I pass in some nulls, it
breaks real easy because I'm not type checking and making sure
everything is right before I assign.

The usage would be:

var w = new myWidget();
w.addEventListener(
  "onbeforeshow",
  function() {alert("Before Show");},
  false};
w.show();

At this point, the application does display the proper message/call the
proper function, and does so for several different listeners, unless and
until one has a stop property that evaluates to true, and it will not
process listeners after that.

A few questions:
1. Is this a good path to be on? Is there something in there I'm doing
that's ingorant of the possible repercussions beyond the type and value
checking I've not yet implemented?

2. Can you provide any insight into how I can effectively hide the
dispatch method while still giving the other prototyped functions access
to him?

3. What other issues/caveats have you run into with this kind of thing
that I should be thinking about?

4. OT for this post, but IE7 seems not to like the
"application/javascript" type attribute. Just more of the same?

Thanks a million guys, you are appreciated.

~A!