/*

CUSTOM FORM ELEMENTS

Created by Ryan Fait
www.ryanfait.com

=== 
modified by Sean Sean Tan (10/06/08) for multiple select box widths
http://www.nekomatta.com
===

The only thing you need to change in this file is the following
variables: checkboxHeight, radioHeight and selectWidth.

Replace the first two numbers with the height of the checkbox and
radio button. The actual height of both the checkbox and radio
images should be 4 times the height of these two variables. The
selectWidth value should be the width of your select list image.

You may need to adjust your images a bit if there is a slight
vertical movement during the different stages of the button
activation.

Visit http://ryanfait.com/ for more information.

*/

var checkboxHeight = "25";
var radioHeight = "25";
var selectWidth = "248";
var shorterSelect = "72";
var sideSelect = "150";
var longSelect = "245";
var halfSelect = "120";


/* No need to change anything after this */

document.write('<style type="text/css">input.styled { display: none; } select.styled { position: relative; width: ' + selectWidth + 'px; opacity: 0; z-index: 5; } select.shorter { position: relative; width: ' + shorterSelect + 'px; opacity: 0; z-index: 5; } select.side-select { position: relative; width: ' + sideSelect + 'px; opacity: 0; z-index: 5; } select.long-select { position: relative; width: ' + longSelect + 'px; opacity: 0; z-index: 5; } select.half-select { position: relative; width: ' + halfSelect + 'px; 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;
				span[a].onmousedown = Custom.pushed;
				span[a].onmouseup = Custom.check;
				document.onmouseup = Custom.clear;
			}
		}
		inputs = document.getElementsByTagName("select");
		
		for(a = 0; a < inputs.length; a++) {
			if(inputs[a].className == "styled") {
				option = inputs[a].getElementsByTagName("option");
				active = option[0].childNodes[0].nodeValue;
				textnode = document.createTextNode(active);
				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]);
				inputs[a].onchange = Custom.choose;
			}
			if(inputs[a].className == "shorter") {
				option = inputs[a].getElementsByTagName("option");
				active = option[0].childNodes[0].nodeValue;
				textnode = document.createTextNode(active);
				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 = "shorter";
				span[a].id = "shorter" + inputs[a].name;
				span[a].appendChild(textnode);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				inputs[a].onchange = Custom.choose;
			}
			if(inputs[a].className == "side-select") {
				option = inputs[a].getElementsByTagName("option");
				active = option[0].childNodes[0].nodeValue;
				textnode = document.createTextNode(active);
				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 = "side-select";
				span[a].id = "side-select" + inputs[a].name;
				span[a].appendChild(textnode);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				inputs[a].onchange = Custom.choose;
			}
			if(inputs[a].className == "long-select") {
				option = inputs[a].getElementsByTagName("option");
				active = option[0].childNodes[0].nodeValue;
				textnode = document.createTextNode(active);
				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 = "long-select";
				span[a].id = "long-select" + inputs[a].name;
				span[a].appendChild(textnode);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				inputs[a].onchange = Custom.choose;
			}
			if(inputs[a].className == "half-select") {
				option = inputs[a].getElementsByTagName("option");				
				active = option[0].childNodes[0].nodeValue;
				textnode = document.createTextNode(active);
				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 = "half-select";
				span[a].id = "half-select" + inputs[a].name;
				span[a].appendChild(textnode);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				inputs[a].onchange = Custom.choose;
			}			
		}
		
		//if(window.info)
		//	info('lowdown');
			
		//if(window.destinfo)		
	
		if(typeof section != "undefined"){
			section('intro');
		}
		
		if(typeof addcart_status != "undefined"){
			addcart_status();
		}
		
		if(typeof quotesinfo != "undefined"){
			if(document.getElementById('type').value == 'reader')
				quotesinfo('reader');
			else	
				quotesinfo('media');
		}
		
		if(typeof updateinfo != "undefined"){
			updateinfo('accommodation');
		}
		
		if(typeof destinfo != "undefined"){
			destinfo('overview');
		}
		
		if(typeof info != "undefined"){
			info('lowdown');
		}
				
		//if(typeof review_load != "undefined"){
			//ajax_post();
		//}
		
			
		
		
	},
	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) {
				// redirect or ...
				if((this.className == "styled" || this.className == "side-select") && this.id == 'guide_onchg'){
					if(option[d].value != ''){
						location.href="?m=guide_inner&guide_id="+option[d].value;
					}
				}
				else if((this.className == "styled" || this.className == "side-select") && this.id == 'boxset_onchg'){				
					if(option[d].value != ''){
						var boxvalue = option[d].value;						
						splat = boxvalue.split('_');
						
						if(splat[0] == 'boxset')
							location.href="?m=boxset_inner&boxset_id="+splat[1];
						else							
							location.href="?m=bespoke_inner&box_id="+splat[1];
					}
				}
				else if((this.className == "styled" || this.className == "side-select") && this.id == 'destination_onchg'){				
					if(option[d].value != ''){						
						location.href="?m=dest_inner&dest_id="+option[d].value;
					}
				}
				else if((this.className == "styled" || this.className == "side-select") && this.id == 'infoupdate_onchg'){				
					if(option[d].value != ''){					
						location.href="?m=update_detail&id="+option[d].value;
					}
				}
				else if((this.className == "styled" || this.className == "side-select") && this.id == 'stockist_onchg'){	
					if(option[d].value != ''){																		
						var params = 'count_id='+ option[d].value;
						var url = '?m=stockist_getcities';
						var div = 'stockist_city';
						
						simple_ajax(div,params,url);
					}
					//if(option[d].value != ''){			
					//	location.href="?m=stockist_list&cid="+option[d].value+"&rid="+document.getElementById('rid').value;
					//}
				}
				else if((this.className == "styled" || this.className == "side-select") && this.id == 'stockistlist_onchg'){				
					if(option[d].value != ''){		
						location.href="?m=stockist_list&cid="+document.getElementById('cid').value+"&rid="+document.getElementById('rid').value+"&cityid="+option[d].value;
					}
				}
				else if((this.className == "half-select") && this.id == 'hv_onchg'){				
					if(option[d].value != ''){																		
						var params = 'count_id='+ option[d].value;
						var url = '?m=hv_getcities';
						var div = 'hv_city';
						
						simple_ajax(div,params,url);
					}
				}				
				else if((this.className == "long-select") && this.id == 'hv_onchg'){				
					if(option[d].value != ''){																		
						var params = 'count_id='+ option[d].value;
						var url = '?m=hv_getcities';
						var div = 'hv_city';
						
						simple_ajax(div,params,url);
					}
				}			
				else if((this.className == "side-select") && this.id == 'country'){				
					if(option[d].value != ''){																											
						//location.href="?m=hv_listing&country="+option[d].value;
						city_change(option[d].value);
					}
				}
				else if((this.className == "side-select") && this.id == 'city'){				
					if(option[d].value != ''){																											
						//location.href="?m=hv_listing&country="+option[d].value;
						hotel_change(option[d].value);
					}
				}
				else if((this.className == "side-select") && this.id == 'city_onchg'){					
					if(option[d].value != ''){									
						location.href="?m=hv_listing&country="+ document.getElementById('country_onchg').value +"&city="+option[d].value;
					}
				}
				
				// set front end display
				
				if(this.className == "styled")				
					document.getElementById("select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
				else if(this.className == "shorter")
					document.getElementById("shorter" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
				else if(this.className == "side-select")
					document.getElementById("side-select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
				else if(this.className == "half-select" && this.id == 'hv_onchg')
					document.getElementById("half-select"+this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
				else if(this.className == "half-select" && this.id == 'hvcity_onchg'){
					document.getElementById("half-select"+this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
					
				}
				else if(this.className == "half-select" && this.id=="num_nights"){
					document.getElementById("half-select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;					
				}
				else if(this.className == "long-select" && this.id == 'accommo_onchg'){
					document.getElementById("long-select"+this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;					
				}
				else if(this.className == "long-select" && this.id == 'hv_onchg'){
					//document.getElementById("long-select").childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
					document.getElementById("long-select"+this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;					
				}
				else if(this.className == "long-select" && this.id == 'hvcity_onchg'){
					//document.getElementById("long-select").childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;		
					document.getElementById("long-select"+this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
				}
				
												
			}
		}
	}
}
function city_change(country){
	// refresh city list
	var params = 'count_id='+ country + '&hotellisting=true';
	var divid = 'hv_city';
	var myurl = '?m=hv_getcities';
	
	ajax_post2(divid,params,myurl);	
	
	// refresh hotel list
	//var params = 'count_id=' + country;
	//var divid = 'hv_hotel';
	//var myurl = '?m=ajax_gethvcities';
	
	//ajax_post2(divid,params,myurl);
}

function hotel_change(city){
	//alert(city); return false;
	//var country = document.getElementById('country').value;
	//var params = 'city_id='+ city + '&count_id=' + country;
	//var divid = 'hv_hotel';
	//var myurl = '?m=ajax_gethvcities';
	
	//ajax_post2(divid,params,myurl);
}

function gethotelname(val){	
	for (var loop=0; loop<document.sidebarform.hotel.length; loop++) {		
		if(document.sidebarform.hotel.options[loop].value == val){										
			//alert('yes' + '|' + loop);
			//document.sidebarform.hotel.selectedIndex = loop;	
			document.getElementById('side-selecthotel').innerHTML = document.sidebarform.hotel.options[loop].text;
		}
	}
}

function ajax_post2(divid,params,myurl){	
			document.getElementById(divid).innerHTML = "<img src='images/loading.gif'>";
				
			$.ajax({
				type: "POST",
				dataType: "text",
				url: myurl,			
				data: params,			               
				success: function(text){	
					
					if(text){
						//document.getElementById('hv_loading').innerHTML = "";
						//document.getElementById(divid).style.textTransform = "uppercase";
						document.getElementById(divid).innerHTML = text;
					}
				}			              
			}); 
			
}
function simple_ajax(divid,params,myurl){	
			document.getElementById(divid).innerHTML = "<img src='images/loading.gif'>";
			
			$.ajax({
				type: "POST",
				dataType: "text",
				url: myurl,			
				data: params,			               
				success: function(text){					
					if(text){						
						document.getElementById(divid).innerHTML = text;
					}
				}			              
			}); 
			
}

window.onload = Custom.init;