/* *******************************************************************
** SI.JS - Swappable Images
** ========================================
** This library contains a constructor an associated methods for
** handling swappable Images like buttons that change appearance
** based on events.
**
** The main page needs to include this library in the head.  Then,
** the main page creates img objects using the HTML tag <img> and
** incorporates calls to the Roll, PopUp, and Depress (and, in the 
** case of a Swappable Image Plus Object, Dim and UnDim) methods for 
** appropriate events.
**
** At the end of the main page, the programmer then constructs the
** swappable image objects, passing the already-created imgs as 
** parameters.
**
** Author      Ver  Date    Comments
** ======      ===  ====    ========
** Paul Wieser  1.0  2/27/00  First release
**
******************************************************************* */






// this is the constructor for the swappable image objects.
// it is passed the urls for the three button states, a name,
// and an already-created (in HTML) image object.
function SI(upUrl,overUrl,downUrl,img) {
	//alert('the img name is '+img.name);
	var up = 0; // these are constants to make code easier to read
	var over = 1;
	var down = 2;
	this.currState = up;
	this.states = new Array(); // this array holds the three Images
	this.states[up] = new Image();
	this.states[up].src = upUrl;
	this.states[over] = new Image();
	this.states[over].src = overUrl;
	this.states[down] = new Image();
	this.states[down].src = downUrl;
	this.Imagesoul = img; // this is reference to html-created image
	this.Imagesoul.src = upUrl;
	// this is a method of the SI object that does the change to
	// the over state
	this.Roll = function(){ 
		this.Imagesoul.src = this.states[over].src;
		this.currState = over;
	}
	// this one does the change to up
	this.PopUp = function(){ 
		this.Imagesoul.src = this.states[up].src;
		this.currState = up;
	}
	// this one does the depress
	this.Depress = function(){ 
		this.Imagesoul.src = this.states[down].src;
		this.currState = down;
	}
	//alert("SI object constructed: "+ this.name);

}

function SIPlus(upUrl, overUrl, downUrl, dimUrl,img){
	var up = 0; // these are constants to make code easier to read
	var over = 1;
	var down = 2;
	var dim = 3;
	this.currState = up;
	this.states = new Array(); // this array holds the four Images
	this.states[up] = new Image();
	this.states[up].src = upUrl;
	this.states[over] = new Image();
	this.states[over].src = overUrl;
	this.states[down] = new Image();
	this.states[down].src = downUrl;
	this.states[dim] = new Image();
	this.states[dim].src = dimUrl;
	this.Imagesoul = img; // this is reference to html-created image
	this.Imagesoul.src = upUrl;
	// this is a method of the SI object that does the change to
	// the over state
	this.Roll = function(){
		//alert("currState = "+this.currState); 
		if (!this.isDim()){
			this.Imagesoul.src = this.states[over].src;
			this.currState = over;
		}
	}
	// this one does the change to up
	this.PopUp = function(){ 
		if (!this.isDim()){
			this.Imagesoul.src = this.states[up].src;
			this.currState = up;
		}
	}
	// this one does the depress
	this.Depress = function(){ 
		if (!this.isDim()){
			this.Imagesoul.src = this.states[down].src;
			this.currState = down;
		}
	}
	// this one dims the button
	this.Dim = function(){
		this.Imagesoul.src = this.states[dim].src;
		this.currState = dim;
	}
	// this one "undims" the button by setting it to the up state
	this.UnDim = function(){
		this.Imagesoul.src = this.states[up].src;
		this.currState = up;
	}
	// this one returns true if the image is dimmed
	this.isDim = function(){
		var t = false;
		if (this.currState == dim) t = true;
		//alert("button dimmed = "+t);
		return t;
	}
	//alert("SI object constructed: "+ this.name);
}


