var ImgLoader = new Class({

	initialize: function() {
		this.queue = [];
	},
	
	load: function(cont, url) {
		var cont = $(cont);
		cont.getElement('div').setStyle('opacity', 0.5);
		cont.getElement('.loading').setStyle('display', 'block');
		
		cont.img = new Element('img', { src: url }).setStyle('display', 'none');
		
		if (!this.queue.contains(cont))
			this.queue.push(cont);
		
		if (this.int) $clear(this.int);
		this.int = this.update.periodical(50, this);
	},
	
	update: function() {
		this.queue.each(function(cont) {
			if (cont.img.complete) {
				cont.getElement('.loading').setStyle('display', 'none');
				
				cont.getElement('div')
					.adopt(
						new Element('img', { 'src': cont.getElement('div').getStyle('background-image').replace(/^url\("?|"?\)$/g, '') })
							.setStyle('opacity', 0.5)
							.set('tween', { onComplete: function(elem) { elem.dispose() } })
							.tween('opacity', 0)
					)
					.setStyles({ 'background-image': 'url(' + cont.img.src + ')', 'opacity': 1, 'background-position': Browser.Engine.trident ? 'top left' : 'center' })
					.morph({ 'width': cont.img.width, 'height': cont.img.height });
				
				this.queue.erase(cont);
			}
		}, this);
		
		if (!this.queue.length)
			$clear(this.int);
	}
	
});
var imgLoader = new ImgLoader();