var overs;

function Overs()
{
	this.preloaded = [];
	
	this.classNameSuffix = "_over";
	
	var buttons = $$('div[rel="over"]');
	
	var i;
	
	for(i = 0; i < buttons.length; ++i)
	{
		//preload
		var dummy = document.createElement('div');
		$(dummy).setStyle({display:'none'});

		buttons[i].appendChild(dummy);
		
		$(dummy).addClassName(buttons[i].className + this.classNameSuffix);
		
		this.preload($(dummy).getStyle('background-image'));
		
		buttons[i].oldClassName = buttons[i].className;
		buttons[i].setStyle({cursor: 'pointer'});	
		
		buttons[i].observe('mouseover', function(event)
		{
				var element = Event.element(event);
				overs.hover(element);
		});
		
		buttons[i].observe('mouseout', function(event)
		{
				var element = Event.element(event);
				overs.leave(element);
		});
	}
}

Overs.prototype.preload = function(img)
{
	var url = /url\((.*)\)|(\1)/;
	var match = img.match(url);
	
	if(match)
	{
		var image = new Image();
		image.src = match[1];
		this.preloaded.push(image);
		
	}
};

Overs.prototype.hover = function(element)
{
	$(element).className = $(element).className + this.classNameSuffix;
};

Overs.prototype.leave = function(element)
{
	$(element).className = $(element).oldClassName;
};

document.observe('dom:loaded', function()
{
	overs = new Overs();	
});