/* protoload 0.1 beta by Andreas Kalsch
 * last change: 09.07.2007
 *
 * This simple piece of code automates the creating of Ajax loading symbols.
 * The loading symbol covers an HTML element with correct position and size - example:
 * $('myElement').startWaiting() and $('myElement').stopWaiting()
 */
 
Protoload = {
	// the script to wait this amount of msecs until it shows the loading element
	timeUntilShow: 0,
	
	// opacity of loading element
	opacity: 0.8,

	// Start waiting status - show loading element
	startWaiting: function(element , className, innerText1, innerText2, innerText3, innerText4, timeUntilShow) {
		if (typeof element == 'string')
			element = document.getElementById(element);
		if (className == undefined)
			className = 'waiting';
		if (timeUntilShow == undefined)
			timeUntilShow = Protoload.timeUntilShow;
		
		
		element._waiting = true;
		if (!element._loading) {
			var e = document.createElement('div');
			var inner1 = document.createElement('div');
			var inner2 = document.createElement('div');
			var inner3 = document.createElement('div');
			var inner4 = document.createElement('div');
			var clearDiv = document.createElement('div');
			var inner1ok = document.createElement('span');
			var inner2ok = document.createElement('span');
			var inner3ok = document.createElement('span');
			var inner4ok = document.createElement('span');
			var okImg1 = document.createElement('img');
			okImg1.src='/img/ok.gif';
			var okImg2 = document.createElement('img');
			okImg2.src='/img/ok.gif';
			var okImg3 = document.createElement('img');
			okImg3.src='/img/ok.gif';
			var okImg4 = document.createElement('img');
			okImg4.src='/img/ok.gif';
			(element.offsetParent || document.body).appendChild(element._loading = e);
			e.style.position = 'absolute';
			try {e.style.opacity = Protoload.opacity;} catch(e) {}
			try {e.style.MozOpacity = Protoload.opacity;} catch(e) {}
			try {e.style.filter = 'alpha(opacity='+Math.round(Protoload.opacity * 100)+')';} catch(e) {}
			try {e.style.KhtmlOpacity = Protoload.opacity;} catch(e) {}
			
			if (innerText1 != undefined) {
				inner1.className = "innerText1";
				inner1.id = "innerText1";
				inner1.style.display="none";
				inner1ok.id = "innerText1OK";
				inner1ok.style.display="none";
				inner1.appendChild(document.createTextNode(innerText1));
				inner1ok.appendChild(okImg1);
				inner1.appendChild(inner1ok);
				e.appendChild(inner1);
			}
			
			if (innerText2 != undefined) {
				inner2.className = "innerText2";
				inner2.id = "innerText2";
				inner2.style.display="none";
				inner2.appendChild(document.createTextNode(innerText2));
				inner2ok.id = "innerText2OK";
				inner2ok.style.display="none";
				inner2ok.appendChild(okImg2);
				inner2.appendChild(inner2ok);
				e.appendChild(inner2);
			}
			
			
			if (innerText3 != undefined) {
				inner3.className = "innerText3";
				inner3.id = "innerText3";
				inner3.style.display="none";
				inner3.appendChild(document.createTextNode(innerText3));
				inner3ok.id = "innerText3OK";
				inner3ok.style.display="none";
				inner3ok.appendChild(okImg3);
				inner3.appendChild(inner3ok);

				e.appendChild(inner3);
			}
			
			
			if (innerText4 != undefined) {
				inner4.className = "innerText4";
				inner4.id = "innerText4";
				inner4.style.display="none";
				inner4.appendChild(document.createTextNode(innerText4));
				inner4ok.id = "innerText4OK";
				inner4ok.style.display="none";
				inner4ok.appendChild(okImg4);
				inner4.appendChild(inner4ok);

				e.appendChild(inner4);
			}
						
						
			//clearDiv.className ="clearfloat";
			//e.appendChild(clearDiv);
			
			/*var zIndex = 0;
			if (window.UI)
				if (UI.zIndex)
					zIndex = ++UI.zIndex;
			if (!zIndex)
				zIndex = ++Protoload._zIndex;
			e.style.zIndex = zIndex;*/
		}
		element._loading.className = className;
		window.setTimeout((function() {
			if (this._waiting) {
				var left = this.offsetLeft, 
					top = this.offsetTop,
					width = this.offsetWidth,
					height = this.offsetHeight,
					l = this._loading;
					
				l.style.left = left+'px';
				l.style.top = top+'px';
				l.style.width = width+'px';
				l.style.height = height+'px';
				l.style.display = 'inline';
			}
		}).bind(element), timeUntilShow);
	},
	
	// Stop waiting status - hide loading element
	stopWaiting: function(element) {
		if (element._waiting) {
			element._waiting = false;
			element._loading.parentNode.removeChild(element._loading);
			element._loading = null;
		}
	}/*,
	
	_zIndex: 1000000*/
};

if (Prototype) {
	Element.addMethods(Protoload);
	Object.extend(Element, Protoload);
}
/* */