Button = function(name, parentDiv, w, h, handleCommand) {
	this.states = { 'up': 0, 'over': 1, 'down': 2, 'disabled': 3 };
	this.behaviors = {'button' : 0, 'checkbox' : 1, 'radio' : 2 };
	this.positions = { 'absolute' : 0, 'relative': 1 };
	
	this.parentArray = null;
	this.name = name;
	this.checked = false;
	
	this.handlersEvent = new Object();
	this.handleCommand = handleCommand;
	this.backgroundImage = null;

	// Html elements
	this.html = new Object();
	this.html.parentDiv = parentDiv;	
	this.html.div = document.createElement('div');
	if (this.html.parentDiv == null) { this.html.parentDiv = document.body; }
	this.html.parentDiv.appendChild(this.html.div); 
	
	
	this.html.divEvents = document.createElement('div');
	this.html.div.appendChild(this.html.divEvents);
	this.html.divCaption = document.createElement('div');
	this.html.div.appendChild(this.html.divCaption);	
	//this.html.div.style.position = 'absolute';
	this.html.divEvents.style.position = 'absolute';
	this.html.divCaption.style.position = 'absolute';
	this.html.divEvents.style.left = this.html.divEvents.style.top = '0px';
	this.html.divCaption.style.left = this.html.divCaption.style.top = '0px';
	this.html.divEvents.style.zIndex = 10;
	this.html.divCaption.style.zIndex = 5;
	
	if (oBrowserSniffer.isMsie == true) {
		setOpacity(this.html.divEvents, 0);
		setTimeout(this.name + '.html.divEvents.style.backgroundColor = "yellow"; ', 50);
	}

	this.html.divEvents.userData = new Object();
	this.userData = this.html.divEvents.userData;
	this.userData.name = this.name;
	this.html.divEvents.userData.button = this;
	
	this.behavior = this.behaviors.button;
	this.htmlObj = { 'caption' : this.html.divCaption, 'background' : this.html.div };
	
	// Init
	this.setPositionType('absolute');
	this.setSize(w, h);
	this.setFontSize(10);
	this.setState('up');
	this.setEvents();
}

Button.prototype = {
	setParentArray : function(parentArray) { 
		this.parentArray 	= parentArray;
		this.behavior		= this.behaviors.radio;
	
	},
	
	setBehavior : function(behavior) { 
		if (this.behaviors[behavior] == null) { return; }
		this.behavior = this.behaviors[behavior];
	},
	
	setEvents : function() { 
		this.html.divEvents.onmouseover = function() { var oTmp = eval(this.userData.name); oTmp.onEvent('over'); };						
		this.html.divEvents.onmouseout 	= function() { var oTmp = eval(this.userData.name); oTmp.onEvent('out'); };						
		this.html.divEvents.onmousedown	= function() { var oTmp = eval(this.userData.name); oTmp.onEvent('down'); };
		this.html.divEvents.onmouseup	= function() { var oTmp = eval(this.userData.name); oTmp.onEvent('up'); };
		this.html.divEvents.onclick	= function() { var oTmp = eval(this.userData.name); oTmp.onEvent('click'); };
	},
	
	setSize : function(w, h) {
		this.w = w;
		this.h = h;
		this.html.div.style.width = this.html.divEvents.style.width = this.w + 'px';
		this.html.div.style.height = this.html.divEvents.style.height = this.h + 'px';
		this.html.divCaption.style.width = this.w + 'px';
	},
	
	getSize : function() {
		return {height: this.h, width: this.w};
	},

	setPosition : function(x, y) {
		this.x = x; this.y = y;
		setPositionAbsoluteTop(this.html.div, this.y);		
		this.html.div.style.left = this.x + 'px';
	},

	setImage : function(url) {
		this.backgroundImage = url;
		this.html.div.style.background = "url('" + this.backgroundImage + "')";
		this.html.div.style.backgroundPosition = '0px 0px';
	},

	setCaption : function(text) {
		this.text = text;
		this.html.divCaption.innerHTML = this.text;
		this.html.divCaption.style.textAlign = 'center';
		this.html.divCaption.style.verticalAlign = 'middle';
		if (this.html.divCaption.offsetHeight != 0 && !isNaN(this.html.divCaption.offsetHeight)) {
			this.html.divCaption.style.top = parseInt(((this.h - this.html.divCaption.offsetHeight) / 2 ), 10) + 'px';
		}
		else { //HACK! vertical align no work			
			this.html.divCaption.style.top = parseInt(((this.h - this.fontSize) / 2 ), 10) + 'px';
		}
	},

	setFontSize : function(size) {
		this.fontSize = size;
		this.html.divCaption.style.fontSize = this.fontSize + 'px';
	},

	setState : function(state) {
		if (this.states[state] == null) { return; }
	
		this.state = this.states[state];
		
		if (this.backgroundImage != null) {
			var offsetY = -this.h * this.states[state];
			this.html.div.style.backgroundPosition = '0px ' + offsetY + 'px';
		}
		
		this.applyCss(state, this.htmlObj.background);
		this.applyCss(state, this.htmlObj.caption);
		
		if (this.html.divShadow != null) {  this.setShadow(); }
	},

	getState : function() {
		return this.states[this.state];
	},
	
	setEventHandlerData : function(name, value) {
		this.html.divEvents.userData[name] = value;
	},

	setEventHandler : function(name, value, obj) {
		switch (name) {
			case 'over': case 'up': case 'down': case 'up': case 'click': case 'out':
				if (this.handlersEvent[name] == null) { this.handlersEvent[name] = new Object(); }				
				this.handlersEvent[name]['method'] = value;
				if (obj != null) { this.handlersEvent[name]['object'] = obj; }
				break;
			default:
				this.html.divEvents['on' + name] = value;
		}
	},
	
	onEvent : function(sEvent){
		if (this.state == this.states.disabled) { 
			if ((sEvent == 'over' || sEvent == 'out')  && this.oToolTip != null) { //For ToolTipText
				this.setExtarEvents(sEvent);
			}		
			return; 
		}
		
		eventName = sEvent;
		
		switch (this.behavior) {
			case this.behaviors.radio:
				if (sEvent == 'click') { this.unCheckedForArray(); this.setChecked(true); }
				if (this.checked == true) { this.setStateForArray('up'); sEvent = 'down'; }
				break;
			case this.behaviors.checkbox:
				if (sEvent == 'click') { this.setChecked(!this.checked); }
				if (this.checked == true) { sEvent = 'down'; }
				if (sEvent == 'click' && this.checked == false) { sEvent = 'over';  }
				break;
			case this.behaviors.button:
				if (sEvent == 'up') { sEvent = 'over'; }
				break;
		}
		
		if (sEvent == 'out') { sEvent = 'up'; }
		
		this.setState(sEvent);
		this.setExtarEvents(eventName);
	},
	
	
	setExtarEvents : function(eventName) {
		if (this.handlersEvent[eventName] != null) {
			var e = new Object();			
			if (this.handleCommand == true) {
				e.target = this.html.divEvents; e.type = eventName;
			}
			else {
				e = this.html.divEvents;
			}			
			
			if (this.handlersEvent[eventName]['object'] != null) {
				var obj = this.handlersEvent[eventName]['object'];
				obj[this.handlersEvent[eventName]['method']](e);
			}
			else {
				this.handlersEvent[eventName]['method'](e);
			}
		}	
	},
	
	setStateForArray : function(sEvent) {	
		for(var i=0;i<this.parentArray.length; i++) {
			if (this.parentArray[i].state != this.states.disabled && this.parentArray[i].checked == false) {
				this.parentArray[i].setState(sEvent);
			}
		}
	},
	
	unCheckedForArray : function() {
		if (this.behavior != this.behaviors.radio) { return; }
		for(var i=0;i<this.parentArray.length; i++) {
			if (this.parentArray[i].state != this.states.disabled) {
				this.parentArray[i].setChecked(false);
			}
		}
	},
	
	getButtonOnArray : function(FieldName, FieldValue) {
		if (this.behavior != this.behaviors.radio) { return; }
		for(var i=0;i<this.parentArray.length; i++) {
			if (this.parentArray[i].userData[FieldName] == FieldValue) {
				return this.parentArray[i];
			}
		}
		return null;
	},
	
	setChecked : function(bValue) {
		this.checked = bValue;
		if (bValue == true && this.parentArray != null) {
			this.parentArray["lastChecked"] = this; 
		}
		if (bValue == true) { this.setState('down'); }
	},
	
	setPositionType : function(position) {
		if (this.positions[position] == null) { return; }
		this.position = this.positions[position];

		switch (this.position) {
			case this.positions.absolute:
				this.html.div.style.position = 'absolute';
				break;
			case this.positions.relative:
				this.html.div.style.position = 'relative';
				this.html.div.style.display  = 'block';
				break;
		}
	},
	
	setVisibility : function(bValue) {
		this.html.div.style.display = (bValue == false ? 'none' : 'block');
	},

	setLabel : function(sCaption, w, h, lblPositions){
		if (this.oLabel == null) {
			this.oLabel = new Label(this.name + '.oLabel', this.html.parentDiv, w, h, sCaption, this );
		} 
		else {
			this.oLabel.setSize(w, h);
			this.oLabel.setCaption(sCaption);
		}
		this.oLabel.setParentObjPosition(lblPositions);
		
		return this.oLabel;
	},
	
	setToolTip : function(sCaption) {
		if (this.oToolTip == null) {
			this.oToolTip = new ToolTip(this.name + '.oToolTip', this.html.div, sCaption, this);
			this.setEventHandler('over', 'mouseOver', this.oToolTip);
			this.setEventHandler('out', 'mouseOut', this.oToolTip);
		} 
		else {
			this.oToolTip.setCaption(sCaption);
		}
		return this.oToolTip;
	},

	setShadow : function(x, y, sColor) {
		if (x == null) { x = 1; }
		if (y == null) { y = 1; }
		if (sColor == null) { sColor = 'gray'; }
		
		
		if (this.html.divShadow == null) {
			this.html.divShadow = document.createElement('div');
			this.html.div.appendChild(this.html.divShadow);
		}
		this.html.divShadow.style.position = 'absolute';
		this.html.divShadow.innerHTML = this.text;
		this.html.divShadow.style.color = sColor;
		this.html.divShadow.style.width = this.w + 'px';
		this.html.divShadow.style.textAlign = this.html.divCaption.style.textAlign;
		this.html.divShadow.style.verticalAlign = this.html.divCaption.style.verticalAlign;
		this.html.divShadow.style.fontSize = this.html.divCaption.style.fontSize;
		this.html.divShadow.style.fontFamily = this.html.divCaption.style.fontFamily;

		this.html.divShadow.style.left = x + 'px';
		
		
		//this.html.divCaption.style.width = this.w + 'px';
		if (this.html.divCaption.offsetHeight != 0 && !isNaN(this.html.divCaption.offsetHeight)) {
			this.html.divShadow.style.top = (this.html.divCaption.offsetTop + y) + 'px';
		}
		else { //HACK! vertical align no work
			this.html.divShadow.style.top = (parseInt(((this.h - this.fontSize) / 2 ), 10) + y ) + 'px';
		}		
	}, 
	
	setCss : function(sProperty, oValues, htmlObj) {
		//if (this.states[state] == null) { return; }
		if (htmlObj != null && this.htmlObj[htmlObj] == null) { return; }
		
		if (htmlObj == null) {
			switch (sProperty) {
				case "color": case "fontSize": case "fontFamily":
					htmlObj = this.html.divCaption; 
					break;
				case "border": case "backgroundColor":
					htmlObj = this.html.div; 
					break;
				default:
					alert('ERROR'); return;
			}
		}
		else { htmlObj = this.htmlObj[htmlObj]; }
		
	
		aStates = new Array('up', 'over', 'down', 'disabled');
		for (var i=0; i<aStates.length; i++) {
			if (htmlObj.css == null) { htmlObj.css = new Array(); }
			if (htmlObj.css[aStates[i]] == null) { htmlObj.css[aStates[i]] = new Array(); }
			if (oValues[aStates[i]] != null) {
				oCss = new Object();
				oCss["sProperty"] = sProperty; oCss["sValue"] = oValues[aStates[i]];
				htmlObj.css[aStates[i]].push(oCss);
			}
		}
		
	},
	
	applyCss : function(state, htmlObj) {
		if (htmlObj.css == null) { return; }
		if (htmlObj.css[state] == null) {
			state = 'up';
			if (htmlObj.css[state] == null) { return; }
		}
		
		for (var i = 0; i < htmlObj.css[state].length; i++) {
			var sProperty = htmlObj.css[state][i]["sProperty"];
			var sValue = htmlObj.css[state][i]["sValue"];
			htmlObj.style[sProperty] = sValue;
		}
	}

	
}
