Creating Custom Events with Seth
Posted by Daniel Tue, 27 Feb 2007 19:15:00 GMT
For now, if you haven’t already, read this. Seth, I found a documentation bug (I think). I’ll post the full story later today… for now it’s back to work.
OK. I’m back. Did you read the article? That’s OK. I’ll wait…
So I’m working on a website and the design has iterated. It started out with… er, um, a page that displays a list of things that are “on” and a list that is “off”… both displayed on the same page. Time goes on and navigation is added and other widgets as well. It’s wired up with Javascript etc. It’s fairly clean, but basic, since we knew a revision was in the works.
The revision shows up, and we have to get the new design working but it’s radically different. Now the on and off lists are toggled—only one list showing at a time, and the navigation changes depending on which one is showing. Some new code is added (almost always a bad sign) to get things wired up and we resign ourselves to cleaning it up in steps as we go. We feel this is best because we don’t know that more changes aren’t coming, we have other higher priority tasks to spend time on, and since the changes weren’t hard, we have little reason to clean everything up now.
Time goes on and we continue to refactor every time we have to touch something. A little bit here, a bit there, and soon the code has far more distinct responsibilities and encapsulation. Our understanding of the app is better as time goes on, and the code reflects this. But we haven’t touched the toggling yet…
So toggling is screaming to be refactored since the wiring is painful to behold. It’s far too interwingled with the other stuff on the page and we know it. I had looked at Seth’s work a while back, and shoved it into my back pocket… and today it worked out perfectly. We did a little spike, got the basic code working, and then applied our new found knowledge to the problem. Now we have excellent separation of concerns. The toggle dispatches a custom event, and various things listen for it via a broker. Nice. Any other widgets or tools can tie in just as easily. Since we were already using Prototype.js and our own classes, it took only about 15 minutes to mixin the Event classes and set up a broker. Most excellent Seth!
I have a “Busy Developers Guide” one page sample of one publish class, one listener class, and one broker. It’s an extremely simple example, but it is all you’ll need to get started using Seth’s stuff and should help answer the basic question “How do I use this?” from a code perspective. I left it at work so I’ll post it tomorrow, and point out what appears to be a documentation bug (or some misunderstanding on my part).
