YUI lovin

I’m working on some redesign work for one of my under maintained sites at the moment, with something of a redesign in the works. It seemed a good opportunity to play more with YUI, the Yahoo User Interface Library, which I’d had a peak at before and heard nice things about (sorry, I like the long namespaces).

I’ve nothing finished yet past a proof of concept, but I thought a couple of lines of javascript wouldn’t go a miss. Nothing fancy mind, just some nice bits I like so far.

The case in point was wanting to add event handlers to an unknown number of links within an unordered list.

First off a quick, clever, one liner. onAvailable checks for the availability of the object (if you remove the quotes) or an object with a specified id in this case. It executes the callback function, init in this case, when the condition is true.

YAHOO.util.Event.onAvailable("iList", init);

Moments later we have events added to all the links.

function init() { var links = document.getElementById("iList").getElementsByTagName("A"); YAHOO.util.Event.addListener(links, "click", clickCallback); }

Again you just throw in whatever you happen to be working with (in this case an array returned by getElementsByTagName) and everything just gets dealt with. I originally had a for loop, iterating over the links and adding events, then I worked out YUI just did it all for me if I let it. I like that. I could have done it myself. YUI would have let me and not complained. But if I want to delve a bit I can find cool, quick, clean ways of doing the same thing. I refactored my code, with the help of YUI in ten minutes. I like that, but I think I said that.