//component registration
var uiTemplateUrl = "";
var components = new Array();
function registerObject(objectname, objectcode){
	var count = components.length;
	components[count] = new function(){ this.name = objectname; this.code = objectcode; };
}
//adv ui components / mix several uiObjects to create an advanced user interface
function uiExObject(objectname, uiobject){
	for(var i=0; i<components.length; i++){
		if(components[i].name==objectname){
			uiobject.setClass(components[i].name);
			return components[i].code(uiobject);
		}
	}
	return false;
}
function uiUrl(url){
	return url.replace(/%template%/i,uiTemplateUrl);	
}
//extended div component building block for the whole UI
function uiObject(/* args */){
	var me = this;
	// private variables	
	var memObject = null;
	var memTag = "";
	var memOpacity = 100;
	
	var events = new Array();
	events["click"] 	= new Array();
	events["mouseout"] 	= new Array();
	events["mouseover"] = new Array();
	events["mousemove"] = new Array();	
	events["keyup"] 	= new Array();
	events["keydown"] 	= new Array();
	events["keypress"] 	= new Array();
	events["mousedown"] = new Array();
	events["mouseup"]	= new Array();	
	events["error"] 	= new Array();
	events["load"] 		= new Array();
	events["unload"] 	= new Array();	
	
	me.onload 	   = "";
	me.onunload    = "";
	me.onerror	   = "";
	me.onresize	   = "";
	//var dragging = false, dragx=-1, dragy=-1;
	// public variables
	me.name = "";
	me.type = "uiObject";
	
	me.dragX=me.dragY=me.sizeX=me.sizeY=null;
	// constructor	
	function construct(args){
		var exui="";

		if(args.length > 0){
			if(typeof(args[0])!="object" && args[0].substr(0,2)=="ui"){
				exui=args[0];
				args[0]="div";	
			}
		}
		
		// (object, parent,left,top,width,height,backcolor)
		if(args.length > 0 && typeof(args[0]!="undefined")) 
			if(typeof(args[0])=="object") memObject=args[0]; else memObject=document.createElement(args[0]); 
		if(args.length > 1 && args[1]!=null) me.attachObject(args[1]);
		if(args.length > 2 && args[2]!=null) memObject.style.left  =args[2]+"px";
		if(args.length > 3 && args[3]!=null) memObject.style.top   =args[3]+"px";
		if(args.length > 4 && args[4]!=null) memObject.style.width =args[4]+"px";
		if(args.length > 5 && args[5]!=null) memObject.style.height=args[5]+"px";
		if(args.length > 6 && args[6]!=null) me.setBackColor(args[6]);
		//if(!(args.length > 7 && args[7]!=null && args[7]==false)) registerEvents(memObject);
		
		
		//{ if(args[6]==true) registerEvents(memObject); }else registerEvents(memObject);
		
		//
		me.setClass("uiObject");
		memObject.style.overflow="hidden";
		if(args.length > 2) memObject.style.position="absolute";
			
		if(exui!="") return uiExObject(exui,me);
		return true;
	}
	
	function onEvent2(e,obj,eventName,eventBubble){
		if(!e) e=window.event;
		if(eventBubble || true==true){
			e.cancelBubble = true;
			if (e.stopPropagation) e.stopPropagation();
		}
		// run the asociated functions	
		if(events[eventName]!=null)
			for(var i=0; i<events[eventName].length; i++)
				if(events["click"][i]!="") value = events[eventName][i](e,obj);
		return value;
	}
	
	me.addEventListener = function(eventName,eventHandler,eventBubble){
		if(!memObject) return;
		
		if(memObject.addEventListener && true==false){
			// Modern W3C supporting browser
			return memObject.addEventListener(eventName,eventHandler,eventBubble);
		}else{
			// Any Microsoft or other older browsers
			if(events[eventName]!=null){
				events[eventName][events[eventName].length]=eventHandler;
				handler = function (e,obj) { return onEvent2(e,obj,eventName,eventBubble); };
				switch(eventName){
					case "click": 		memObject.onclick 		= handler; break;
					case "mouseout": 	memObject.onmouseout 	= handler; break;
					case "mouseover": 	memObject.onmouseover 	= handler; break;
					case "mousedown": 	memObject.onmousedown 	= handler; break;
					case "keyup": 		memObject.onkeyup 		= handler; break;
					case "keydown": 	memObject.onkeydown 	= handler; break;
					case "keypress":	memObject.onkeypress 	= handler; break;
					case "load": 		memObject.onload 		= handler; break;
					case "unload": 		memObject.onunload 		= handler; break;
					case "error": 		memObject.onerror 		= handler; break;
					case "mouseup": 	memObject.onmouseup 	= handler; break;					
					case "mousemove":	memObject.onmousemove 	= handler; break;					
				}
			}
		}
	}
	
	me.removeEventListener = function(eventName,eventHandler,eventBubble){
		if(!memObject) return;
		if(memObject.removeEventListener)
			// Modern W3C supporting browser
			return memObject.removeEventListener(eventName,eventHandler,eventBubble);
		else{
			// Any Microsoft or other old browsers
			if(events[eventName]!=null)
				for(var i=0; i<events[eventName].length; i++)
					if(events[eventName][i] == eventHandler) events[eventName][i]="";
		}
	}
	// get properties
	me.getLeft = function(){ 
		if(memObject && memObject.offsetLeft) return memObject.offsetLeft; else return -1;
	}
	me.getTop = function(){ 
		if(memObject && memObject.offsetTop) return memObject.offsetTop; else return -1;
	}
	me.getWidth = function(){ 
		if(memObject && memObject.offsetWidth) return memObject.offsetWidth; else return -1;	
	}
	me.getHeight = function(){ 
		if(memObject && memObject.offsetHeight) return memObject.offsetHeight; else return -1;	
	}
	me.getSrc = function(){
		if(memObject) return memObject.src;	
	}
	me.getPicture = function(){ 
		if(memObject && memObject.style) return memObject.style.backgroundImage; else return "";	
	}
	me.getBackColor = function(){ 
		if(memObject && memObject.style) return memObject.style.backgroundColor; else return -1;	
	}
	me.getForeColor = function(){ 
		if(memObject && memObject.style) return memObject.style.color; else return -1;
	}
	me.getCursor = function(value){
		if(memObject && memObject.style) return memObject.style.cursor;
	}	
	me.getText = function(){
		if(!memObject || !memObject.firstChild) return "";
		return memObject.firstChild.nodeValue		
	}
	me.getClass = function(){
		if(memObject) return memObject.className;	
	}
	me.getVisible = function(){ return (memObject && memObject.style && memObject.style.visibility!="hidden"); }
	//me.getParent = function(){ return memParent; }
	me.getObject = function(){ return memObject; }
	// set properties
	me.setClass = function(value){
		if(memObject) memObject.className = value;	
	}
	me.setTop = function(value){ 
		if(memObject && memObject.style){
			memObject.style.position = "absolute";
			//memObject.style.overflow="hidden";
			memObject.style.top = value+"px";
			onresize();
		}
	}
	me.setLeft = function(value){	
		if(memObject && memObject.style){
			memObject.style.position = "absolute";
			//memObject.style.overflow="hidden";
			memObject.style.left = value+"px";
			onresize();
		}
	}
	me.setPos = function(left, top){
		if(left) me.setLeft(left);
		if(top) me.setTop(top);
	}
	me.setWidth = function(value){
		if(memObject && memObject.style) memObject.style.width = value+"px";
		onresize();
	}
	me.setHeight = function(value){
		if(memObject && memObject.style) memObject.style.height = value+"px";
		onresize();
	}
	
	me.setSrc = function(value){
		value = uiUrl(value);
		if(memObject) memObject.src=value;	
	}
	
	me.setPicture = function(value){
		value = uiUrl(value);
		if(memObject && memObject.style) memObject.style.backgroundImage = "url('"+value+"')";
	}
	
	me.setBackColor = function(value){
		if(memObject && memObject.style) memObject.style.backgroundColor = value;
	}
	me.setForeColor = function(value){
		if(memObject && memObject.style) memObject.style.color = value;
	}
	
	me.setText = function(value){
		if(!memObject) return;
		if(!memObject.firstChild) memObject.appendChild(document.createTextNode(""));
		//if(!memObject.firstChild) memObject.appendChild(document.createElement("p"));
		memObject.firstChild.nodeValue = value;		
	}
	
	me.setCursor = function(value){
		if(memObject && memObject.style) memObject.style.cursor = value;
	}
	
	me.setVisible = function(value){
		if(value  && memObject && memObject.style) memObject.style.visibility = "visible";
		if(!value  && memObject && memObject.style) memObject.style.visibility = "hidden";		
	}
	
	me.setOpacity = function(value){
		memOpacity = value;
		memObject.style.opacity=value/100;
		memObject.style.filter="alpha(opacity="+value+")";				
	}
	
	me.getOpacity = function(){
		return memOpacity;	
	}
	
	me.move = function(left, top, width, height){
		if(typeof(left)!="undefined" && left!=null) 	me.setLeft(left);
		if(typeof(top)!="undefined" && top!=null) 		me.setTop(top);
		if(typeof(width)!="undefined" && width!=null) 	me.setWidth(width);
		if(typeof(height)!="undefined" && height!=null) me.setHeight(height);
	}
	
	me.fade = function(startValue, endValue, totalTime,frames, callback){
		me.setOpacity(startValue);
		var diff = endValue - startValue;
		var change = diff/frames;
		var interval = totalTime/frames;		
		
		var frame = 0;
		var id;
		
		function fadefunc(){
			frame++;
			memOpacity+=change;
			me.setOpacity(memOpacity);
			if(frame > 10){
				clearInterval(id);
				if(callback!=null && callback!="") callback();	
			}
		}
		
		id = setInterval(fadefunc,interval);
	}
	
	me.attachObject = function(object){
		if(object.type=="uiObject"){
			//object.getObject().appendChild(memObject);
			object.appendObject(memObject);
		}else{
			object.appendChild(memObject);
		}
	}
	
	me.appendObject = function(object){
		if(object.type=="uiObject"){
			memObject.appendChild(object.getObject());
			//object.setParent(this);
		}else{
			memObject.appendChild(object);
		}
	}
	
	me.bringToTop = function(){
		//alert(memObject);
		var tmp = memObject.parentNode.childNodes;
		//alert(memObject.parentNode+" "+tmp.length);
		for(i=0; i<tmp.length; i++){
			if(tmp[i].style) if(tmp[i].style.zIndex!=0) tmp[i].style.zIndex--;
		}
		memObject.style.zIndex=i;
	}
	
	me.sendToBack = function(){
		var tmp = memObject.parentNode.childNodes;
		for(i=0; i<tmp.length; i++){
			//if(tmp[i].style.zOrder!=0) 
			if(tmp[i].style.zIndex < tmp.length) tmp[i].style.zIndex++;
			
		}
		memObject.style.zIndex=0;		
	}
	// events
	function begindrag(e){
		me.bringToTop();
		//memObject.style.zIndex="";
		var p = memObject.parentNode;
		var uip = new uiObject(p);
		//uip.setEnable(false);
		me.dragscr = new uiObject("div");
		p.appendChild(me.dragscr.getObject());
		me.dragscr.getObject().style.zIndex = memObject.style.zIndex+1;
		me.dragscr.move(0,0,uip.getWidth(), uip.getHeight());
		me.dragscr.setBackColor("#222222");
		me.dragscr.getObject().id="dragscr";
		me.dragscr.addEventListener('mouseup', enddrag, false);
		me.dragscr.addEventListener('mousemove', ondrag, false); 
		me.dragscr.getObject().style.opacity="0.4";
		me.dragscr.getObject().style.filter="alpha(opacity=40)";
		//me.dragscr.onselectstart = function(){ return false; };
		//me.dragscr.ondrag = function(){ return false; };


		me.dragX = e.clientX - me.getLeft();
		me.dragY = e.clientY - me.getTop();
		
		var uip=p=null;
		
        //document.body.focus();
        //document.onselectstart = function () { return false; };
		
		return false;
	}
	me.begindrag = begindrag;
	
	function ondrag(e){
		var newwidth = me.getWidth();
		var newheight = me.getHeight();
		if(me.sizeX!=null || me.sizeY!=null){
			var newleft = me.getLeft();
			var newtop = me.getTop();
				me.contents.setText(newleft+" "+newwidth+" "+e.clientX+" "+me.dragX);
			
			var absleft = 0, abstop = 0;
			var obj = me.getObject();
			if (obj.offsetParent) {
				do {
					absleft += obj.offsetLeft; abstop += obj.offsetTop;
				} while (obj = obj.offsetParent);
			}
			
			if(me.sizeX==1){ 
				newwidth = e.clientX - absleft; 
			}else if(me.sizeX==-1){ 
				newleft = (e.clientX-me.dragX);
				newwidth +=	me.getLeft() - newleft;			
			}
			
			if(me.sizeY==1){
				newheight = e.clientY - abstop; 
			}else if(me.sizeY==-1){ 
				newtop = e.clientY - me.dragY;
				newheight += me.getTop() - newtop;						
			} 
	//if(newleft < 0) newleft=0;
	//if(newleft + newwidth > memObject.parentNode.offsetWidth) newwidth = memObject.parentNode.offsetLeft - newleft;
	//if(newtop < 0) newtop=0;
	//if(newtop + newheight > memObject.parentNode.offsetHeight) newtop = memObject.parentNode.offsetTop - newtop;
			
			me.move(newleft,newtop,newwidth,newheight);
		}else{
			if(memObject && memObject.parentNode){
				newleft = e.clientX - me.dragX;
				newtop = e.clientY - me.dragY;
				if(newleft < 0) newleft=0;
				if(newtop < 0) newtop=0;
				if(newleft + newwidth > memObject.parentNode.offsetWidth) newleft = memObject.parentNode.offsetWidth-newwidth;
				if(newtop + newheight > memObject.parentNode.offsetHeight) newtop = memObject.parentNode.offsetHeight-newheight;
			}
			me.setPos(newleft,newtop);
		}
		return false;
	}
	
	function enddrag(e){
		var ele = me.dragscr.getObject(); // document.getElementById("dragscr");
		ele.parentNode.removeChild(ele);
		//me.dragscr.setEnable(false);
		me.dragscr=null;
		me.sizeX=me.sizeY=me.dragX=me.dragY=null;
		return false;
	}
/*
	function registerEvents(object){
		object.onload = onload;
		object.onerror = onerror;
		object.onmouseover = onmouseover;
		object.onmouseout = onmouseout;
		object.onmousemove = onmousemove;
		object.onmousedown = onmousedown;
		object.onmouseup = onmouseup;
		//if(typeof(object.onkeydown)!="undefined") 	me.onkeydown = object.onkeydown;
		//if(typeof(object.onkeyup)!="undefined") 	me.onkeyup = object.onkeyup;
		//if(typeof(object.ondrag)!="undefined") 		me.ondrag = object.ondrag;
		object.onclick = onclick;
		//if(typeof(object.ondblclick)!="undefined") 	me.ondblclick = object.ondblclick;
		object.onunload = onunload;
		//if(typeof(object.onkeypress)!="undefined") 	me.onkeypress = object.onkeypress;
		//alert("Still registering events");
	}
*/	
	function onevent(e){
		if(!e) e=window.event;
		if(e){
			e.cancelBubble = true;
			if (e.stopPropagation) e.stopPropagation();
			return e;
		}else
			return;
	}
	this.onevent = onevent;
	
	function onload(e){
		//if(!memEnable) return false;
		e = onevent(e);
		if(me.onload!="") me.onload(e,me);
	}
	
	function onerror(e){
		//if(!memEnable) return false;
		e = onevent(e);
		if(me.onerror!="") me.onerror(e,me);		
	}
	
	function onunload(e){
		//if(!memEnable) return false;
		e = onevent(e);
		if(me.onunload!="") me.onunload(e,me);	
	}
	
	function onmove(object, newLeft, newTop){
	
	}
	
	function onresize(e){
		//if(!memEnable) return false;
		e = onevent(e);
		if(me.onresize!="") me.onresize(e,me);
	}

	// cleanup
	function removeElement(parent){
		if(!parent) return;
		for(var i=0; i<parent.childNodes.length; i++){
			removeElement(parent.childNodes[i]);	
		}
		var p = parent.parentNode;
		if(p!=null){ p.removeChild(parent); p =null; }
	}
	
	me.destroy = function(){
		me.onunload();
		removeElement(memObject);
		memObject = null;
	}
	// call construct
	construct(uiObject.arguments);//) return null;
}