var dt_rollover = new Class({
  options: {
    on_text: '_h'
  },

	initialize: function(element, options){
		this.setOptions(options);
		
		if( ($type(element) == 'element') &&
        (element.getTag() == 'img') )
		{		  
      this.image = element;
      this.image.addEvent('mouseenter',this.show.bind(this));
      this.image.addEvent('mouseleave',this.hide.bind(this));

      this.off_image = element.getProperty('src');
      
      var file = this.off_image.split('.');
      this.on_image = file[0] + this.options.on_text + '.' + file[1];

      this.load(this.off_image);
      this.load(this.on_image);
    }
	},

  load: function( file )  
  {
    if( $type(this.loaded) == false )
      this.loaded = new Hash();
      
    this.loaded.set(file,false);
    var me = this;
    
    new Asset.image(file,{
     onload: function()
     {
       me.loaded.set(file,true);
     }
   });
  },
  
	show: function(){
	 if( this.loaded.get(this.on_image) )
	   this.image.setProperty('src',this.on_image); 
	},

	hide: function(){
	 if( this.loaded.get(this.off_image) )
	   this.image.setProperty('src',this.off_image); 
	}
});

dt_rollover.implement(new Events, new Options);

window.addEvent('domready',function(){
  $$('img.rollover').each(function(el){
    new dt_rollover(el);
  });
});

