var Rollover = Class.create({
		initialize: function(id, options) {
			this.id = id;
			this.origsource = $(this.id).src;
			this.setOptions(options);
			this.preloadRollover();
			this.rollbackImage();
			this.observeMouse();
		},

		setOptions: function(options) {
			this.options = {
				prefix: 'grey-'
			};
			Object.extend(this.options, options || {});
		},

		observeMouse: function() {
			$(this.id).observe('mouseover', this.rolloverImage.bindAsEventListener(this));
			$(this.id).observe('mouseout', this.rollbackImage.bindAsEventListener(this));
		},

		preloadRollover: function() {
			this.preload = new Image();
			this.preload.setAttribute('src',this.parseRollbackSource());
			this.preload_orig = new Image();
			this.preload_orig.setAttribute('src',this.origsource);
		},

		parseRollbackSource: function()
		{
			path = this.origsource.match(/(.*)\/(.*\.(png|gif|jpg))/)[1];
			filename = this.origsource.gsub(path, '').substr(1);
			return path + '/' + this.options.prefix + filename;
		},

		rolloverImage: function(e) {
			$(this.id).setAttribute('src',this.origsource);
		},

		rollbackImage: function(e) {
			$(this.id).setAttribute('src',this.parseRollbackSource());
		}
	});