//////////////////////////////////////////////////////////////////////////////
// CLASS jsButtonObj()	-	Handles the mouse over/up/down graphical
//							aspects of js buttons.  Also handles preloading.
//
// Instructions	-	1.	Run the setup methods to assign the button up/over/down pics,
//						image id.
//					2.  Run preloader method if desired
//					3.	Wait til the appropriate elements load run assignToId(id) where 'id'
//						is the element whose mouse actions control the button state (ie the 
//						image, surrounding div/td/tr, etc...) (may be assigned to multiple objects
//					Thats it.  All mouse events are handled automatically by the class.
//	...or alternatively...
//					1. 	Setup of the object as before but dont run assignToId
//					2.  Place the button actions (.buttonOn, .buttonOff, etc.) in the mouse event
//						attributes of the elements you want to control the button.
//
// PROPERTIES
//	._useButtonDown		-if true then button is tri-state, false = bi-state
//	.srcOn
//	.srcOff
//	.srcDown
//	.imgId				-id of image tag
//	.imgOn				-used by preloader to place off and down images in cache
//	.imgOff				-ditto
//
// METHODS
//	.setImgId(id)
//	.setButtonOnSrc(src)
//	.setButtonOffSrc(src)
//	.setButtonDownSrc(src)
//	.setButtonSrc(srcOff, srcOn, srcDown)	- runs the three functions above
//	._enableButtonDown()					- these two set ._useButtonDown flag (see above)
//	._disableButtonDown()
//
//	.preload()			-preloads the over and down (if tri-state) button images
//	.buttonOn()			-manually turns button on
//	.buttonOff()
//	.buttonDown()
//	.assignToId(id)		-Sets the mouse events of the element 'id' to control the images graphical state
//						 This method assigns the new actions while also preserving anything already attached to the
//						 events of this object (though either js or the onmouse...="" attributes). The functions
//						 previously assigned to the events will be run first.
///////////////////////////////////////////////////////////////////////////////////////////////////
function jsButtonObj() {
	this._useButtonDown = true;
	
	this.srcOn 		= '';
	this.srcOff 	= '';
	this.srcDown	= '';	
	this.imgId		= '';

	//image objects used for preloading
	this.imgOn 		= new Image();
	this.imgDown 	= new Image();
	
	//setup methods
	this.setImgId = jbo_setImgId
	this.setButtonOnSrc 	= jbo_setButtonOnSrc;
	this.setButtonOffSrc 	= jbo_setButtonOffSrc;
	this.setButtonDownSrc 	= jbo_setButtonDownSrc;
	this.setButtonSrc 		= jbo_setButtonSrc;
	this._enableButtonDown 	= jbo_enableButtonDown;
	this._disableButtonDown = jbo_disableButtonDown
	
	//render methods
	this.preload = jbo_preload;
	this.buttonOn 	= jbo_buttonOn;
	this.buttonOff 	= jbo_buttonOff;
	this.buttonDown = jbo_buttonDown;
	
	this.assignToId = jbo_assignToId;
}

///////////////////////////////
// Set up the vitals
///////////////////////////////
function jbo_setImgId(id) {	this.imgId = id;	}
function jbo_setButtonOnSrc(src) 	{	this.srcOn = src;	}
function jbo_setButtonOffSrc(src) 	{	this.srcOff = src;	}
function jbo_setButtonDownSrc(src) 	{	this.srcDown = src;	}
function jbo_setButtonSrc(offSrc, onSrc, downSrc) {	
	this.srcOn 		= onSrc;	
	this.srcOff 	= offSrc;	
	this.srcDown 	= downSrc;	
}
function jbo_disableButtonDown() {	this._useButtonDown = false; }
function jbo_enableButtonDown()	 {	this._useButtonDown = true;	 }

////////////////////////////////////////////////////////
// Preload the on and down (if applicable) source files
// into the cache
////////////////////////////////////////////////////////
function jbo_preload() {
	var on = new Image();
	on.src = this.srcOn;

	var off = new Image();
	off.src = this.srcOff;
	
	if (this._useButtonDown) {
		var down = new Image();
		down.src = this.srcDown;
	}
}

///////////////////////////////////////
// Button state changing methods
//////////////////////////////////////
function jbo_buttonOn() {
	if (img = document.getElementById(this.imgId))
		img.src = this.srcOn;
}
function jbo_buttonOff() {
	if (img = document.getElementById(this.imgId))
		img.src = this.srcOff;
}
function jbo_buttonDown() {
	if (img = document.getElementById(this.imgId))
		img.src = this.srcDown;
}

/////////////////////////////////////////////////
// Assigns the button state change function to
// the mouse events of element id
function jbo_assignToId(id) {
	var actionEle = document.getElementById(id);
	
	//First assign the source files as properties of the object whose mouse events we are changing.
	//We do because the event will trigger our subfunction below
	//Then 'this' will refer to the object whose mouse events we are altering.
	actionEle._jbo_buttonOnSrc = this.srcOn;
	actionEle._jbo_buttonOffSrc = this.srcOff;
	actionEle._jbo_buttonDownSrc = this.srcDown;
	actionEle._jbo_imgId = this.imgId;

	//get references to the functions already assigned to the element's mouse events
	var mouseOverPrev 	= actionEle.onmouseover;
	var mouseOutPrev	= actionEle.onmouseout;
	var mouseDownPrev	= actionEle.onmousedown;
	var mouseUpPrev		= actionEle.onmouseup;
	
	//assign the new methods
	actionEle.onmouseover = function () {	
		if (mouseOverPrev != null)
			mouseOverPrev();	
		document.getElementById(this._jbo_imgId).src = this._jbo_buttonOnSrc;
		
	}
	actionEle.onmouseout = function () {	
		if (mouseOutPrev != null)
			mouseOutPrev();	
		document.getElementById(this._jbo_imgId).src = this._jbo_buttonOffSrc;	
	}
	
	//only do these if the odwn state is enabled
	if (this._useButtonDown) {
		actionEle.onmousedown = function () {	
			if (mouseDownPrev != null)
				mouseDownPrev();	
			document.getElementById(this._jbo_imgId).src = this._jbo_buttonDownSrc;	
		}
		actionEle.onmouseup = function () {	
			if (mouseUpPrev != null)
				mouseUpPrev();	
			document.getElementById(this._jbo_imgId).src = this._jbo_buttonOnSrc;	
		}
	}
}