//global variables that can be used by all the functions on this page.
var selects;
var inputs;
var radios = new Array();
var checkboxes = new Array();
var hovers = new Array();
var buttons = new Array();
var files = new Array();
var selectText = "please select";

//this function runs when the page is loaded so put all your other onload stuff in here too.
function  forms_init() {
	var browserName=navigator.appName;
	//check if styles are enabled and only then start replacing elements
	//if(findPosX(document.getElementById('stylesheetTest')) == -999) {
		replaceSelects();
		//if (browserName=="Microsoft Internet Explorer"){
			replaceRadios();
			replaceCheckboxes();
		
		//}
	//}
	//alert(hghghg);
	//hoverEffects();
	//buttonHovers();
}


function forms_reload(){
	//get all the select fields on the page
    var selects = document.getElementsByTagName('select');

	for(var i=0; i <radios.length; i++) {
		var x = findPosX( radios[i] );
		var y = findPosY( radios[i] );

		input_div = document.getElementById("myRadio"+ i );
		if ( ( x <= 0 ) || ( y <= 0 ) ) {
			input_div.style.left = -100 + 'px';
			input_div.style.top = -100 + 'px';

		}
		else {
			input_div.style.left = x + 'px';
			input_div.style.top = y + 'px';
		}
	}
	for(var i=0; i <checkboxes.length; i++) {
		var x = findPosX( checkboxes[i] );
		var y = findPosY( checkboxes[i] );

		input_div = document.getElementById("myCheck"+ i );
		if ( ( x <= 0 ) || ( y <= 0 ) ) {
			input_div.style.left = -100 + 'px';
			input_div.style.top = -100 + 'px';

		}
		else {
			input_div.style.left = x + 'px';
			input_div.style.top = y + 'px';
		}
	}

	
	//cycle trough the select fields
    for(var i=0; i < selects.length; i++) {
		var x = findPosX( document.getElementById( "selectArea" + i ) );
		var y = findPosY( document.getElementById( "selectArea" + i ) );

		//while(input_div = document.getElementById("optionsDiv"+ selects[i].id )) {
		var input_div = document.getElementById( "optionsDiv" + i );
			input_div.style.left = x + 'px';
			input_div.style.top = y + 19 + 'px';
		//}
	}

}
function replaceRadios() {
	//get all the radio buttons on the page
	var inputs = document.getElementsByTagName('input');
	var j = 0;
	for(var i=0; i < inputs.length; i++) {
		if(inputs[i].type=='radio') {
			radios[j] = inputs[i];
			++j;
		}
	}
	
	//cycle through the radio inputs
	for(var i=0; i <radios.length; i++) {
		
		//make them transparent
		radios[i].className = "transparent";

		//get their position
		var x = findPosX(radios[i]);
		var y = findPosY(radios[i]);

		//build new div
		var radioArea = document.createElement('div');

		if(radios[i].checked) {
			radios[i].nextSibling.className = "chosen"; 
			radioArea.className = "radioAreaChecked";
		}
		else if(!radios[i].checked) {
			radioArea.className = "radioAreaUnchecked";
		}
		radioArea.style.left = x + 'px';
		radioArea.style.top = y + 'px';
		radioArea.id = "myRadio" + i;

		if(document.addEventListener)	{
			//these are for Mozilla
			eval("radioArea.addEventListener('click', function (e) { e.stopPropagation(); checkRadio("+i+"); }, true)");
			document.addEventListener('click', function (e) { checkRadio(i);}, false);
		}
		else if(document.attachEvent){
			//these are for IE
			eval("radioArea.attachEvent('onclick', function (e) { if (!e) var e = window.event; e.cancelBubble = true;  checkRadio("+i+"); } )");
			document.attachEvent('onclick', function (e) { checkRadio(i);});
		}

		document.getElementsByTagName("body")[0].appendChild(radioArea);
	}
}

function replaceCheckboxes() {
	//get all the checkboxes on the page
	var inputs = document.getElementsByTagName('input');
	var j = 0;
	for (var i2=0; i2 < inputs.length; i2++) {
		if(inputs[i2].type=='checkbox') {
			checkboxes[j] = inputs[i2];
			++j;
		}
	}

	//cycle through the checkboxes
	for(var i2=0; i2 < checkboxes.length; i2++) {

		//make them transparent
		checkboxes[i2].className = "transparent";

		//get their position
		var x = findPosX(checkboxes[i2]);
		var y = findPosY(checkboxes[i2]);

		//build new div
		var checkboxArea = document.createElement('div');

		if(checkboxes[i2].checked) {
			checkboxes[i2].nextSibling.className = "chosen"; 
			checkboxArea.className = "checkboxAreaChecked";
		}
		else if(!checkboxes[i2].checked) {
			checkboxArea.className = "checkboxAreaUnchecked";
		}
		checkboxArea.style.left = x + 'px';
		checkboxArea.style.top = y + 'px';
		checkboxArea.id = "myCheck" + i2;

		if(document.addEventListener)	{
			//these are for Mozilla
			eval("checkboxArea.addEventListener('click', function (e) { e.stopPropagation(); checkCheckt("+i2+"); }, true)");
			document.addEventListener('click', function (e) { checkCheck(i2);}, false);
		}
		else if(document.attachEvent){
			//these are for IE
			eval("checkboxArea.attachEvent('onclick', function (e) { if (!e) var e = window.event; e.cancelBubble = true;  checkCheckt("+i2+"); } )");
			document.attachEvent('onclick', function (e) { checkCheck(i2);});
		}


		checkboxes[i2].onclick = new Function('checkCheck('+i2+')');
		document.getElementsByTagName("body")[0].appendChild(checkboxArea);
	}
}

function replaceSelects() {
	//get all the select fields on the page
    selects = document.getElementsByTagName('select');
	
	//cycle trough the select fields
    for(var i=0; i < selects.length; i++) {
		
		//create and build div structure
		var selectArea = document.createElement('div');
		var left = document.createElement('div');
		var right = document.createElement('div');
		var center = document.createElement('div');
		var button = document.createElement('a');
		var text = document.createTextNode(selects[i].options[selects[i].selectedIndex].value);

		var x = findPosX(selects[i]);
		var y = findPosY(selects[i]);
		center.id = "SelectText"+i;
		//button.href="javascript:showOptions('"+"div_" + selects[i].id +"')";
		//selectArea.onclick ="javascript:showOptions('"+"div_" + selects[i].id +"')";

		if( selects[i].className == "" )
			selectArea.className = "selectArea";
		else
			selectArea.className = selects[i].className;
		
		selectArea.style.left = x + 'px';
		selectArea.style.top = y + 'px';
		selectArea.id = "selectArea" + i; 

		left.className = "left";
		right.className = "right";
		center.className = "center";
		right.appendChild(button);
		//center.appendChild(text);
		selectArea.appendChild(left);
		selectArea.appendChild(right);
	
		if(document.addEventListener) {
			//these are for Mozilla
			eval("selectArea.addEventListener('click', function (e) { e.stopPropagation(); if(isAnyOptionVisible() != "+i+" && isAnyOptionVisible() >= 0) { showOptions(isAnyOptionVisible());} showOptions("+i+"); }, true)");
			document.addEventListener('click', function (e) { showOptions(isAnyOptionVisible());}, false);
		}
		else if(document.attachEvent) {
			//these are for IE
			eval("selectArea.attachEvent('onclick', function (e) { if (!e) var e = window.event; e.cancelBubble = true; if(isAnyOptionVisible() != "+i+" && isAnyOptionVisible() >= 0) { showOptions(isAnyOptionVisible());} showOptions("+i+"); } )");
			document.attachEvent('onclick', function (e) { showOptions(isAnyOptionVisible());});
		}

		//hide the select field
        selects[i].style.display='none'; 
		
		//insert select div
		selects[i].parentNode.appendChild(selectArea);
		
		//build & place options div
		var optionsDiv = document.createElement('div');
		
		if( selects[i].className == "" )
			optionsDiv.className = "optionsDivInvisible";
		else
			optionsDiv.className = selects[i].className + "OptionsInvisible";

		optionsDiv.id = "optionsDiv"+i;
		optionsDiv.style.left = findPosX(selectArea) + 'px';
		optionsDiv.style.top = findPosY(selectArea) + 19 + 'px';
		
		//get select's options and add to options div
		for(var j=0; j < selects[i].options.length; j++) {
			var optionHolder = document.createElement('p');
			var optionLink = document.createElement('a');
			var optionTxt = document.createTextNode(selects[i].options[j].text);
			
			if( selects[i].options[j].selected != "" )
				text = document.createTextNode(selects[i].options[j].text);

			optionLink.href = "javascript:select('"+selects[i].id+"',"+j+","+i+");";
			optionLink.appendChild(optionTxt);
			optionHolder.appendChild(optionLink);
			optionsDiv.appendChild(optionHolder);
		}
		
		center.appendChild(text);
		selectArea.appendChild(center);

		//insert options div
		document.getElementsByTagName("body")[0].appendChild(optionsDiv);
	}
}

function isAnyOptionVisible() {
	var g=0;
	
	while(elem = document.getElementById("optionsDiv"+g)){
		if(elem.className=="optionsDivVisible")
			return g;
		g++;
	}
	
	return -1;
}

function showOptions(g) {
		elem = document.getElementById("optionsDiv"+g);
		if(!elem)
		{
			return;
		}
		
		if(elem.className=="optionsDivInvisible") {elem.className = "optionsDivVisible";}
		else if(elem.className=="optionsDivVisible") {elem.className = "optionsDivInvisible";}
}

function select(selectFieldId,linkNo,selectNo) {
	//feed selected option to the actual select field
	selectField = document.getElementById(selectFieldId);
	for(var k = 0; k < selectField.options.length; k++) {
		if(k==linkNo) {
			selectField.options[k].selected = "selected";
		}
		else {
			selectField.options[k].selected = "";
		}
	}
	//show selected option
	textVar = document.getElementById("SelectText"+selectNo);
	var newText = document.createTextNode(selectField.options[linkNo].text);
	textVar.replaceChild(newText, textVar.childNodes[0]);
}

function findPosY(obj) {
	var posTop = 0;
	while (obj.offsetParent) {
		posTop += obj.offsetTop;
		obj = obj.offsetParent;
	}
	return posTop;
}
function findPosX(obj) {
	var posLeft = 0;
	while (obj.offsetParent) {
		posLeft += obj.offsetLeft;
		obj = obj.offsetParent;
	}
	return posLeft;
}
function findPosX1(obj) {
	var posLeft = 0;
	while (obj.offsetParent) {
		posLeft += obj.offsetRight;
		obj = obj.offsetParent;
	}
	return posLeft;
}
function checkRadio( g ) {
	elem = document.getElementById("myRadio"+g);
	if( !elem ) {
		return;
	}
	if ( radios[g].disabled ){
		return;
	}
	for ( var k = 0; k < radios.length; k++ ) {
		if( ( k == g ) && ( !radios[k].checked ) ) {
			radios[g].checked = true;
			document.getElementById( 'myRadio' + k ).className = "radioAreaChecked";
			//radios[g].nextSibling.className = "chosen";
		}
		else {
			radios[k].checked = false;
			document.getElementById( 'myRadio' + k ).className = "radioAreaUnchecked";
			//radios[k].nextSibling.className = "";
		}
	}
}

function checkCheck(g) {
	elem = document.getElementById("myCheck"+g);
	if( !elem ) {
		return;
	}

	if ( checkboxes[g].disabled ){
		return;
	}

	if(checkboxes[g].checked) {
		for(var k = 0; k < checkboxes.length; k++) {
			if(k == g) {
				document.getElementById('myCheck'+k).className = "checkboxAreaUnchecked";
				checkboxes[g].nextSibling.className = "";
			}
		}
	}
	else if(!checkboxes[g].checked) {
		document.getElementById('myCheck'+g).className = "checkboxAreaChecked";
		checkboxes[g].nextSibling.className = "chosen";
	}
}
function checkCheckt(g) {
	elem = document.getElementById("myCheck"+g);
	if( !elem ) {
		return;
	}

	if ( checkboxes[g].disabled ){
		return;
	}

	if(checkboxes[g].checked  ) {
		checkboxes[g].checked = false;
		document.getElementById('myCheck'+g).className = "checkboxAreaUnchecked";
		checkboxes[g].nextSibling.className = "";

	}
	else if(!checkboxes[g].checked && ( checkboxes[g].disabled!="disabled" ) ) {
		checkboxes[g].checked = true;
		document.getElementById('myCheck'+g).className = "checkboxAreaChecked";
		checkboxes[g].nextSibling.className = "chosen";
	}
}

function hoverEffects() {
	//get all elements (text inputs, passwords inputs, textareas)
	var elements = document.getElementsByTagName('input');
	var j = 0;
	for (var i4 = 0; i4 < elements.length; i4++) {
		if((elements[i4].type=='text')||(elements[i4].type=='password')) {
			hovers[j] = elements[i4];
			++j;
		}
	}
	elements = document.getElementsByTagName('textarea');
	for (var i4 = 0; i4 < elements.length; i4++) {
		hovers[j] = elements[i4];
		++j;
	}
	
	//add focus effects
	for (var i4 = 0; i4 < hovers.length; i4++) {
		hovers[i4].onfocus = function() {this.className += "Hovered";}
		hovers[i4].onblur = function() {this.className = this.className.replace(/Hovered/g, "");}
	}
}

function buttonHovers() {
	//get all buttons
	var elements = document.getElementsByTagName('input');
	var j = 0;
	for (var i5 = 0; i5 < elements.length; i5++) {
		if(elements[i5].type=='submit') {
			buttons[j] = elements[i5];
			++j;
		}
	}
	
	//add hover effects
	for (var i5 = 0; i5 < buttons.length; i5++) {
		buttons[i5].onmouseover = function() {this.className += "Hovered";}
		buttons[i5].onmouseout = function() {this.className = this.className.replace(/Hovered/g, "");}
	}
}



// DOM2
if ( typeof window.addEventListener != "undefined" )
	window.addEventListener( "load", forms_init, false );
// IE
else if ( typeof window.attachEvent != "undefined" )
	window.attachEvent( "onload", forms_init );
else {
	if ( window.onload != null ) {
		var oldOnload = window.onload;
		window.onload = function ( e ) {
			 oldOnload( e );
			 forms_init();
		};
	}
	else
		window.onload = forms_init;
}