var $dom = YAHOO.util.Dom;
var $ = $dom.get;
var $class = $dom.getElementsByClassName;

var mouseovers_auto = {
    init: function() {
	    this.mouseovers = [];                                                                                                                                     
	    var mouseover_images = $class('mouseover', 'img');
	    for(var i=0, item; item=mouseover_images[i]; i++) {
	        this.mouseovers[i] = new Mouseover(item);
	    }
	    var mouseover_inputs = $class('mouseover', 'input');
	    for(var i=0, item; item=mouseover_inputs[i]; i++) {
            this.mouseovers[i] = new Mouseover(item);
	    }
    }
};

Mouseover = function(mouseover_image) {
    if (mouseover_image) {
        this.init(mouseover_image); 
    }
};

Mouseover.prototype = {  
    init: function(mouseover_image) {
        this.mouseover_image = mouseover_image;
        this.off_src = this.mouseover_image.src;
        this.hover_src = '';
        if (this.off_src.indexOf(".gif") > 0) {
            this.hover_src = this.off_src.replace(".gif", "_ov.gif");
        } else if (this.off_src.indexOf(".jpg") > 0) {
            this.hover_src = this.off_src.replace(".jpg", "_ov.jpg");
        } else if (this.off_src.indexOf(".png") > 0) {
            this.hover_src = this.off_src.replace(".png", "_ov.png");
        }
        var obj = this;
        YAHOO.util.Event.addListener(this.mouseover_image, 'mouseover', this.hover, obj); 
        YAHOO.util.Event.addListener(this.mouseover_image, 'mouseout', this.mouseout, obj);
        
        this.preloaded_image = new Image();
        this.preloaded_image.src = this.hover_src;
    },

    hover: function(e, obj) {
        obj.mouseover_image.src = obj.hover_src;
    },
  
    mouseout: function(e, obj) {
        obj.mouseover_image.src = obj.off_src;
    }
};

//Un comment the below line or add it to your own html/javascript files to start the slideshow
YAHOO.util.Event.addListener(window, 'load', mouseovers_auto.init);