Dark Light

One of the things about the DHTML -> DOM Scripting Revolution (which will, obviously, be bloggerized) is moving window.onload events (and, further back, the stuff you used to put into the body onLoad tag. You don’t still do that do you?) and turning them into addEvent()s. Except that because the various addEvent implimentations are subtly different from platform to platform, there is a move afoot to create a pattern that works. However, while I will be using that in new code, I still have to work on existing code that I don’t have licence to completely rewrite today.

For example, adding new functionality that uses an onLoad event to a page that already has an onLoad event defined, whilst not mucking around with the code of both.

One of the central problems with window.onload is that there can only be one of it (No Highlander references, please), so if you want two things to happen when the page loads, you’re somewhat SOL on the second one. The first one is defined something like this:

window.onload = function (e) {
      alert("Fool.");
}

(This is, obviously, not real code. I write software that a couple of banks are using internally, insulting them just for going to the wrong page is somewhat likely to be a career limiting move.)

Later on, we need to do something else too. So the new code does this:

window.onload = function (e) {
      alert("Barl.");
}

(Which is obviously a complex technical term for something banking related. It stands for ‘Banking Annotation Reflex Link’).

But wait! Now when the page loads it spews a box saying “Barl.”! We can’t let the user get away with not being insulted, it breaks the spec. And yet if I include them both together in one sourcefile:

window.onload = function (e) {
      alert("Fool.");
      alert("Barl.");
}

Then the functionality will be split! disaster! Someone’s crossing the beams!

So we do this:


oldOnLoad = window.onload

window.onload = function (e) {
      oldOnLoad();
      alert("Barl.");
}

Basically, we save the old onload event as a new function (oldOnLoad) and then execute it as part of the new one, So it executes the stuff that is already defined, then the stuff that we want to happen next, and we can keep adding stuff like this until it reaches critical mass, and I give in and spend an afternoon refactoring the whole thing to be more sane. But for now, it works, and clients can be happy.

Related Posts