Adam recently tried to claim a rebate for a purchase. Rebate websites, of course, are awful. The vendor doesn’t really want you to claim the rebate, after all, so even if they don’t actively try and make it user hostile, they’re also not going to go out of their way to make the experience pleasant.

In Adam’s case, it just didn’t work. It attempted to use a custom-built auto-complete textbox, which errored out and in some cases popped up an alert which read: [object Object]. Determined to get his $9.99 rebate, Adam did what any of us would do: he started trying to debug the page.

The HTML, of course, was a layout built from nested tables, complete with 1px transparent GIFs for spacing. But there were a few bits of JavaScript code which caught Adam’s eye.

function doTheme(myclass) {
         if ( document.getElementById ) {
                if(document.getElementById("divLog").className=="princess") {
                        document.getElementById("divLog").className="death"
                } else {
                        if(document.getElementById("divLog").className=="death") {
                                document.getElementById("divLog").className="clowns"
                        } else {
                                if(document.getElementById("divLog").className=="clowns") {
                                        document.getElementById("divLog").className="princess"
                                }
                        }
                }
                document.frmLog.myClass.value=document.getElementById("divLog").className;
        } else if ( document.all ) {
                if(document.all["divLog"].className=="princess") {
                        document.all["divLog"].className="death"
                } else {
                        if(document.all["divLog"].className=="death") {
                                document.all["divLog"].className="clowns"
                        } else {
                                if(document.all["divLog"].className=="clowns") {
                                        document.all["divLog"].className="princess"
                                }
                        }
                }
                document.frmLog.myClass.value=document.all["divLog"].className;
        }
}

This implements some sort of state machine. If the state is “princess”, become “death”. If the state is “death”, become “clowns”. If the state is “clowns”, go back to being a “princess”. Death before clowns is a pretty safe rule.

This code also will work gracefully if document.getElementById is unavailable, meaning it works all the way back to IE4. That’s backwards compatibility. Since it doesn't work in Adam's browser, it missed out on the forward compatibility, but it's got backwards compatibility.

To round out the meal, Adam also provides a little bit of dessert for this entry of awful code.

//DEBRA, THIS DOES THE IMAGE MOUSEOVER THING.  
//ALL YOU HAVE TO DO IS TELL IT WHICH OBJECT YOU ARE REFERRING TO, AND WHAT YOU WANT TO  
//CHANGE THE IMAGE SOURCE TO.

function over(myimage,str) {  
        document[myimage].src=eval(str).src  
}

DEBRA I HOPE YOU GOT A JOB WHERE YOU DON’T HAVE TO WORK WITH THIS AWFUL WEBSITE ANYMORE.

Adam used some google-fu and found an alternate site that allowed him to redeem his rebate.

[Advertisement] BuildMaster allows you to create a self-service release management platform that allows different teams to manage their applications. Explore how!