rightArrow_over       = new Image();
rightArrow_over.src   = "images/rightArrow_over.png" ;

rightArrow_out       = new Image();
rightArrow_out.src   = "images/rightArrow_out.png" ;


function ActionButton ( buttonName, imageOut, imageOver, imageDown ) {
	this.name = buttonName;
 	this.imageOut = new Image();
 	this.imageOut.src = imageOut;
 	this.imageOver = new Image();
 	this.imageOver.src = imageOver;
 	this.imageDown = new Image();
 	this.imageDown.src = imageDown;

	this.hello = function () {
		var message = "the name of button clidked " + this.name;
		//var message = eval( "hello, this is a test " + this.name );
		alert( message );
	};
	
 	
    this.out = function(){
    	document[ this.name ].src = this.imageOut.src;
    };
    
    this.over = function(){
    	document[ this.name ].src = this.imageOver.src;
    };

    this.down = function(){
    	document[ this.name ].src = this.imageDown.src;
    };

    this.up = function(){
    	document[ this.name ].src = this.imageOver.src;
    };
 }

// // In these cases the buttom name is used and then the image that is used is each case is named with the buttom name followed by underscore and the action
// // buttonName_over
// 
// // rollover functions
// //: ===================================================================================== ://
// function buttonOver( buttonname )
// {
// 	// alert( 'got called');
//    document[ buttonname ].src = eval( buttonname + "_over.src" );
// }
// 
// //: ===================================================================================== ://
// function buttonOut ( buttonname )
// {
//    document[ buttonname ].src = eval( buttonname + "_out.src" );
// }
// 
// //: ===================================================================================== ://
// function buttonDown ( buttonname )
// {
//    document[ buttonname ].src = eval( buttonname + "_down.src" );
// }