/*

CUSTOM FORM ELEMENTS

Created by Ryan Fait
www.ryanfait.com

The only things you may need to change in this file are the following
variables: checkboxHeight, radioHeight and selectWidth (lines 24, 25, 26)

The numbers you set for checkboxHeight and radioHeight should be one quarter
of the total height of the image want to use for checkboxes and radio
buttons. Both images should contain the four stages of both inputs stacked
on top of each other in this order: unchecked, unchecked-clicked, checked,
checked-clicked.

You may need to adjust your images a bit if there is a slight vertical
movement during the different stages of the button activation.

The value of selectWidth should be the width of your select list image.

Visit http://ryanfait.com/ for more information.

*/

var checkboxHeight = "25";
var radioHeight = "25";
var selectstarsWidth = "94";
var selectcityWidth = "132";
var selectpriceWidth = "99";


var sel_prfcityWidth = "186";

var sel_prfmonthWidth = "72";
var sel_prfdateWidth = "72";
var sel_prfyearWidth = "72";

var resreg_selWidth = "197";



/* No need to change anything after this */



document.write('<style type="text/css">input.styled { display: none; } select.styled { position: relative; width: ' + selectstarsWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } input.pristyled { display: none; } select.pristyled { position: relative; width: ' + selectpriceWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } .disabled { opacity: 0.5; filter: alpha(opacity=50); }  input.citystyled { display: none; } select.citystyled { position: relative; width: ' + selectcityWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } .disabled { opacity: 0.5; filter: alpha(opacity=50); } input.prf_city { display: none; } select.prf_city { position: relative; width: ' + sel_prfcityWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } input.prf_state { display: none; } select.prf_state { position: relative; width: ' + sel_prfcityWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; }  input.prf_country { display: none; } select.prf_country { position: relative; width: ' + sel_prfcityWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } input.prf_month { display: none; } select.prf_month { position: relative; width: ' + sel_prfmonthWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } input.prf_date { display: none; } select.prf_date { position: relative; width: ' + sel_prfdateWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } input.prf_year { display: none; } select.prf_year { position: relative; width: ' + sel_prfyearWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; }  input.resreg_cnt { display: none; } select.resreg_cnt { position: relative; width: ' + resreg_selWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } input.resreg_stt { display: none; } select.resreg_stt { position: relative; width: ' + resreg_selWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; }  input.resreg_city { display: none; } select.resreg_city { position: relative; width: ' + resreg_selWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } </style>');


var Custom = {
	init: function() {
		var inputs = document.getElementsByTagName("input"), span = Array(), textnode, option, active;
		
			for(a = 0; a < inputs.length; a++) {			
			
			if((inputs[a].type == "checkbox" || inputs[a].type == "radio") && inputs[a].className == "styled") {				
				span[a] = document.createElement("span");
				span[a].className = inputs[a].type;

				if(inputs[a].checked == true) {
					if(inputs[a].type == "checkbox") {
						position = "0 -" + (checkboxHeight*2) + "px";
						span[a].style.backgroundPosition = position;
					} else {
						position = "0 -" + (radioHeight*2) + "px";
						span[a].style.backgroundPosition = position;
					}
				}
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				inputs[a].onchange = Custom.clear;
				if(!inputs[a].getAttribute("disabled")) {
					span[a].onmousedown = Custom.pushed;
					span[a].onmouseup = Custom.check;
				} else {
					span[a].className = span[a].className += " disabled";
				}
			}
		}
				
		inputs = document.getElementsByTagName("select");
		for(a = 0; a < inputs.length; a++) {
			if(inputs[a].className == "styled") {
				var starselect = inputs[a];
				option = inputs[a].getElementsByTagName("option");
				active = option[0].childNodes[0].nodeValue;
				textnode = document.createTextNode(active);
				//alert(option.length);
				for(b = 0; b < option.length; b++) {
					if(option[b].selected == true) {
						textnode = document.createTextNode(option[b].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "select";				
				span[a].id = "select" + inputs[a].name;
				
				span[a].appendChild(textnode);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!starselect.getAttribute("disabled")) {
					
					//starselect.childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
					starselect.onchange = Custom.choose;
					//inputs[a].onchange = Custom.choose;
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}
			
			if(inputs[a].className == "citystyled") {				
				var cselect = inputs[a];
				//alert(cselect.id);
				option1 = cselect.getElementsByTagName("option");
				active1 = option1[0].childNodes[0].nodeValue;
				textnode1 = document.createTextNode(active1);
				//alert(option2.length);
				for(cc = 0; cc < option1.length; cc++) {
					if(option1[cc].selected == true) {					
						textnode1 = document.createTextNode(option1[cc].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "cityselect";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode1);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!cselect.getAttribute("disabled")) {
					
				  // cselect.childNodes[0].nodeValue = option1[0].childNodes[0].nodeValue;
				   cselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}		
			
			
			
			if(inputs[a].className == "pristyled") {
				var pselect = inputs[a];
				//alert(pselect.id);
				option2 = pselect.getElementsByTagName("option");
				active2 = option2[0].childNodes[0].nodeValue;
				textnode2 = document.createTextNode(active2);
				//alert(option2.length);
				for(tt = 0; tt < option2.length; tt++) {
					if(option2[tt].selected == true) {					
						textnode2 = document.createTextNode(option2[tt].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "priceselect";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode2);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!pselect.getAttribute("disabled")) {
					
				 //  pselect.childNodes[0].nodeValue = option2[0].childNodes[0].nodeValue;
				 pselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}
			
			
			if(inputs[a].className == "prf_country") {
				var prf_ctryselect = inputs[a];
				//alert(prf_ctryselect);
				option11 = prf_ctryselect.getElementsByTagName("option");
				active11 = option11[0].childNodes[0].nodeValue;
				textnode11 = document.createTextNode(active11);
				//alert(option2.length);
				for(tt = 0; tt < option11.length; tt++) {
					if(option11[tt].selected == true) {					
						textnode11 = document.createTextNode(option11[tt].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "prf_country";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode11);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!prf_ctryselect.getAttribute("disabled")) {
					
				 //  pselect.childNodes[0].nodeValue = option2[0].childNodes[0].nodeValue;
				 prf_ctryselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}
			
			if(inputs[a].className == "prf_state") {
				var prf_stateselect = inputs[a];
				//alert(prfselect.id);
				option12 = prf_stateselect.getElementsByTagName("option");
				active12 = option12[0].childNodes[0].nodeValue;
				textnode12 = document.createTextNode(active12);
				//alert(option2.length);
				for(tt = 0; tt < option12.length; tt++) {
					if(option12[tt].selected == true) {					
						textnode12 = document.createTextNode(option12[tt].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "prf_state";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode12);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!prf_stateselect.getAttribute("disabled")) {
					
				 //  pselect.childNodes[0].nodeValue = option2[0].childNodes[0].nodeValue;
				 prf_stateselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}		
			
			if(inputs[a].className == "prf_city") {
				var prfselect = inputs[a];
				//alert(prfselect.id);
				option13 = prfselect.getElementsByTagName("option");
				active13 = option13[0].childNodes[0].nodeValue;
				textnode13 = document.createTextNode(active13);
				//alert(option2.length);
				for(tt = 0; tt < option13.length; tt++) {
					if(option13[tt].selected == true) {					
						textnode13 = document.createTextNode(option13[tt].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "prf_city";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode13);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!prfselect.getAttribute("disabled")) {
					
				 //  pselect.childNodes[0].nodeValue = option2[0].childNodes[0].nodeValue;
				 prfselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}
			
			
			if(inputs[a].className == "prf_month") {
				var prf_monthselect = inputs[a];
				//alert(prf_monthselect.id);
				option01 = prf_monthselect.getElementsByTagName("option");
				active01 = option01[0].childNodes[0].nodeValue;
				textnode01 = document.createTextNode(active01);
				//alert(option2.length);
				for(tt = 0; tt < option01.length; tt++) {
					if(option01[tt].selected == true) {					
						textnode01 = document.createTextNode(option01[tt].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "prf_month";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode01);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!prf_monthselect.getAttribute("disabled")) {
					
				 //  pselect.childNodes[0].nodeValue = option2[0].childNodes[0].nodeValue;
				 prf_monthselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}
			
			if(inputs[a].className == "prf_date") {
				var prf_dateselect = inputs[a];
				//alert(prf_dateselect.id);
				option02 = prf_dateselect.getElementsByTagName("option");
				active02 = option02[0].childNodes[0].nodeValue;
				textnode02 = document.createTextNode(active02);
				//alert(option2.length);
				for(tt = 0; tt < option02.length; tt++) {
					if(option02[tt].selected == true) {					
						textnode02 = document.createTextNode(option02[tt].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "prf_date";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode02);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!prf_dateselect.getAttribute("disabled")) {
					
				 //  pselect.childNodes[0].nodeValue = option2[0].childNodes[0].nodeValue;
				 prf_dateselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}
			
			if(inputs[a].className == "prf_year") {
				var prf_yearselect = inputs[a];
				//alert(prf_yearselect.id);
				option03 = prf_yearselect.getElementsByTagName("option");
				active03 = option03[0].childNodes[0].nodeValue;
				textnode03 = document.createTextNode(active03);
				//alert(option2.length);
				for(tt = 0; tt < option03.length; tt++) {
					if(option03[tt].selected == true) {					
						textnode03 = document.createTextNode(option03[tt].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "prf_year";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode03);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!prf_yearselect.getAttribute("disabled")) {
					
				 //  pselect.childNodes[0].nodeValue = option2[0].childNodes[0].nodeValue;
				 prf_yearselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}
			
			
			if(inputs[a].className == "resreg_cnt") {
			
			  if(document.getElementById('u_country').value == "")
			  {
				var resreg_cntselect = inputs[a];
				
				option31 = resreg_cntselect.getElementsByTagName("option");
				active31 = option31[0].childNodes[0].nodeValue;				
				textnode31 = document.createTextNode(active31);
				//alert(option2.length);
				for(cc = 0; cc < option31.length; cc++) {
					if(option31[cc].selected == true) {					
						textnode31 = document.createTextNode(option31[cc].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "resreg_cnt";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode31);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!resreg_cntselect.getAttribute("disabled")) {
					
				  // cselect.childNodes[0].nodeValue = option1[0].childNodes[0].nodeValue;
				   resreg_cntselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
					
				}
			  }
			  else
			  {	
			  	inputs[a].previousSibling.className = inputs[a].previousSibling.className += "resreg_cnt ";
				showstate_travel('','');
				
			  }
				
			}
			
			if(inputs[a].className == "resreg_stt") {
				var resreg_sttselect = inputs[a];
				//alert(cselect.id);
				option32 = resreg_sttselect.getElementsByTagName("option");
				active32 = option32[0].childNodes[0].nodeValue;
				textnode32 = document.createTextNode(active32);
				//alert(option2.length);
				for(cc = 0; cc < option32.length; cc++) {
					if(option32[cc].selected == true) {					
						textnode32 = document.createTextNode(option32[cc].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "resreg_stt";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode32);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!resreg_sttselect.getAttribute("disabled")) {
					
				  // cselect.childNodes[0].nodeValue = option1[0].childNodes[0].nodeValue;
				   resreg_sttselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}
			
			if(inputs[a].className == "resreg_city") {
				var resreg_cityselect = inputs[a];
				//alert(cselect.id);
				option33 = resreg_cityselect.getElementsByTagName("option");
				active33 = option33[0].childNodes[0].nodeValue;
				textnode33 = document.createTextNode(active33);
				//alert(option2.length);
				for(cc = 0; cc < option33.length; cc++) {
					if(option33[cc].selected == true) {					
						textnode33 = document.createTextNode(option33[cc].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "resreg_city";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode33);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!resreg_cityselect.getAttribute("disabled")) {
					
				  // cselect.childNodes[0].nodeValue = option1[0].childNodes[0].nodeValue;
				   resreg_cityselect.onchange = Custom.choose;
					
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}
			
			
		
		
			
		}
		document.onmouseup = Custom.clear;
	},
	pushed: function() {
		element = this.nextSibling;
		if(element.checked == true && element.type == "checkbox") {
			this.style.backgroundPosition = "0 -" + checkboxHeight*3 + "px";
		} else if(element.checked == true && element.type == "radio") {
			this.style.backgroundPosition = "0 -" + radioHeight*3 + "px";
		} else if(element.checked != true && element.type == "checkbox") {
			this.style.backgroundPosition = "0 -" + checkboxHeight + "px";
		} else {
			this.style.backgroundPosition = "0 -" + radioHeight + "px";
		}
	},
	check: function() {
		element = this.nextSibling;
		if(element.checked == true && element.type == "checkbox") {
			this.style.backgroundPosition = "0 0";
			element.checked = false;
		} else {
			if(element.type == "checkbox") {
				this.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px";
			} else {
				this.style.backgroundPosition = "0 -" + radioHeight*2 + "px";
				group = this.nextSibling.name;
				inputs = document.getElementsByTagName("input");
				for(a = 0; a < inputs.length; a++) {
					if(inputs[a].name == group && inputs[a] != this.nextSibling) {
						inputs[a].previousSibling.style.backgroundPosition = "0 0";
					}
				}
			}
			element.checked = true;
		}
	},
	clear: function() {
		inputs = document.getElementsByTagName("input");
		for(var b = 0; b < inputs.length; b++) {
			if(inputs[b].type == "checkbox" && inputs[b].checked == true && inputs[b].className == "styled") {
				inputs[b].previousSibling.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px";
			} else if(inputs[b].type == "checkbox" && inputs[b].className == "styled") {
				inputs[b].previousSibling.style.backgroundPosition = "0 0";
			} else if(inputs[b].type == "radio" && inputs[b].checked == true && inputs[b].className == "styled") {
				inputs[b].previousSibling.style.backgroundPosition = "0 -" + radioHeight*2 + "px";
			} else if(inputs[b].type == "radio" && inputs[b].className == "styled") {
				inputs[b].previousSibling.style.backgroundPosition = "0 0";
			}
		}
	},
	choose: function() {
		option = this.getElementsByTagName("option");
	
		for(d = 0; d < option.length; d++) {
		
			if(option[d].selected == true) {
				
				document.getElementById("select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
			}
		}
	}
}
window.onload = Custom.init;
