/**
 * Radio-buttons Image Replacing
 * v.0.9.2 (2007-01-10)
 * by ZeT, © Envisionext (www.envisionext.com)
 *
 * This script automatically replaces all radio-buttons on the page with defined images.
 * No need to any changes of html-code.
 *
 * Setup:
 * Just include this rbir.js, make new object myCbir and define images.
 * Example:
 <script type="text/javascript" src="rbir.js"></script>
 <script type="text/javascript">
   window.onload = function () {myRbir = new Rbir('radio_on.gif', 'radio_off.gif',  'radio_dis.gif');}
 </script>
 * where images: checked checkbox, unchecked checkbox, disabled checkbox.
 * (disabled is not required)
 */

function Rbir(img_checked_src, img_unchecked_src, img_disabled_src) {
	this.img_on = new Image();
	this.img_off = new Image();
	this.img_on.src = img_checked_src;
	this.img_off.src = img_unchecked_src;
	if (img_disabled_src) {
		this.img_dis = new Image();
		this.img_dis.src = img_disabled_src;
	}

	this.labels = document.getElementsByTagName('label');
	var inputs = document.getElementsByTagName('input');
	for (var i=0; i<inputs.length; i++) {
		if (inputs[i].getAttribute('type') == 'radio') {
			if (!inputs[i].getAttribute('id')) {
				inputs[i].setAttribute('id','radio_'+i);
			}
			this.init(inputs[i]);
		}
	}
}

Rbir.prototype.init = function(radio) {
	var img	= document.createElement('img');
	radio.parentNode.insertBefore(img, radio.nextSibling);
	img.className = 'radioImg';
	img.onclick = function() { var r = this.previousSibling; r.click(); myRbir.changeMe(r);}
	this.imgCheck(radio);
	this.lblCheck(radio);
	radio.style.position = 'absolute';
	radio.style.left = '-1000em';
}

Rbir.prototype.imgCheck = function(radio) {
	var img = radio.nextSibling;
	if (this.img_dis && radio.disabled) {
		img.src = this.img_dis.src;
	} else {
		if (radio.checked) {
			img.src = this.img_on.src;
		} else {
			img.src = this.img_off.src
		}
	}
}

Rbir.prototype.lblCheck = function(radio) {
	if (radio.disabled) return;
  var id = radio.getAttribute('id');

  var parent = radio.parentNode;
  if (parent.tagName.toLowerCase() == 'label') {
    if (navigator.appVersion.indexOf('MSIE 7.0')==-1) {
      radio.nextSibling.onclick = function() {};
    }
    parent.setAttribute('id', 'label_' + id);
    parent.onclick = function() {
			var id = this.getAttribute('id').replace('label_','');
			var r = document.getElementById(id);
			if (document.all && navigator.appVersion.indexOf('MSIE 7.0')==-1 && !window.opera) r.click(); // for IE<7
			myRbir.changeMe(r);
		}
    // return true;
  }
  for (var i=0; i<this.labels.length; i++) {
    lbl = this.labels[i];
    if (lbl.htmlFor == id) {
    	lbl.onclick = function() {
				var r = document.getElementById(this.htmlFor);
				r.click();
				myRbir.changeMe(r);
				return false;
			}
    }
  }
  return false;
}

Rbir.prototype.changeMe = function(radio) {
	var inputs = radio.form.getElementsByTagName('input');
	for (var i=0; i<inputs.length; i++) {
		if (inputs[i].getAttribute('type') == 'radio') {
			this.imgCheck(inputs[i]);
		}
	}
}
