﻿//$j = jQuery.noConflict();

(function(){

var frm = document.forms.htlFrm;

Queue.add(function(){
	//destination autocomplete
	this.dstComplete = new v8.AutoComplete(frm.destination,
	JS.apply(
		new v8.AutoComplete.Ajax('pickers/topology.cfm?filter=htl'),
		{
			format: function(data) {
				frm.htl_shtl_code.value = frm.htl_cnt_code.value = frm.htl_cnt_rg_code.value = frm.htl_cty_code.value = '';
				
				return Array.map(data.output, function(output, i) {
					data.htl_codes[i] == '' ? imgType = '<img style="float:right; opacity:0.5; height:20px;" src="../theme/globe_grey.png"/>' : imgType = '<img style="float:right; opacity:0.5;" src="../theme/icon_city.png"/>';
					return output + imgType + '<br/><img src="../images/flags/' + data.cnt_sh_names[i].toLowerCase() + '.png" alt="">&nbsp;'+ data.regions[i]+ ', ' + data.countries[i];
				});
			},
			handle: function(data, i, input) {
				if(data.cty_codes[i] == -1) {
					if(data.cnt_rg_codes[i] == -1) {
						input.value = data.countries[i].replace(/\<[\/]*strong\>/ig,'');
					} else {
						input.value = data.regions[i].replace(/\<[\/]*strong\>/ig,'') + ', ' + data.countries[i].replace(/\<[\/]*strong\>/ig,'');
					}
				} else {
					input.value = data.cities[i].replace(/\<[\/]*strong\>/ig,'') + ', ' + data.regions[i].replace(/\<[\/]*strong\>/ig,'') + ', ' + data.countries[i].replace(/\<[\/]*strong\>/ig,'');
				}
				
				input.form.htl_cnt_code.value = data.cnt_codes[i];
				data.cnt_rg_codes[i] == '-1' ? input.form.htl_cnt_rg_code.value = '' : input.form.htl_cnt_rg_code.value = data.cnt_rg_codes[i];
				data.cty_codes[i] == '-1' ? input.form.htl_cty_code.value = '' : input.form.htl_cty_code.value = data.cty_codes[i];
				data.htl_codes[i] == '' ? input.form.htl_shtl_code.value = '' : input.form.htl_shtl_code.value = data.htl_codes[i];
			}
		}
	), {threshold:2, delay:0.4, max:20, width: 310, force: false});

	Event.on(frm.destination, 'focus', function(){if(this.value == lang.autocity) this.value=''}, this);
	Event.on(frm.destination, 'blur', function(){if(this.value=='') this.value=lang.autocity }, this);
	Event.on(frm.destination, 'change', 
			 function(e) { var frm = this.form; if(!hasValue(frm.destination)) { frm.htl_cnt_rg_code.value = frm.htl_cnt_code.value = frm.htl_cty_code.value = ''; } }
	);
	//datepickers
	//$j("#checkin").datepicker({showOn: 'button', buttonImage: 'mockup/theme/calendar_week.png', buttonImageOnly: true, dateFormat: 'dd/mm/yyyy' });
	//$j("#checkout").datepicker({showOn: 'button', buttonImage: 'mockup/theme/calendar_week.png', buttonImageOnly: true, dateFormat: 'dd/mm/yyyy' });
	//Event.on([frm.checkin,frm.checkout,frm.nights], 'change', nightsChange, frm);
	Event.on([frm.checkin,frm.checkout,frm.nights], 'change', nightsChange, frm);
	Event.fire(frm.checkin, 'change');
	
	$j(frm.no_dates).click( function() { frm.checkin.disabled = frm.checkout.disabled = frm.no_dates.checked; } );
	frm.checkin.disabled = frm.checkout.disabled = frm.no_dates.checked;
	
	Event.on(frm.rooms, 'change', roomsChange, this);
	Event.fire(frm.rooms, 'change');
	
	//Advanced
	$j('a#toggle-AdvancedCriteria').click(function() {
		$j('#AdvancedCriteria').toggle(100);
		return false;
	});
	
	//multiselect dropdowns
	$j("#htl_classes").dropdownchecklist({defaultText: lang.htl_class + ': ' + lang.all, width:140, minWidth:140});
	$j("#htl_type").dropdownchecklist({defaultText: lang.htl_type+ ': ' + lang.all, width:140, minWidth:140});
	$j("#meal_types").dropdownchecklist({defaultText: lang.meals+ ': ' + lang.all, width:140, minWidth:140});
	$j("#rm_cat").dropdownchecklist({defaultText: lang.rm_cat+ ': ' + lang.all, width:140, minWidth:140});
	
});

function nightsChange(e, frm) {
	if ( this.name == 'nights' ) {
		frm.checkin.value = frm.checkout.value.toDate().dayAdd(parseInt(this.value, 10)).format();	
	} else {
		if ( this.value.length && validateDate(this.value) ) {
			$('nights').innerHTML = frm.checkin.value.toDate().dayDiff(frm.checkout.value.toDate());
		}
	}
}


function roomsChange(e) {
	var rooms = parseInt(this.value) + 1;
	var container = $('roomsContainer');

	container.innerHTML = '';
	for( var i=1; i!=rooms; ++i) {
		var room = document.createElement('div');
		room.className = "roomContainer";
		room.setAttribute("id", "roomContainer_" + i);
		room.innerHTML = '<div class="roomTitle left"><h2>'+lang.hotel.room+' #'+i+'</h2></div>';
		
		var pax = document.createElement('div');
		pax.className = "pax";
		pax.innerHTML = '<div class="left mrg">'+
				'<label>'+lang.adults+' <span class="small">'+lang.adults_how_many+'</span></label>'+
				'<select name="adults_'+ i +'">'+
				'<option value="0">0 '+lang.adult+'</option>'+
				'<option value="1">1 '+lang.adult+'</option>'+
				'<option value="2" selected="selected">2 '+lang.adults+'</option>'+
				'<option value="3">3 '+lang.adulst+'</option>'+
				'<option value="4">4 '+lang.adulst+'</option>'+
				'<option value="5">5 '+lang.adulst+'</option>'+
				'<option value="6">6 '+lang.adulst+'</option>'+
				'</select>'+
				'</div>'+
				'<div class="left mrg">'+
				'<label>'+lang.children+' <span class="small">'+lang.child_how_many+'</span></label>'+
				'<select class="children" name="children_'+ i +'">'+
				'<option value="0" selected="selected">0 '+lang.child+'</option>'+
				'<option value="1">1 '+lang.child+'</option>'+
				'<option value="2">2 '+lang.children+'</option>'+
				'<option value="3">3 '+lang.children+'</option>'+
				'<option value="4">4 '+lang.children+'</option>'+
				'</select>'+
				'</div>'+
				'<div class="clear"></div>';
		room.appendChild(pax);
		
		container.appendChild(room);
		//separator
		if(i < rooms-1 ) {
			hr = document.createElement('hr');
			hr.className = "roomSeparator";
			container.appendChild(hr);
		}
	}
	//apply events
	Event.on( cssQuery('select[name^=children]', container) , 'change', ChildrenChange, this);
}

function ChildrenChange(e) {
	var rm = parseInt(this.name.split('_')[1], 10),
		chContainer,
		html = [],
		children = parseInt(this.value, 10), i = children;

	if ( children === 0 ) {
		if ( $('chContainer_'+ rm) ) {
			dom.trash('chContainer_'+ rm);
		}
		return;
	}

	if ( $('chContainer_'+ rm) ) {
		$('roomContainer_'+ rm).removeChild( $('chContainer_'+ rm) );
	}
	chContainer = document.createElement('div');
	chContainer.setAttribute("id", 'chContainer_'+ rm);
	chContainer.className = "left chContainer";
	
	while ( i-- ) {
		html.push('<label class="canBeHidden">'+lang.child_age+' '+ (children-i) +' <span class="small">'+lang.child_age_descr+'</span> </label>');
		html.push('<input type="text" class="childage canBeHidden" value="" id="childage_'+ rm +'_'+ (children-i) +'" name="childage_'+ rm +'_'+ (children-i) +'" size="2" data-min="0" data-max="17"/>');
		html.push('<label>'+lang.child_birth+' <span class="small">'+lang.child_birth_descr+'</span> </label>');
		html.push('<span class="v8cal"><input class="date text opague" id="child_birth_'+ rm +'_'+ (children-i) +'" name="child_birth_'+ rm +'_'+ (children-i) +'" size="12" maxlength="10" value="dd/mm/yyyy" /><img src="../images/cal.gif" alt="" /></span>');
		html.push('<div class="clear"></div>');
	}
	chContainer.innerHTML = html.join('');
	
	Behavior.apply(chContainer);
	Behavior.applyDynamic(chContainer);
	Event.on( cssQuery("input.date", chContainer), 'focus', function(e){ if (this.value == "dd/mm/yyyy") {this.value = "";} this.className="date text"; }, e  );
	$('roomContainer_'+ rm).appendChild(chContainer);
	
	chContainer=null;
}

})();

function selectAll(el) {
	var container = el.parentNode.previousSibling;
	var selectOptions = $j('#htl_type');
	Array.forEach(cssQuery('input[type=checkbox]' ,container), function(el) {
		if (!el.checked) {
			$j(el).trigger("click");
		}
	});
}

function selectNone(el) {
	var container = el.parentNode.previousSibling;
	Array.forEach(cssQuery('input[type=checkbox]' ,container), function(el) {
		if (el.checked) {
			$j(el).trigger("click");
		}
	});
}


