jQuery(document).ready(function($) {
	var nav = $('.navigation');
	var form = $('.navigation .reservations_box');
	nav.find('> li:not(:first)').append($('<div class="light"></div>')).fadeOut(0);
	
	nav.find('> li:not(:first)').each(function(i) {
		fadeIn($(this), i);	
	});
	
	nav.find('li:not(:first) div').each(function(i) {
		fadeOut($(this), i);
	});
	
	nav.find('> li:not(:first)').mouseenter(function() {
		$(this).find('img').fadeIn(100);
		$(this).find('ul').slideDown(200);
	}).mouseleave(function() {
		$(this).find('img').fadeOut(100);
		$(this).find('ul').slideUp(200);
	});
	
	nav.find('> li:first > a').click(function(e) {
		if (form.is(':visible')) {
			$(this).removeClass('open');
			form.slideUp(200);
		} else {
			$(this).addClass('open');					
			form.slideDown(200);
		}
		return false;
	});
	
	function fadeIn(target, delay) {
		setTimeout(function() {
			target.fadeIn(400);
		}, delay * 300);				
	}
	
	function fadeOut(target, delay) {
		setTimeout(function() {
			target.show();
			target.fadeOut(800, function() {
				$(this).remove();	
			});
		}, delay * 300);
	}
	
	var c = 10;
	var option;
	for (var i=1; i < c; i++) {
		option = $('<option></option>').attr('value', i).html(i);
		$('#adult').append(option);
	}
			
	var c = 10;
	var option;
	for (var i=0; i < c; i++) {
		option = $('<option></option>').attr('value', i).html(i);
		$('#child').append(option);
	}

	$('.submit_reservation').click(function() {
		nav.find('> li:first > a').removeClass('open');
		nav.find('> li:first > a').find('img').fadeOut(100);
		form.slideUp(200);
		
		arrive = '&arrive=' + document.reserve.a_d.value + '/' + document.reserve.a_m.value + '/' + document.reserve.a_y.value;
		depart = '&depart=' + document.reserve.d_d.value + '/' + document.reserve.d_m.value + '/' + document.reserve.d_y.value;
		adult = '&adult=' + document.reserve.adult.value;
		child = '&child=' + document.reserve.child.value;
		window.open('https://gc.synxis.com/rez.aspx?Hotel=26036&template=gco&shell=gc1&locale=en-GB'+arrive+depart+adult+child,'Reservations','width=850, height=750, scrollbars=yes, toolbar=no, directories=no,status=no,menubar=no,copyhistory=no'); 
	});	
	
	$('.book_now').click(function() {
		window.open('https://gc.synxis.com/rez.aspx?Hotel=26036&template=gco&shell=gc1&locale=en-GB','Reservations','width=850, height=750, scrollbars=yes, toolbar=no, directories=no,status=no,menubar=no,copyhistory=no'); 
	});	
});  	

// Arrival Date

jQuery(document).ready(function($) {
	var range_start = new Date();
	var range_end = (new Date()).addYears(2);
	// initialise the "Select date" link
	$('#select_a_date')
		.datePicker(
			// associate the link with a date picker
			{
				createButton: false,
				startDate: range_start.asString(),
				endDate: range_end.asString()
			}
		).bind(
			// when the link is clicked display the date picker
			'click',
			function() {
				update_a_Selects($(this).dpGetSelected()[0]);
				$(this).dpDisplay();
				return false;
			}
		).bind(
			// when a date is selected update the SELECTs
			'dateSelected',
			function(e, selectedDate, $td, state) {
				update_a_Selects(selectedDate);
			}
		).bind(
			'dpClosed',
			function(e, selected) {
				update_a_Selects(selected[0]);
			}
		);
		
	var update_a_Selects = function (selectedDate) {
		var selectedDate = new Date(selectedDate);
		$('#a_d option[value=' + selectedDate.getDate() + ']').attr('selected', 'selected');
		$('#a_m option[value=' + (selectedDate.getMonth()+1) + ']').attr('selected', 'selected');
		$('#a_y option[value=' + (selectedDate.getFullYear()) + ']').attr('selected', 'selected');
	}
	// listen for when the selects are changed and update the picker
	$('#a_d, #a_m, #a_y').bind(
			'change',
			function() {
				var d = new Date(
							$('#a_y').val(),
							$('#a_m').val()-1,
							$('#a_d').val()
						);
				$('#date-pick').dpSetSelected(d.asString());

				// Update the days in the month, if month or year changed
				
				var new_date = new Date($('#a_y').val(), $('#a_m').val()-1, $('#a_d').val());	
				var days = new_date.getDaysInMonth();
				var d_val = $('#a_d').val();
				var option;
				
				$('#a_d').html('');
				
				for (var i=1; i <= days; i++) {
					option = $('<option></option>').attr('value', i).html(i);
					$('#a_d').append(option);
				}
				$('#a_d option[value=' + d_val + ']').attr('selected', 'selected');
			}
		);
	
	// default the position of the selects to today
	//var today = new Date();
	//update_a_Selects(today.getTime());
	
	// and update the datePicker to reflect it...
	//$('#a_d').trigger('change');
});		

// Departure Date

jQuery(document).ready(function($) {
	var range_start = new Date();
	var range_end = (new Date()).addYears(2);
	// initialise the "Select date" link
	$('#select_d_date')
		.datePicker(
			// associate the link with a date picker
			{
				createButton: false,
				startDate: range_start.asString(),
				endDate: range_end.asString()
			}
		).bind(
			// when the link is clicked display the date picker
			'click',
			function() {
				update_d_Selects($(this).dpGetSelected()[0]);
				$(this).dpDisplay();
				return false;
			}
		).bind(
			// when a date is selected update the SELECTs
			'dateSelected',
			function(e, selectedDate, $td, state) {
				update_d_Selects(selectedDate);
			}
		).bind(
			'dpClosed',
			function(e, selected) {
				update_d_Selects(selected[0]);
			}
		);
		
	var update_d_Selects = function (selectedDate) {
		var selectedDate = new Date(selectedDate);
		$('#d_d option[value=' + selectedDate.getDate() + ']').attr('selected', 'selected');
		$('#d_m option[value=' + (selectedDate.getMonth()+1) + ']').attr('selected', 'selected');
		$('#d_y option[value=' + (selectedDate.getFullYear()) + ']').attr('selected', 'selected');
	}
	// listen for when the selects are changed and update the picker
	$('#d_d, #d_m, #d_y').bind(
			'change',
			function() {
				var d = new Date(
							$('#d_y').val(),
							$('#d_m').val()-1,
							$('#d_d').val()
						);
				$('#date-d-pick').dpSetSelected(d.asString());
				
				// Update the days in the month, if month or year changed
				
				var new_date = new Date($('#d_y').val(), $('#d_m').val()-1, $('#d_d').val());	
				var days = new_date.getDaysInMonth();
				var d_val = $('#d_d').val();
				var option;
				
				$('#d_d').html('');
				
				for (var i=1; i <= days; i++) {
					option = $('<option></option>').attr('value', i).html(i);
					$('#d_d').append(option);
				}
				$('#d_d option[value=' + d_val + ']').attr('selected', 'selected');
			}
		);
	
	// default the position of the selects to today
	// var today = new Date();
	// today.addDays(1);
	// update_d_Selects(today.getTime());
	
	// and update the datePicker to reflect it...
	//$('#d_d').trigger('change');
});