function addImages() {
	buttonlist = $$('ul.button-list li');
	
	for(i=0;i < buttonlist.length;i++) {
		diagramIdentifier = buttonlist[i].parentNode.parentNode.parentNode.id;
		
		centerimagedefault = $$('#' + diagramIdentifier + ' div.center-image');
		centerimagedefault[0].setStyle({
			display: 'none'
		});
		centerimagedefault[0].setStyle({
			display: 'block'
		});
		
		buttonbg = $$('#' + diagramIdentifier + ' img.buttonbg');
		buttonbg = buttonbg[0].readAttribute('src');
		
		buttonlist[i].setStyle({
			backgroundImage: 'url('+ buttonbg + ')'
		});
	}
}

// run addImages as soon as the page is ready
Event.observe(window, 'load', addImages);

function changeCenterImage(image, button){
	diagramIdentifier = button.parentNode.parentNode.parentNode.parentNode.id;
	
	centerimage = $$('#' + diagramIdentifier + ' div.' + image);
	centerimage[0].setStyle({
			display: 'block'
	});
	
	centerimagedefault = $$('#' + diagramIdentifier + ' div.center-image');
	centerimagedefault[0].setStyle({
			display: 'none'
	});
}

function setDefaultImage(image, button){
	diagramIdentifier = button.parentNode.parentNode.parentNode.parentNode.id;
	
	centerimage = $$('#' + diagramIdentifier + ' div.' + image);
	centerimage[0].setStyle({
			display: 'none'
	});
	
	centerimagedefault = $$('#' + diagramIdentifier + ' div.center-image');
	centerimagedefault[0].setStyle({
			display: 'block'
	});
}