/* Made by Furu systems - furusystems.com */
ImageLoader = new Class({
	options: {
		hidden: 'hidden', 
		className: 'imageloader',
		html: '',
		preloader: '',
		delay: 500,
		width: 200,
		height: 200,
		force: false
	},
	
	initialize: function(element, options){
		if($(new Image()) == null){ return; }; // sf2 or non supportive browsers.
		this.setOptions(options);
		// set ref to element
		this.element = $(element);
		this.element.addClass(this.options.hidden); // better to use css than diplay:none/block;
		
		//* create imageloader div
		this.imageloader = new Element('div', {
			'styles': {
				'width': this.options.width,
				'height': this.options.height
			},
			'class': this.options.className
		});
		this.imageloader.injectBefore(this.element);
		if(this.options.preloader.length > 0){ 		// preload a preloader image.
			preloader = $(new Image());
			preloader.addEvent('load', this.load.bind(this));
			preloader.setProperty('src', this.options.preloader);
		} else { this.load(); }
	},
	
	load: function(){
		// create image preloader and bind onload event.
		image = $(new Image());
		image.addEvent('load', this.onload.bind(this));
		image.setProperty('src',  this.element.getProperty('src') + (this.options.force ? (/\?/.test(this.element.getProperty('src')) ? '&' : '?') + "time=" + (new Date().getTime()) : ''));
	},
	
	onload: function(){
		(function(){
			this.imageloader.remove();
			this.element.removeClass(this.options.hidden);
		}.bind(this)).delay(this.options.delay);
	}
});
ImageLoader.implement(new Events, new Options);