registerObject("uiButton",uiButton);

function uiButton(object,args){
	object.getObject().style.cursor="pointer";
	object.getObject().style.textAlign="center";
	
	object.uibImageOver = "";
	object.uibImageOut  = "";
	object.uibImageDown = "";
	
	object.uibBackgroundOver = "#AAAAAA";
	object.uibBackgroundOut  = "#999999";
	object.uibBackgroundDown = "#666666";
	
	object.setBackColor(object.uibBackgroundOut);
	
	object.uibCaption = "";
	
	object.setImages = function(out,over,down){
		object.uibImageOver = uiUrl(over);
		object.uibImageOut = uiUrl(out);
		object.uibImageDown = uiUrl(down);	
		
		object.uibImageEleDown = new uiObject("img",object);
		object.uibImageEleDown.setVisible(false);
		object.uibImageEleDown.onload = function(){
			object.setWidth(object.uibImageEleDown.getWidth());
			object.setHeight(object.uibImageEleDown.getHeight());
		}
		object.uibImageEleDown.setSrc(down);
		
		object.setPicture(object.uibImageOut);
	}
	// IMAGE MOUSE OVER (image used when mouse is over button)
	object.setImageOver = function(src){
		src = uiUrl(src);
		object.uibImageOver = src;
	}
	
	object.getImageOver = function(){
		return object.uibImageOver;	
	}
	
	// IMAGE MOUSE OUT (normal image used)
	object.setImageOut = function(src){
		src = uiUrl(src);
		object.uibImageOut = src;
		object.setPicture(object.uibImageOut);		
	}
	
	object.getImageOut = function(){
		return object.uibImageOut;
	}
	
	object.setBorder = function(value){
		if(value) object.getObject().style.border="outset thin"; else object.getObject().style.border="";	
	}
	object.setBorder(true);
	
	// IMAGE DOWN PICTURE (picture loaded when clicked)
	object.setImageDown = function(src){
		src = uiUrl(src);
		object.uibImageEleDown = new uiObject("img",object);
		object.uibImageEleDown.setVisible(false);
		object.uibImageEleDown.onload = function(){
			object.setWidth(object.uibImageEleDown.getWidth());
			object.setHeight(object.uibImageEleDown.getHeight());
		}
		object.uibImageEleDown.setSrc(src);
		object.uibImageDown = src;
	}
	
	object.getImageDown = function(){
		return object.uibImageDown;	
	}
	
	// OVER BACKGROUND COLOR (the colour of the button when the mouse goes over)
	object.setBackgroundOver = function(value){
		object.uibBackgroundOver = value;
	}
	
	object.getBackgroundOver = function(){
		return object.uibBackgroundOver;	
	}
	
	// OUT BACKGROUND COLOR (the colour of the button when the mouse goes out)	
	object.setBackgroundOut = function(value){
		object.uibBackgroundOut = value;	
	}
	
	object.getBackgroundOut = function(){
		return object.uibBackgroundOut;	
	}

	// DOWN BACKGROUND COLOR (the colour of the button when the button is clicked)
	object.setBackgroundDown = function(value){
		object.uibBackgroundDown = value;	
	}
	
	object.getBackgroundDown = function(){
		return object.uibBackgroundDown;	
	}
	
	// THE BUTTONS CAPTION / OR TEXT
	object.setCaption = function(value){
		object.uibCaption = value;	
		object.setText(value);
	}
	
	object.getCaption = function(){
		object.uibCaption = object.getText();
		return object.uibCaption;	
	}
	
	function onmouseover(){
		if(object.uibImageOver!="") object.setPicture(object.uibImageOver);
		object.setBackColor(object.uibBackgroundOver);
	}
	
	function onmousedown(){
		if(object.uibImageDown!="") object.setPicture(object.uibImageDown);
		object.setBackColor(object.uibBackgroundDown);			
	}
	
	function onmouseout(){
		if(object.uibImageOut!="") object.setPicture(object.uibImageOut);
		object.setBackColor(object.uibBackgroundOut);		
	}
	
	object.addEventListener('mouseover',onmouseover,false);
	object.addEventListener('mouseout' ,onmouseout ,false);
	object.addEventListener('mousedown',onmousedown,false);
	
	// border
	
	// onclick (already covered)
}