function init() 
{
	var inputs = document.getElementsByTagName("input"), span = Array(), option, active, inputCount;
	var checkBoxes = Array();
	var selects = Array();
	inputCount = inputs.length;
	var index = 0;
	for(a = 0; a < inputs.length; a++) 
	{
		if((inputs[a].type == "checkbox" || inputs[a].type == "radio") && inputs[a].className == "styled") 
		{
			checkBoxes[index] = inputs[a];
			index++;
		}
	}

	for(a = 0; a < checkBoxes.length; a++) 
	{
			var hiddenElement = checkBoxes[a];
			var visualElemFound = false;
			var visualElem = findVEforHE(hiddenElement);
			if (visualElem != null)
			{
				visualElemFound = true;
			}
			else
			{
				visualElem = document.createElement("input");
				visualElem.type = "button";
			}
			
			visualElem.className = "styled-"+hiddenElement.type;
			if(hiddenElement.checked == true) 
			{
				visualElem.className += "-on";
			} 
			else 
			{
				visualElem.className += "-off";
			}
				
			visualElem.onclick = clicked;
			
			if (!visualElemFound)
			{
				hiddenElement.parentNode.insertBefore(visualElem, hiddenElement);
			}
	}

/*	
	index = 0;
	inputs = document.getElementsByTagName("select");
	for(a = 0; a < inputs.length; a++) 
	{
		if(inputs[a].className == "styled") 
		{
			selects[index] = inputs[a];
			index++;
		}
	}
	for(a = 0; a < selects.length; a++) 
	{
			var hiddenElement = selects[a];
				var text = document.createTextNode("sdsd");
				var visElem = document.createElement("div");
				visElem.className = "styled-"+hiddenElement.type;
				visElem.id = hiddenElement.name+"-visElem";
				var visTextElem = document.createElement("div");
				visTextElem.id = hiddenElement.name+"-visTextElem";
				visTextElem.appendChild(text);
				visElem.appendChild(visTextElem);
				
				hiddenElement.parentNode.insertBefore(visElem, hiddenElement);
				hiddenElement.style.left = getLeft(visElem)+"px";
				hiddenElement.style.top = getTop(visElem)+"px";
				visElem.style.width = (hiddenElement.offsetWidth-10)+"px";
				visElem.style.height = (hiddenElement.offsetHeight-6)+"px";
				hiddenElement.onchange = choose;
				hiddenElement.onKeyUp = choose;
			


	}
*/
	
};

function getTop( oElement )
{
	var iReturnValue = 0;
	while( oElement != null ) 
	{
		iReturnValue += oElement.offsetTop;
		oElement = oElement.offsetParent;
	}
	return iReturnValue;
};

function getLeft( oElement )
{
	var iReturnValue = 0;
	while( oElement != null ) 
	{
		iReturnValue += oElement.offsetLeft;
		oElement = oElement.offsetParent;
	}
	return iReturnValue;
};

function choose() 
{
	visTextElem = $(this.name+"-visTextElem");
//	alert(this.value);
	visTextElem.textContent = this.value;
	
};


function clicked() 
{
	hiddenElement = findHEforVE(this);
	hiddenElement.checked = !hiddenElement.checked;
	if (hiddenElement.type == "radio")
	{
		var groupedRadios = document.getElementsByName(hiddenElement.name);
		for(d = 0; d < groupedRadios.length; d++)
		{
			if(groupedRadios[d].type == "radio" && groupedRadios[d].className == "styled") 
			{
				refreshVE(findVEforHE(groupedRadios[d]));
			}
		}
		
	}
	else
	{
		refreshVE(this);
	}
	var onClickFunction = hiddenElement.onclick;
	if (onClickFunction != undefined)
	{
		onClickFunction.call();
	}
	
};

function refreshVE(visualElement)
{
	var hiddenElement = findHEforVE(visualElement);
	
	if(hiddenElement.checked == true) 
	{
		visualElement.className = "styled-"+hiddenElement.type+"-on";
	} 
	else 
	{
		visualElement.className = "styled-"+hiddenElement.type+"-off";
	}
	hiddenElement = hiddenElement;
};


function say(message) 
{
  alert(this.name + ": " + message);
};


function findVEforHE(hiddenElement) 
{
	var element = hiddenElement;
	for (c = 0; c < 2; c++)
	{
		element = element.previousSibling;
		if (element != null)
		{
			if (element.nodeName == "INPUT")
			{
				if (element.type == "button")
				{
					if (element.className == "styled-"+hiddenElement.type+"-off" 
							|| element.className == "styled-"+hiddenElement.type+"-on")
					{
						return element;
					}
				}
			}
		}
		else
		{
			break;
		}
		
	}
	return null;
};

function findHEforVE(visualElement) 
{
	var element = visualElement;
	for (b = 0; b < 2; b++)
	{
		element = element.nextSibling;
		if (element != null)
		{
			if (element.nodeName == "INPUT")
			{
				if((element.type == "checkbox" || element.type == "radio" || element.type == "select" ) && element.className == "styled") 
				{
					return element;
				}
			}
		}
		else
		{
			break;
		}
	}
	return null;
};

window.onload = init;