	/****************************************************************

		formLib 1.0 Beta
		
		@ Select
		@ Radiobuttons
		@ Checkboxes
		
		Do not edit this document!
		Use CSS to customise your form elements.
		
		TODO
		- Error select onChange
		
		DONE
		- Test multiple radiobuttons groups
		- Rewrite select system
		- selectbox change img into css
		- Put inline CSS into a external stylesheet
		- Add checkboxes
		- Rewrite imageId' s
		- Rewrite checkbox check function
		- Error Radiobuttons
		- Add UL id (select box)
		- Add DIV id (select box)
		
		More information: laupman@3fm.nl

	***************************************************************/

	var onSelectOption = false;
	var selObj;
	var radioId;
	var checkboxId;
	
	//Radio buttons
	function radioButtonReplacement(obj, nr)
	{
		this.obj=obj;
		this.nr=nr + 1;
		
		if(this.obj)
			this.setRadioButton();
	}
		radioButtonReplacement.prototype.setRadioButton = function()
		{
			var div = document.createElement('div');
			var img = document.createElement('div');
			var a = document.createElement('a');
			var imgClickObj = this.obj;
			var imgClickNr = this.nr;
			
			imgClickObj.parentNode.style.display = "none";
			
			div.className = "radioDiv";
			
			img.className = "radioUnChecked";
			img.setAttribute("id", "img_"+imgClickObj.getAttribute("name")+"_"+this.nr);
			img.onclick = function()
			{
				thisRadioButtonReplacement = new radioButtonReplacement;
				thisRadioButtonReplacement.checkRadioButton(imgClickObj.getAttribute("name"), imgClickNr);
			}
				
			var valueString = this.getNodeValue();
			
			a.setAttribute("href", "javascript:rBr=new radioButtonReplacement; rBr.checkRadioButton('"+this.obj.getAttribute("name")+"',"+this.nr+");");
			a.innerHTML = valueString;
			
			div.appendChild(img);
			div.appendChild(a);
			
			this.obj.parentNode.parentNode.insertBefore(div, this.obj.parentNode);
			this.obj.setAttribute("id", "radio_"+this.obj.getAttribute("name")+"_"+this.nr);
		}
		
		radioButtonReplacement.prototype.getNodeValue = function()
		{
			var newObj = this.obj;
			var valueString = "";
			while(newObj.nodeName != "BR")
			{
				if(newObj.nodeType == 3)
				{
					valueString += newObj.nodeValue;
				}
				newObj = newObj.nextSibling;
			}
			
			return valueString;
		}
		
		radioButtonReplacement.prototype.checkRadioButton = function(thisRadioId, nr)
		{
			i = document.getElementsByTagName('input');
			for (var j=0; j<i.length; j++)
			{
				if(i[j].getAttribute("id"))
				{
					if(i[j].getAttribute("id").indexOf(thisRadioId) != -1)
					{
						document.getElementById("img_"+thisRadioId+"_"+(j + 1)).className="radioUnChecked";
					}
				}
			}
			
			document.getElementById("radio_"+thisRadioId+"_"+nr).checked=true;	
			document.getElementById("img_"+thisRadioId+"_"+nr).className="radioChecked";
			radioId = "img_radio_"+nr;
		}
		

	//Checkboxes
	function checkBoxReplacement(obj, nr)
	{
		this.obj=obj;
		this.nr=nr + 1;
		
		if(this.obj)
			this.setCheckbox();
	}
	
		checkBoxReplacement.prototype.setCheckbox = function()
		{
			var div = document.createElement('div');
			var img = document.createElement('div');
			var a = document.createElement('a');
			var imgClickObj = this.obj;
			var imgClickNr = this.nr;
			
			imgClickObj.parentNode.style.display = "none";
			
			div.className = "checkBoxDiv";
			
			img.className = "checkBoxUnChecked";
			img.setAttribute("id", "img_checkbox_"+this.nr);
			img.onclick = function()
			{
				thisRadioButtonReplacement = new checkBoxReplacement;
				thisRadioButtonReplacement.checkCheckboxButton(imgClickObj.getAttribute("name"), imgClickNr);
			}
				
			var valueString = this.getNodeValue();
			
			a.setAttribute("href", "javascript:cBr=new checkBoxReplacement; cBr.checkCheckboxButton('"+this.obj.getAttribute("name")+"',"+this.nr+");");
			a.innerHTML = valueString;
			
			div.appendChild(img);
			div.appendChild(a);
			
			this.obj.parentNode.parentNode.insertBefore(div, this.obj.parentNode);
			this.obj.setAttribute("id", "checkbox_"+this.obj.getAttribute("name")+"_"+this.nr);
		}
		
		checkBoxReplacement.prototype.getNodeValue = function()
		{
			var newObj = this.obj;
			var valueString = "";
			while(newObj.nodeName != "BR")
			{
				if(newObj.nodeType == 3)
				{
					valueString += newObj.nodeValue;
				}
				newObj = newObj.nextSibling;
			}
			
			return valueString;
		}
		
		checkBoxReplacement.prototype.checkCheckboxButton = function(checkboxId, nr)
		{
			i = document.getElementsByTagName('input');
			if(!document.getElementById("checkbox_"+checkboxId+"_"+nr).checked)
			{
				document.getElementById("checkbox_"+checkboxId+"_"+nr).checked=true;
				document.getElementById("img_checkbox_"+nr).className="checkBoxChecked";
			}
			else
			{
				document.getElementById("checkbox_"+checkboxId+"_"+nr).checked=false;
				document.getElementById("img_checkbox_"+nr).className="checkBoxUnChecked";
			}
		}
	
	

	//Select boxes
	function selectBoxReplacement(obj, nr) 
	{
		this.obj = obj;
		this.nr = nr;
		this.functionArray;
		
		if(obj)
			this.setSelectBox();
	}
		selectBoxReplacement.prototype.setSelectBox= function()
		{
			this.obj.id = "select_" + this.nr;
			this.changeSelectBox(this.obj);
			
			var container = document.createElement('div');
			var ul = document.createElement('ul');
			var div = document.createElement('div');
		
			container.className = "selectContainerAll selectContainer_"+this.nr;
			
			ul.id = 'ulId_' +  this.nr;
			ul.className = 'selectCombo selectId_' +  this.nr;
			ul.onmouseover = function(){ onSelectOption=true;	}
			ul.onmouseout = function(){ onSelectOption=false; }
			
			div.id = 'textBoxDivId_' +  this.nr;
			div.className = 'selectCombo selectId_' + this.nr;
			div.onclick = function() { ul.style.display = "block"; selObj = ul; }
			
			this.selectBoxOptions(this.obj, ul, div);
			
			newContainer = this.obj.parentNode.insertBefore(container,this.obj);
			newContainer.appendChild(div);
			newContainer.appendChild(ul);
		}
		
		selectBoxReplacement.prototype.changeSelectBox = function(obj)	
		{
			if(obj.onchange)
			{	
				var functionString = this.obj.getAttribute("onchange") + "";
				if(functionString.indexOf("{") != -1)
				{	
					functionString = functionString.substring(functionString.indexOf("{")+2);
					functionString = functionString.substring(0, functionString.indexOf("}")-1);
				}
				
				this.functionArray = functionString.split(";"); 
				for(var i=0; i<this.functionArray.length; i++)
				{
					if(this.functionArray[i])
					{
						stripFunction = this.functionArray[i] + "";
						stripFunction = stripFunction.substring(stripFunction.indexOf("(")+2);
						stripFunction = stripFunction.substring(0, stripFunction.indexOf(")")-1);
						this.functionArray[i] = stripFunction;
					}
				}
			}	
		}
		
		selectBoxReplacement.prototype.selectBoxOptions = function(obj, ul, div)
		{
			var liFunctionArray = this.functionArray;
			var selectedOpt = this.obj.selectedIndex;
			var opts = this.obj.options;
			
			if(opts.length < 10)
				ul.style.height = (opts.length*15) + "px";
			
			for (var i=0; i<opts.length; i++)
			{
				var li = document.createElement('li');
				var txt = document.createTextNode(opts[i].text);
				var liClickObj = this.obj;

				li.appendChild(txt);
				li.onmouseover = function(){ if(this.className == "selected") this.className+=" optionOver"; else this.className="optionOver"; }
				li.onmouseout = function(){ if(this.className.indexOf("selected") == -1) this.className="optionOut"; else this.className="selected"; }
				li.onclick = function(){ sBr=new selectBoxReplacement; sBr.selectMe(this, div, liClickObj.id, liFunctionArray); }
				
				if (i == selectedOpt) 
				{
					div.innerHTML="<div class=\"selectArrow\"></div>" + opts[i].text;
					li.className = 'selected';
				}

				ul.appendChild(li);
			}
		}
	
		selectBoxReplacement.prototype.selectMe = function(obj, div, selectObjId, functionArray)
		{
			if(div)
				div.innerHTML="<div class=\"selectArrow\"></div>" + obj.innerHTML;
			
			var lis = obj.parentNode.getElementsByTagName('li');
			obj.parentNode.style.display = "none";
			
			for (var i=0; i<lis.length; i++)
				if (lis[i] != obj)
				{
					lis[i].className='optionOut';
					selObj = "";
				}
				else if(selectObjId)
				{
					document.getElementById(selectObjId).options[i].selected = true;
					obj.className='selected';

					if(functionArray)
						location.href = functionArray[0]+"/"+document.getElementById(selectObjId).options[i].value;
				}
		}


	//Mouse down event function
	document.onmousedown = function()
	{
		if(!onSelectOption && selObj)
			selObj.style.display = "none";
	}
	
	
	//Init function
	function initFormElements() 
	{
		i = document.getElementsByTagName('input');
		for (var j=0; j<i.length; j++)
			switch(i[j].getAttribute("type"))
			{			
				case "radio":
					new radioButtonReplacement(i[j], j);
				break;
				case "checkbox":
					new checkBoxReplacement(i[j], j);
				break;
				default: ;
			}

		s = document.getElementsByTagName('select');
		for (var j=0; j<s.length; j++) 
			new selectBoxReplacement(s[j], j);
	}
	
	setTimeout("initFormElements()", 500);
