/* 
 * Created by Johan Nilsson <http://markupartist.com>, <http://johan.galaxen.net>
 *
 * Philip Howards formstyle.js <http://www.gamingheadlines.co.uk/wod/formstyle>
 * inpired me to do this work, so a big thanks goes to him. 
 *
 * This work is licensed by a Creative Commons License. 
 * <http://creativecommons.org/licenses/by-sa/2.0/>
 * 
 * ## Changelog
 * 0.2
 * Todd Tyree fixed bugs with multiple radiobutton groups.
 * 0.1
 * First release.
 */

window.onload = function() {
	styleCheckboxesAndRadiobuttons();
	//checkForLabels();
}

function styleCheckboxesAndRadiobuttons() {
	var elements = document.getElementsByTagName('input');
	for (i = 0; i < elements.length; i++) {
		if (elements[i].type == 'checkbox' || elements[i].type == 'radio') {	
			switch (elements[i].className) {
				// Add other cases here for other symbols. Just remember 
				// to change in your css too.
				// The case is the same as the class you use when calling on the
				// input.
				case 'radio':
					createAlternateCheckboxOrRadiobutton(elements[i], i);
				break;
				case 'checkbox':
					createAlternateCheckboxOrRadiobutton(elements[i], i);
				break;
			}
		}
	}
}

function createAlternateCheckboxOrRadiobutton(element, num) {
	var defaultClass = element.className + '-default';
	// Hide the original checkbox.
	element.style.display='none';
	// creates the new alternate checkbox
	var altElement = document.createElement('div');
	if (element.checked == true) {
		altElement.className = element.className;
		
		if (element.disabled == true) {
			altElement.className = altElement.className + '-disabled';
			}
		}
		else {
			altElement.className = defaultClass;
			
			if (element.disabled == true) {
				altElement.className = altElement.className + '-disabled';
				}
			}
	
	altElement.id = 'alt-' + element.id;
	element.parentNode.appendChild(altElement);

	// Handles onclick event.
	altElement.onclick = function(){
	if (element.disabled != true) {
		if (element.checked != true) {
			if (element.type == 'radio') {
			  handleOnClickForRadiobuttons(element.name);
			}
			altElement.className = element.className;
			element.checked = true
		} else {
			if (element.type == 'radio') {
				handleOnClickForRadiobuttons(element.name);
			}
			altElement.className = defaultClass;
			element.checked = false;
		}
	}
	}
}

function handleOnClickForRadiobuttons(name) {
	var radiobuttons = document.getElementsByName(name);
	for (i = 0; i < radiobuttons.length; i++) {
			if (radiobuttons[i].type == 'radio') {
			var altRadiobutton = document.getElementById('alt-' + radiobuttons[i].id);
			altRadiobutton.className = radiobuttons[i].className + '-default';
		}
	}
}

// FIXME: Needs more work here.
/*
function checkForLabels() {
	var labels = document.getElementsByTagName('label');
	for (i = 0; i < labels.length; i++) {
		labels[i].onclick = function(){
	    	var elements = document.getElementsByTagName('input');
			for (j = 0; j < elements.length; j++) {	
				if (elements[j].type == 'checkbox' || elements[j].type == 'radio') {
					var altElement = document.getElementById(
												'alt-' + elements[j].id);
					if (elements[j].checked == true) {
						alert(altElement.id);
						altElement.className = elements[j].className;
					} else {
						altElement.className = elements[j].className + '-default';
					}					
				}
			}		    
		}
	}	
}
*/