var inputs;
var imgFalse = 'images/false.gif';
var imgTrue = 'images/true.gif';
var imgChecked='images/checked.gif';
var imgUnChecked='images/unchecked.gif';
var checksReplaced = false;

//this function runs when the page is loaded, put all your other onload stuff in here too.
function checkReplaceInit() {
	replaceChecks();
}

function replaceChecks() {
	if(checksReplaced == false)
	{
		checksReplaced = true;
		//get all the input fields on the page
		inputs = document.getElementsByTagName('input');

		//cycle trough the input fields
		for(var i=0; i < inputs.length; i++) {
			//check if the input is a checkbox
			//if(inputs[i].getAttribute('type') == 'checkbox'||inputs[i].getAttribute('type') == 'radio') {
			if(inputs[i].getAttribute('type') == 'checkbox') { //||inputs[i].getAttribute('type') == 'radio') {
				//create a new image
				var img = document.createElement('img');
				
				if(inputs[i].getAttribute('type') == 'checkbox')
				{
					//check if the checkbox is checked
					if(inputs[i].checked) {
						img.src = imgTrue;
					} else {
						img.src = imgFalse;
					}
				} else {
					// NB: Therefore we must be on a radio button

					//check if the radio is checked
					if(inputs[i].checked) {
						img.src = imgChecked;
					} else {
						img.src = imgUnChecked;
					}
					
				}
			
				//set image ID and onclick action
				img.id = 'checkImage'+i;
				//set image 
				img.onclick = new Function('checkChange('+i+')');
				//place image in front of the checkbox
				inputs[i].parentNode.insertBefore(img, inputs[i]);
				
				//hide the checkbox
				inputs[i].style.display='none';
			}
		}
	}
}

//change the checkbox status and the replacement image
function checkChange(i) {
	if(inputs[i].checked) {
		inputs[i].checked = '';
		//document.getElementById('checkImage'+i).src=imgFalse||document.getElementById('checkImage'+i).src=imgUnckecked;
		if(inputs[i].getAttribute('type') == 'checkbox')
		{
			document.getElementById('checkImage'+i).src=imgFalse;
		} else {
			document.getElementById('checkImage'+i).src=imgUnChecked;
		}
	} else {
		inputs[i].checked = 'checked';
		//document.getElementById('checkImage'+i).src=imgTrue||document.getElementById('checkImage'+i).src=imgChecked;
		if(inputs[i].getAttribute('type') == 'checkbox')
		{
			document.getElementById('checkImage'+i).src=imgTrue;
		} else {
			document.getElementById('checkImage'+i).src=imgChecked;
		}
	}
	if(inputs[i].onclick)
		inputs[i].onclick();
}

window.onload = checkReplaceInit;