var z7CheckRadioDefaults = {};
var z7CheckRadioOrigIDs = {};

function z7CheckRadio(defaults) {

	z7CheckRadioDefaults = defaults;

	// find all inputs
	var inputs = document.getElementsByTagName('input');
	
	// do some action for each input, if its type is checkbox or radio
	for(i=0, n=inputs.length; i<n; i++) {
	
		if(inputs[i].type == 'checkbox' || inputs[i].type == 'radio') {

			// copy select box and manipulate some attributes
			var original = inputs[i].cloneNode(true);
			original.style.position = 'absolute';
			original.style.left = '-10000px';
			original.id = original.id ? original.id : 'z7CheckRadioOrig'+i;
			z7CheckRadioOrigIDs[i] = original.id;
			
			// create the fake container
			var fakeParent = document.createElement('span');

			// create the fake image
			var fakeText = document.createElement('img');
			fakeText.id = 'z7CheckRadioFake'+i;
			fakeText.className = 'z7CheckRadioFake';
			fakeText.src = z7CheckRadioImage(inputs[i]);
			with ({'i': i}) {
				fakeText.onclick = function() { z7CheckRadioClick(i); };
			}
			if(typeof(original.onchange) == 'function') {
				if (fakeText.addEventListener) {
					fakeText.addEventListener('click', original.onchange, true);
				}
				else if(inputs[i].attachEvent) {
					fakeText.attachEvent('onclick', function() { try { window.setTimeout(original.onchange, 100); } catch(e) {} });
				}
			}
			fakeParent.appendChild(fakeText);
		
			// paste original into container
			fakeParent.appendChild(original);

			// replace original
			inputs[i].parentNode.replaceChild(fakeParent, inputs[i]);

			// give the original element an onchange listener
			if (inputs[i].addEventListener) {
				with ({'i': i}) {
					inputs[i].addEventListener('change', function() { z7CheckRadioChange(i); }, true);
					inputs[i].addEventListener('click', function() { z7CheckRadioChange(i); }, true);
				}
			}
			else if(inputs[i].attachEvent) {
				with ({'i': i}) {
					inputs[i].attachEvent('onchange', function() { z7CheckRadioChange(i); });
					inputs[i].attachEvent('onclick', function() { z7CheckRadioChange(i); });
				}
			}
		}
	}
}


// when the status of an element has changed
function z7CheckRadioChange(i) {
	var original = document.getElementById(z7CheckRadioOrigIDs[i]);

	// when a checkbox changed, it's easy ...
	if(original.type == 'checkbox') {
		document.getElementById('z7CheckRadioFake'+i).src = z7CheckRadioImage(original);
	}
	
	// ... when a radiobutton changed, we have to repair all elements with the same name
	if(original.type == 'radio') {
	
		inputs = document.getElementsByTagName('input');
		for(j=0, n=inputs.length; j<n; j++) {
			if(document.getElementById(z7CheckRadioOrigIDs[j]) && original.name == document.getElementById(z7CheckRadioOrigIDs[j]).name) {
				document.getElementById('z7CheckRadioFake'+j).src = z7CheckRadioImage(document.getElementById(z7CheckRadioOrigIDs[j]));
			}
		}
	}
}

// user clicks the fake element - we change the status of original element
function z7CheckRadioClick(i) {
	// invert cheched status
	document.getElementById(z7CheckRadioOrigIDs[i]).checked = (document.getElementById(z7CheckRadioOrigIDs[i]).type=='radio' || !document.getElementById(z7CheckRadioOrigIDs[i]).checked);
	// call function to bring changes to display
	z7CheckRadioChange(i);
}


function z7CheckRadioImage(element) {
	
	if(element.type == 'radio' && element.checked) {
		return z7CheckRadioDefaults.radioon;
	}
	else if(element.type == 'radio') {
		return z7CheckRadioDefaults.radiooff;
	}
	else if(element.type == 'checkbox' && element.checked) {
		return z7CheckRadioDefaults.checkboxon;
	}
	else if(element.type == 'checkbox') {
		return z7CheckRadioDefaults.checkboxoff;
	}

}