var Loading = Class.create({
	initialize: function(element, options) {
		if (options == undefined) options = {};
		this.id        = element.id || "loading";
		this.element   = element;
		this.interval  = options.interval || 200;
		this.animation = options.animation || "loading";
		this.stepX     = options.stepX || 43;
		this.stepY     = options.stepY || 0;
		this.maxStepX  = options.maxStepX || 4;
		this.maxStepY  = options.maxStepY || 0;
		this.text      = options.text || "";
		this.maxIteration = options.maxIteration || (this.stepX+1)*(this.stepY+1)*50;
		this.autostop  = options.autostop || false;
		this.afterFinish = options.afterFinish || null;
		
		this._positionX = 0;
		this._positionY = 0;
		this._iteration = 0;
		this._interval = null;
		
		// Set new id
		if (this.id == "loading") {
			var cpt = 1;
			while (Loading.currents[this.id+cpt]) {cpt++;}
			this.id = this.id+cpt;
		}
		Loading.currents[this.id] = this;
		
		// Start animation
		this._start();
		
		return this;
	}, 
	
	_start: function() {
		this._clean();
		
		var divContainer = document.createElement('div');
		divContainer.setAttribute("id", this.id+"_container");
		divContainer.setAttribute("class", this.animation+"_container");

		var divAnim = document.createElement('div');
		divAnim.setAttribute("id", this.id+"_animation");
		divAnim.setAttribute("class", this.animation+"_animation");
		divContainer.appendChild(divAnim);
		
		if (this.text != "") {
			var divText = document.createElement('div');
			divText.setAttribute("id", this.id+"_text");
			divText.setAttribute("class", this.animation+"_text");
			divText.innerHTML = this.text;
			divContainer.appendChild(divText);
		}
		
	    this.element.appendChild(divContainer);
	    
		Loading._execute_intervale(this);
		if (this.autostop == true) this._autostop();
	},
	
	_stop: function() {
		if (this._interval != null) { window.clearTimeout(this._interval); }
		this._clean();
		delete Loading.currents[this.id];
	},
	_autostop: function() {
		var current = this;
		images = this.element.getElementsByTagName("img");
		if (images.length > 0) {
			for(var i=0, cpt=images.length; i < images.length; i++) {
				var img = new Image();
				img.onload = function() { 
					if (--cpt <= 0) {
						current._stop();
						current.afterFinish();
					}
				};
				img.src = images[i].src;
			}
		} else {
			this._stop();
			this.afterFinish();
		}
	},
	
	_clean: function() {
		// Erase existing elements
		if ($(this.id+'_container')) this.element.removeChild($(this.id+'_container'));
		if ($(this.id+'_animation')) this.element.removeChild($(this.id+'_animation'));
		if ($(this.id+'_text')) this.element.removeChild($(this.id+'_text'));
	}
});

Loading.currents = [];

Loading._execute_intervale = function(l) {
	if(++l._positionX >= l.maxStepX) { l._positionX = 0; l._positionY++; }
	if(l._positionY >= l.maxStepY) l._positionY = 0;
		
	$(l.id+'_animation').style.backgroundPosition = (l._positionX*l.stepX*-1)+'px '+(l._positionY*l.stepY*-1)+'px';
	
	if (++l._iteration < l.maxIteration) {
		l._interval=window.setTimeout("Loading._execute_intervale(Loading.currents['"+l.id+"'])", l.interval);
	} else {
		l._stop();
	}
};