var ry=Math.floor(Math.random()*4);
ry++;
jQuery(document).ready(function(){
	var bg_style = 'background: url(/content-styles/images/milestones_callback_'+ry+'.jpg) no-repeat;';
	jQuery("#top_box").attr('style',bg_style);
	//set value to empty when user clicks the input box
	jQuery('#name').click(function(){
		if(jQuery(this).val() == "Your Name")
		{
			jQuery(this).val("");
		}
	});
	jQuery('#email').click(function(){
		if(jQuery(this).val() == "Your Email Address")
		{
			jQuery(this).val("");
		}
	});
	jQuery('#phone').click(function(){
		if(jQuery(this).val() == "Telephone Number")
		{
			jQuery(this).val("");
		}
	});
	jQuery('#additional_details').click(function(){
		if(jQuery(this).val() == "Additional Details")
		{
			jQuery(this).val("");
		}
	});
	jQuery('#postcode').click(function(){
		if(jQuery(this).val() == "Your Postcode")
		{
			jQuery(this).val("");
		}
	});
	jQuery('#country').click(function(){
		if(jQuery(this).val() == "Your Country")
		{
			jQuery(this).val("");
		}
	});
	
	//removes and adds times depending on what day is selected	
	jQuery('#preferred_day').change(function(){
		jQuery("#preferred_time").find('option').remove().end(); // remove all options
		if(jQuery(this).val() == 6)
		{
//			var optionArray = [
//				"Preferred time of call",
//				"09:00-10:00",
//				"10:00-11:00",
//				"11:00-12:00",
//				"12:00-13:00",
//				"13:00-14:00",
//				"14:00-15:00"
//			];
			var optionArray = [
				"Preferred time of call",
				"10:00-12:00",
				"12:00-14:00",
				"14:00-15:00"
			];
			var select_html = "";
			for(var i=0;i < optionArray.length;i++){
				select_html += '<option value="'+i+'">'+optionArray[i]+'</option>';
			}
			jQuery("#preferred_time").html(select_html);
		}else{			
//			var optionArray = [
//				"Preferred time of call",
//				"09:00-10:00",
//				"10:00-11:00",
//				"11:00-12:00",
//				"12:00-13:00",
//				"13:00-14:00",
//				"14:00-15:00",
//				"15:00-16:00",
//				"16:00-17:30"
//			];
			var optionArray = [
				"Preferred time of call",
				"10:00-12:00",
				"12:00-14:00",
				"14:00-16:00",
				"16:00-17:30"
			];
			var select_html = "";
			for(var i=0;i < optionArray.length;i++){
				select_html += '<option value="'+i+'">'+optionArray[i]+'</option>';
			}
			jQuery("#preferred_time").html(select_html);
		}		
	});
	
	//make the form a ajax form
	var options = { 
		//target:        '#call-me-back-widget',   // target element(s) to be updated with server response 
		beforeSubmit:  showRequest,  // pre-submit callback 
		complete:       showResponse,  // post-submit callback 
 
        // other available options: 
		//url:       url         // override for form's 'action' attribute 
		//type:      type        // 'get' or 'post', override for form's 'method' attribute 
		dataType:  'json'        // 'xml', 'script', or 'json' (expected server response type) 
			//clearForm: true        // clear all form fields after successful submit 
			//resetForm: true        // reset the form after successful submit 
 
        // $.ajax options can be used here too, for example: 
			//timeout:   3000 
	}; 
	jQuery('#call-back-form').ajaxForm(options);
	/*
	if(jQuery('.right_colomb').attr('class') == 'right_colomb with_map'){
		jQuery('#call-me-back-small').css("top","720px");
	}
	*/
});
// pre-submit callback 
function showRequest(formData, jqForm, options) 
{ 
	//before form is submitted
	jQuery(':input', jqForm).removeClass('invalid');
} 
 
// post-submit callback 
function showResponse(data,status){
	if(status == "success")
	{
		var responce = data.responseText;
		//turn json object into array
		var responceArray = eval("(" + responce + ")");
		var errors = new Array();
	    if(responceArray.errors == "no")
	    {
	    	jQuery("#call-me-back-form").hide();
	    	jQuery("#bottom_box").html("<div id=\"form_message\">Your request has been forwarded to your Personal Travel Consultant and we look forward to being in touch with you as requested. <br /><br />If you require to make another request <a href=\"javascript:void(0);\" onclick=\"javascript:reload_form();\">click here.</a></div>");
	    }else{
	    	//add errors to form
	    	if(responceArray.title)
	    	{
	    		jQuery("#title").addClass("invalid");
	    		errors.push(responceArray.title);
	    	}
	    	if(responceArray.name)
	    	{
	    		jQuery("#name").addClass("invalid");
	    		errors.push(responceArray.name);
	    	}
	    	if(responceArray.email)
	    	{
	    		jQuery("#email").addClass("invalid");
	    		errors.push(responceArray.email);
	    	}
			if(responceArray.phone)
	    	{			
	    		jQuery("#phone").addClass("invalid");
	    		errors.push(responceArray.phone);
	    	}
	    	if(responceArray.preferred_day)
	    	{
	    		jQuery("#preferred_day").addClass("invalid");
	    		errors.push(responceArray.preferred_day);
	    	}
	    	if(responceArray.preferred_time)
	    	{
	    		jQuery("#preferred_time").addClass("invalid");
	    		errors.push(responceArray.preferred_time);
	    	}
	    }
	    var alertTxt = "";
	    for(var i = 0;i< errors.length;i++)
	    {
	    	alertTxt += errors[i] + "\n";
	    }
	    if(errors.length > 0)
	    {
	    	alert(alertTxt);    	
	    }
	}else{
		jQuery('#form-errors').val("Error while sending form, please try again.");
	}
}

function reload_form()
{
	jQuery("#bottom_box").html("Complete the information below and we will contact you at your convenience.");
	jQuery("#name").val("Your Name");
	jQuery("#email").val("Your Email Address");
	jQuery("#phone").val("Telephone Number");
	jQuery('#title').attr("value",0);
	jQuery('#preferred_day').attr("value",0);
	jQuery('#preferred_time').attr("value",0);
	jQuery("#additional_details").val("Additional Details");
	jQuery("#call-me-back-form").show();	
}