/* Preload button images */
var overLeft = new Image(94,23); overLeft.src = "./images/ek_button_left_over.gif";
var overRight = new Image(452,23); overRight.src = "./images/ek_button_right_over.gif";

var outLeft = new Image(95,23); outLeft.src = "./images/ek_button_left.gif";
var outRight = new Image(275,23); outRight.src = "./images/ek_button_right.gif";

var downLeft = new Image(96,23); downLeft.src = "./images/ek_button_left_pressed.gif";
var downRight = new Image(400,23); downRight.src = "./images/ek_button_right_pressed.gif";


function buttonOver(button){
	$(button).setStyle({
		backgroundImage: 'url('+overLeft.src+')'
	});
	
	$(button).down(0).setStyle({
		backgroundImage: 'url('+overRight.src+')'
	});
}

function buttonOut(button){
	$(button).setStyle({
		backgroundImage: 'url('+outLeft.src+')'
	});
	
	$(button).down(0).setStyle({
		backgroundImage: 'url('+outRight.src+')',
		lineHeight: '23px'
	});
}

function buttonDown(button){
	$(button).setStyle({
		backgroundImage: 'url('+downLeft.src+')'
	});
	
	$(button).down(0).setStyle({
		backgroundImage: 'url('+downRight.src+')',
		lineHeight: '24px'
	});
}


function showCharOptions(link, characteristic){
	var allLabels = $(link).up(2).childElements();
	
	/* Hide startmessage */
	if($('start_msg').visible()) {
		$('start_msg').hide();
	}
	
	allLabels.each(function(charlabel){
		charlabel.down(0).setStyle({
			backgroundImage: 'url(./images/ek_characteristic_bg.png)'
		});
		
		/* Hide layer */
		charlabel.down(1).next(0).setStyle({
			top: '-10000px'	
		});
		
	});
	
	$(link).up(0).setStyle({
		backgroundImage: 'url(./images/ek_characteristic_bg_active.png)'
	});
	
	/* Show options layer */
	Element.clonePosition($(link).next(0), $(link).up(3), {setWidth : false, offsetLeft: 124})
}