/**************************************************\
*              ELEMENT COMPONENTS                  *
* Author: Andrew Green                             *
* Modified: 12/03/2009                             *
* Description:                                     *
\**************************************************/
Component.element=Component.observable.extend({
	thisClass:"Component.element",
	constructor : function(json){
		Component.element.parent.constructor.apply(this,arguments);
	},
	append : function(component){
		if(component && component.baseElement)
			this.baseElement.appendChild(component.getBaseElement());
		Component.element.parent.append.apply(this,arguments);
	},
	render : function(){
		layoutThis.apply(this);
		Component.observable.parent.render.apply(this,arguments);
	},
	getBaseElement : function(){
		return this.baseElement;
	},
	setHTML : function(text){
		this.baseElement.innerHTML=text;
	},
	on : function(eventName,eventFunction){//set functions for events
		alert(this['on'+eventName]);
		if(this['on'+eventName])
		{
			return this['on'+eventName].call(this,eventFunction);
		}
		
		
		if(!this.events[eventName])//if no array for even then create
		{

			DOM.addEvent(this.baseElement,eventName,function(e){
				this.fire(eventName,DOM.event(e));
			}.scope(this));
		}
		Component.element.parent.on.apply(this,arguments);
		return eventFunction;
	}
});



Component.div=Component.element.extend({
	thisClass:"Component.div",
	constructor : function(json){
		this._div = DOM.createElement('DIV');
		this.baseElement=this._div;
		Component.div.parent.constructor.apply(this,arguments);
	},
	onScroll : function (onEvent) {
		
		this.baseElement.onscroll=onEvent.scope(this);
	
		//this.baseElement.onscroll=onEvent.scope(this);
	},
	scrollLeft : function () {
		return this.baseElement.scrollLeft;
	},
	scrollTop : function () {
		return this.baseElement.scrollTop;
	}
	

});


Component.table=Component.element.extend({
	thisClass:"Component.table",
	constructor : function(json){
		this._table = DOM.createElement('TABLE');
		this.baseElement=this._table;
		Component.div.parent.constructor.apply(this,arguments);
	}
});
Component.tbody=Component.element.extend({
	thisClass:"Component.tbody",
	constructor : function(json){
		this._tbody = DOM.createElement('TBODY');
		this.baseElement=this._tbody;
		Component.div.parent.constructor.apply(this,arguments);
	}
});
Component.tr=Component.element.extend({
	thisClass:"Component.tr",
	constructor : function(json){
		this._tbody = DOM.createElement('TR');
		this.baseElement=this._tbody;
		Component.div.parent.constructor.apply(this,arguments);
	}
});
Component.td=Component.element.extend({
	thisClass:"Component.td",
	constructor : function(json){
		this._tbody = DOM.createElement('TD');
		this.baseElement=this._tbody;
		Component.div.parent.constructor.apply(this,arguments);
	}
});
Component.th=Component.element.extend({
	thisClass:"Component.th",
	constructor : function(json){
		this._tbody = DOM.createElement('TH');
		//alert(this._tbody);
		this.baseElement=this._tbody;
		Component.div.parent.constructor.apply(this,arguments);
	}
});

Component.iframe=Component.element.extend({
	thisClass:"Component.iframe",
	constructor : function(json){
		this._div = DOM.createElement('iframe');
		this.baseElement=this._div;
		Component.iframe.parent.constructor.apply(this,arguments);
	},
	setValue : function(val){
		this.baseElement.value=val;
		this.properties.Value=val;
	},
	setType : function(val){
		this.baseElement.type=val;
		this.properties.Type=val;
	}
});


Component.iframe=Component.element.extend({
	thisClass:"Component.iframe",
	constructor : function(json){
		this._div = DOM.createElement('iframe');
		this.baseElement=this._div;
		Component.iframe.parent.constructor.apply(this,arguments);
	},
	setSrc : function(val){
		this.baseElement.src=val;
		this.properties.Src=val;
	}
});


Component.img=Component.element.extend({
	thisClass:"Component.button",
	constructor : function(json){
		this._img = DOM.createElement('IMG');

		this.baseElement=this._img;
		Component.button.parent.constructor.apply(this,arguments);
	},
	append : function(component){
		if(component && component.baseElement)
			this._img.appendChild(component.getBaseElement());
		Component.button.parent.append.apply(this,arguments);
	},
	setSrc : function(val){
		this.baseElement.src=val;
	}
});

Component.button=Component.element.extend({
	thisClass:"Component.button",
	constructor : function(json){
		this._button = DOM.createElement('button');

		this.baseElement=this._button;
		Component.button.parent.constructor.apply(this,arguments);
	},
	append : function(component){
		if(component && component.baseElement)
			this._button.appendChild(component.getBaseElement());
		Component.button.parent.append.apply(this,arguments);
	},
	onClick : function(eventFunction){
		DOM.addEvent(this._button,'click',eventFunction.scope(this));
	},
	setText : function(val){
		this.baseElement.innerHTML=val;
	}
});

Component.text=Component.element.extend({
	thisClass:"Component.text",
	constructor : function(json){
		this._text = DOM.createElement('INPUT');
		this._text.type="text";
		this.baseElement=this._text;
		Component.button.parent.constructor.apply(this,arguments);
	},
	setText : function(val){
		this.baseElement.value=val;
	},
	getText : function(){
		return this.baseElement.value;
	},
	setType : function(val){
		this.baseElement.type=val;
	},
	getType : function(){
		return this.baseElement.type;
	}
});


Component.fieldset=Component.element.extend({
	thisClass:"Component.fieldset",
	constructor : function(json){
		this._fieldset = DOM.createElement('fieldset');
		this._legend = DOM.createElement('legend');
		this._fieldset.appendChild(this._legend);

		this.baseElement=this._fieldset;
		Component.fieldset.parent.constructor.apply(this,arguments);
	},
	setText : function(val){
		this._legend.innerHTML=val;
	}
});


Component.span=Component.element.extend({
	thisClass:"Component.span",
	constructor : function(json){
		this._span = DOM.createElement('SPAN');
		this.baseElement=this._span;
		Component.span.parent.constructor.apply(this,arguments);
	},
	setText : function(val){
		this.baseElement.innerHTML=val;
	}
});


function getUnit(val){
	if((/px/i).test(val))
		return 'px';
	if((/\%/i).test(val))
		return '%';
}
function layoutThis(){
 //if (!/MSIE (5\.5|6)/.test(navigator.userAgent) || typeof filters == 'unknown') return; // workaround for ie

 if (BrowserDetect.browser=="Explorer" && BrowserDetect.version<=7){//&& BrowserDetect.version<=7

	if(this.baseElement.style && this.baseElement.currentStyle && this.baseElement.currentStyle.left && this.baseElement.currentStyle.left!="auto" && this.baseElement.currentStyle.right && this.baseElement.currentStyle.right!="auto" && (!this.properties.Width || this.properties.Width=="") && this.baseElement.parentNode.clientHeight){
		var mUnit=getUnit(this.baseElement.currentStyle.right);
		var childWidth="";
		if(mUnit=="px")
			childWidth=(this.baseElement.parentNode.clientWidth - this.baseElement.offsetLeft-.00001)-parseInt(this.baseElement.currentStyle.right);
		else if(mUnit=="%"){
			childWidth=((this.baseElement.parentNode.clientWidth - this.baseElement.offsetLeft-.00001) - ((parseInt(this.baseElement.currentStyle.right)/100) * this.baseElement.parentNode.clientWidth));
			}
			if(childWidth<0)
				childWidth=1;
			this.baseElement.style.width=parseInt(childWidth+.5)+"px";
	}
	
	if(this.baseElement.style && this.baseElement.currentStyle && this.baseElement.currentStyle.top && this.baseElement.currentStyle.top!="auto" && this.baseElement.currentStyle.bottom && this.baseElement.currentStyle.bottom!="auto" && (!this.properties.Height || this.properties.Height=="") && this.baseElement.parentNode.clientHeight){
			var childHeight=(this.baseElement.parentNode.clientHeight - this.baseElement.offsetTop)-parseInt(this.baseElement.currentStyle.bottom);
			if(childHeight<0)
				childHeight=1;
			this.baseElement.style.height=parseInt(childHeight)+"px";
	}
 }
	
}
function thisLayout(){
	if(this.parentNode){
		layoutChildren.apply(this.parentNode);
	}

}
function layoutChildren(){
	
	for(var i=0;i<this.childNodes.length;i++){
		layoutThis.apply(this.childNodes[i]);
	
	}
}
function layoutThisOld(){
 if (!/MSIE (5\.5|6)/.test(navigator.userAgent) || typeof filters == 'unknown') return; // workaround for ie

	if(this.style && this.currentStyle && this.currentStyle.left && this.currentStyle.left!="auto" && this.currentStyle.right && this.currentStyle.right!="auto" && this.parentNode.clientHeight){
		var mUnit=getUnit(this.currentStyle.right);
		var childWidth="";
		if(mUnit=="px")
			childWidth=(this.parentNode.clientWidth - this.offsetLeft-.00001)-parseInt(this.currentStyle.right);
		else if(mUnit=="%"){
			childWidth=((this.parentNode.clientWidth - this.offsetLeft-.00001) - ((parseInt(this.currentStyle.right)/100) * this.parentNode.clientWidth));
			}
			if(childWidth<0)
				childWidth=1;
			this.style.width=parseInt(childWidth)+"px";
	}
	
	if(this.style && this.currentStyle && this.currentStyle.top && this.currentStyle.top!="auto" && this.currentStyle.bottom && this.currentStyle.bottom!="auto" && this.parentNode.clientHeight){
			var childHeight=(this.parentNode.clientHeight - this.offsetTop)-parseInt(this.currentStyle.bottom);
			if(childHeight<0)
				childHeight=1;
			this.style.height=parseInt(childHeight)+"px";
	}
	
}//something