/* This js sets up hover states for the images and input's with class="button" when the page loads */
var buttonHover = {
    init: function() {
        var inputsAndImages = getElementsByClass('button');
        for(i=0; i<inputsAndImages.length; i++) {
            button = inputsAndImages[i];
            if (button.nodeName == 'INPUT' || button.nodeName == 'IMG') {
                // input or image -> good to go
                PUaddEvent(button, 'mouseover', buttonHover.overFn);
                PUaddEvent(button, 'mouseout', buttonHover.outFn);
            }
        }
    },
    // Add '_over' to filename xxxxxx_over.xxx
    overFn: function() {
        this.src = this.src.replace('.gif', '_over.gif');
    },
    // Remove '_over' from filename xxxxxx.xxx
    outFn: function() {
        this.src = this.src.replace('_over.gif', '.gif');
    }
};

PUaddEvent(window, 'load', buttonHover.init);

// Returns array of elements with class
function getElementsByClass(theClass) {
    var elementArray = (document.all) ? document.all : document.getElementsByTagName("*");
    var matchedArray = [];
    var pattern = new RegExp("(^| )" + theClass + "( |$)");
    for (var i = 0; i < elementArray.length; i++) {
        if (pattern.test(elementArray[i].className)) {
            matchedArray[matchedArray.length] = elementArray[i];
        }
    }
    return matchedArray;
}

// Cross-browser event listeners
function PUaddEvent( obj, type, fn ) {
    if ( obj.attachEvent ) {
        obj['e'+type+fn] = fn;
        obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
        obj.attachEvent( 'on'+type, obj[type+fn] );
    }
    else {
        obj.addEventListener( type, fn, false );
    }
}