// When the page is ready, connect the events
$(document).ready( function(){ PetcietyForms.init(); });

var PetcietyForms = {};

PetcietyForms.init = function()
{
		
	// Initialize any forms
	if($("#registrationform").length > 0){PetcietyForms.initPersonalProfileForm("registrationform");}
	if($("#profileform").length > 0){
		jQuery.validator.addMethod("zipcode", function(zip) {
			// matches US ZIP code
			// allow either five digits or nine digits with an optional '-' between
			zip = zip.replace(/^\s+/, "");
			zip = zip.replace(/\s+$/, "");

			if(zip.length == 0) { return true; }
			if(zip.match(/^\d{5}([- ]?\d{4})?$/)) { return true; }
			return false;
			}, "Please specify a valid US ZIP code");
	
		PetcietyForms.initPersonalProfileForm("profileform");
		
	}
	if($("#petform").length > 0){PetcietyForms.initPetForm("petform");}
	if($("#jobform").length > 0){PetcietyForms.initJobForm("jobform");}
	if($("#servicesform").length > 0){PetcietyForms.initServicesForm("servicesform");}
	if($("#login_form").length > 0){PetcietyForms.initLoginForm();}
}

PetcietyForms.initLoginForm = function(  )
{
	$("input[name=username]").focus( function() { 
		var _current = $("input[name=username]").val();
		if(_current == 'Username') 
		{
			$("input[name=username]").val('');
		}
	});
	$("input[name=password]").focus( function() { 
		var _current = $("input[name=password]").val();
		if(_current == 'Password') 
		{
			$("input[name=password]").val('');
		}
	});
	$('input').keydown(function(e){
        if (e.keyCode == 13) {
            $(this).parents('form').submit();
            return false;
        }
    });
}

PetcietyForms.initPersonalProfileForm = function( formId )
{
	// Remove designated input titles (google toolbar autofill can conflict with jquery validation)
	$("input.remove_title").attr("title", "");
	
	// Set up the custom checkboxes
	//$('input[safari]:checkbox').checkbox({cls:'jquery-safari-checkbox'});
	
	// Reset the validations on cleanup
	$("#"+formId).bind('reset', function(event){$('label').removeClass('error').removeClass("checked"); $('div.formFieldError').remove() } );
	
	
	// validate signup form on keyup and submit 
    var validator = $("#"+formId).validate({ 
        rules: { 
            title: "required", 
            fname: "required", 
            lname: "required", 
            address1: "required", 
            city: "required", 
            state: "required", 
            zip: 
            {
            	required: true,
            	zipcode: true
            },
            email: { 
                required: function(element) {  return $("#action_type").val() != "update";  },
                email: true, 
                remote: "/ws/checkemail" 
            }, 
            username: { 
                required: function(element) {  return $("#action_type").val() != "update";  },
                minlength: 6, 
                remote: "/ws/checkusername" 
            }, 
            password: { 
                required: function(element) {  return $("#action_type").val() != "update";  }, 
                minlength: 6 
            }, 
            password_confirm: { 
                required: function(element) {  return $("#password").val().length > 0;  }, 
                minlength: 6, 
                equalTo: "#password" 
            }
        }, 
        messages: { 
            title: "Select a title", 
            firstname: "Enter your first name", 
            lastname: "Enter your last name", 
            address1: "Enter your address", 
            city: "Enter your city", 
            state: "Enter your state", 
            zip: { 
                required: "Enter a zip code", 
                zipcode: "Enter a valid zip code" 
            }, 
            email: { 
                required: "Please enter a valid email address", 
                remote: jQuery.format("{0} is already in use") 
            }, 
            username: { 
                required: "Enter a username", 
                minlength: jQuery.format("Enter at least {0} characters"), 
                remote: jQuery.format("{0} is already in use") 
            }, 
            password: { 
                required: "Provide a password", 
                rangelength: jQuery.format("Enter at least {0} characters") 
            }, 
            password_confirm: { 
                required: "Repeat your password", 
                minlength: jQuery.format("Enter at least {0} characters"), 
                equalTo: "Enter the same password as above" 
            } 
        }, 
        // the errorPlacement has to take the table layout into account 
        errorPlacement: function(error, element) { 
       //     if ( element.is(":radio") ) 
       //         error.appendTo( element.parent().next().next() ); 
       //     else if ( element.is(":checkbox") ) 
       //         error.appendTo ( element.next() ); 
       //     else 
                error.insertAfter( element ); 
                element.parent().parent().find('label').removeClass('checked').addClass("error");
                var _parent1 = element.parent();
                var _parent2 = _parent1.parent();
                var _label = _parent2.find('label')
       //		error.appendTo( element.parent().next() ); 
        }, 
        errorClass: "formFieldError",
        errorElement: "div",
        
        // specifying a submitHandler prevents the default submit, good for the demo 
       // submitHandler: function() { 
       //     alert("submitted!"); 
       // }, 
        // set this class to error-labels to indicate valid fields 
        success: function(label) { 
            // set   as text for IE 
            label.html(" ").addClass("checked").hide(); 
            label.parent().parent().find('label').removeClass('error').addClass("checked");
            label.remove();
        } 
    }); 

}
PetcietyForms.initJobForm = function( formId )
{
	Date.format = 'mm/dd/yyyy';
	$('#start-date').datePicker().val($('#start-date').val()).trigger('change');
    $('#end-date').datePicker().val($('#end-date').val()).trigger('change');
    $('#start-date').bind('change', function() { 
    	$('#end-date').dpSetStartDate($('#start-date').val()); 
    	start = Date.fromString($('#start-date').val());
    	end = Date.fromString($('#end-date').val());	
    	if(start > end)
    	{
    		$('#end-date').datePicker().val($('#start-date').val()).trigger('change');
    	}
    } );
    
	// Remove designated input titles (google toolbar autofill can conflict with jquery validation)
	$("input").addClass("remove_title");
	$("input.remove_title").attr("title", "");

	// Reorder/cleanup the options list
	$('option[@value=US]').insertAfter("#travel_country option:first");
	$('option[@value=GS]').html("So. Georgia/So. Sandwich Islands")
	$('option[@value=HM]').html("Heard Island/McDonald Islands")
	$('option[@value=UM]').html("US Minor Outlying Islands")
	
	
	// Hook up the travel input actions
	$("#travel_country").bind('change', function(event){
		_val = $("#travel_country").val()
		if(_val == 'US') 
		{ 
			$("select#travel_state").disabled = false; 
			$("div#state_container").show("fast"); 
		} 
		else 
		{ 
			$("select#travel_state").disabled = true;
			$("div#state_container").hide("fast");
		} 
		if(typeof _val == "undefined" || _val == '')  $("div#city_container").hide("fast"); 
		else 
		{ 
			if ($("div#city_container").is(":hidden"))  $("div#city_container").show("fast");
	    	
		}
	}).trigger('change');
	
	//
		// Reset the validations on cleanup
	$("#"+formId).bind('reset', function(event){$('label').removeClass('error').removeClass("checked"); $('div.formFieldError').remove() } );
	
	// validate signup form on keyup and submit 
    var validator = $("#"+formId).validate({ 
        rules: { 
            name: "required", 
            travel_country: "required", 
            "travel_state": {  required: function(element) {   return $("#travel_country").val() == "US";  }  } , 
            "travel_city": {  required: function(element) {   return $("#travel_country").val() != "";  }  } , 
            "start-date": { required: true, date: true } , 
            "end-date": { required: true, date: true } , 
            "service-levels[]": "required", 
            "locations[]": "required",
            "services[]": "required",
            "pets[]": "required"
            
        }, 
        messages: { 
            name: "Enter a Job Title", 
            travel_country: "Select the travel country", 
            "travel_state": "Select the travel state", 
            "travel_city": "Select the travel city", 
            "start-date": "Enter a valid start date", 
            "end-date": "Enter a valid end date", 
            "service-levels[]": "Select at least one level of service", 
            "locations[]": "Select at least one location",
            "services[]": "Select at least one services",
            "pets[]": "Select at least one pet"
        
        }, 
        // the errorPlacement has to take the table layout into account 
        errorPlacement: function(error, element) { 
         		var _error_holder = element.parent().parent().find('.errorHolder');
         		_error_holder.append(error);       
       
       	}, 
        errorClass: "formFieldError",
        errorElement: "div"
    }); 
	
}

PetcietyForms.initPetForm = function( formId )
{
	// Remove designated input titles (google toolbar autofill can conflict with jquery validation)
	$("input.remove_title").attr("title", "");
	
	// Hook up the select actions
	$("#species_id").change(function() 
    { 
        var _species_id = $("#species_id").val(); 
        
        if (_species_id == "255")  $("#other_species").show(); 
        else $("#other_species").hide();
        
        if (_species_id == "1")  $("#socialization-field").show(); 
        else $("#socialization-field").hide();
        
    }).trigger('change'); 
    
    
	// Reset the validations on cleanup
	$("#"+formId).bind('reset', function(event){$('label').removeClass('error').removeClass("checked"); $('div.formFieldError').remove() } );
	
	// validate signup form on keyup and submit 
    var validator = $("#"+formId).validate({ 
        rules: { 
            name: "required", 
            species_id: "required", 
            age: { required: true, digits: true } , 
            pet_temperament_id: "required", 
            pet_activity_level_id: "required"
            
        }, 
        messages: { 
            name: "Enter your pet's name", 
            species_id: "Select a species", 
            age: { 
                required: "Enter your pets age", 
                digits: "Enter only numeric characters" 
            }, 
            pet_temperament_id: "Select a temperament", 
            pet_activity_level_id: "Select an activity level"
        }, 
        // the errorPlacement has to take the table layout into account 
        errorPlacement: function(error, element) { 
       //     if ( element.is(":radio") ) 
       //         error.appendTo( element.parent().next().next() ); 
       //     else if ( element.is(":checkbox") ) 
       //         error.appendTo ( element.next() ); 
       //     else 
               error.insertAfter( element ); 
                element.parent().parent().find('label').removeClass('checked').addClass("error");
                var _parent1 = element.parent();
                var _parent2 = _parent1.parent();
                var _label = _parent2.find('label')
       //		error.appendTo( element.parent().next() ); 
        }, 
        errorClass: "formFieldError",
        errorElement: "div",
        
        // specifying a submitHandler prevents the default submit, good for the demo 
        //submitHandler: function() { 
       //     alert("submitted!"); 
       // }, 
        // set this class to error-labels to indicate valid fields 
        success: function(label) { 
            // set   as text for IE 
            label.html(" ").addClass("checked").hide(); 
            label.parent().parent().find('label').removeClass('error').addClass("checked");
            label.remove();
        } 
    }); 


}

PetcietyForms.initServicesForm = function( formId )
{
	// Remove designated input titles (google toolbar autofill can conflict with jquery validation)
	$("input.remove_title").attr("title", "");
	
	// Set up the custom checkboxes
	//$('input[safari]:checkbox').checkbox({cls:'jquery-safari-checkbox'});
	
	
    // Hook up the professional status radios
    $("#prof_level_1").click(function() 
    {
    	$(".professional-field").show();
    	$('.inline-no-pay-rate').removeClass('inline-no-pay-rate').addClass('inline-pay-rate');
    	$('.block-no-pay-rate').removeClass('block-no-pay-rate').addClass('block-pay-rate');
    	if($('#onsite-service').attr('checked') ) $("#onsite_service_rate_box").css('display', "inline");
    	if($('#offsite-service').attr('checked') ) $("#offsite_service_rate_box").css('display', "inline");
     });
    $("#prof_level_2").click(function() 
    {
        $(".professional-field").hide();
        $(".nonprofessional-field").show();
    	$('.inline-no-pay-rate').removeClass('inline-no-pay-rate').addClass('inline-pay-rate');
    	$('.block-no-pay-rate').removeClass('block-no-pay-rate').addClass('block-pay-rate');
    	if($('#onsite-service').attr('checked') ) $("#onsite_service_rate_box").css('display', "inline");
    	if($('#offsite-service').attr('checked') ) $("#offsite_service_rate_box").css('display', "inline");
    });
    $("#prof_level_3").click(function() 
    {
        $(".professional-field").hide();
    	$('.inline-pay-rate').removeClass('inline-pay-rate').addClass('inline-no-pay-rate');
    	$('.block-pay-rate').removeClass('block-pay-rate').addClass('block-no-pay-rate');
    	if($('#onsite-service').attr('checked') ) $("#onsite_service_rate_box").css('display', "none");
    	if($('#offsite-service').attr('checked') ) $("#offsite_service_rate_box").css('display', "none");
     });
    
    
    // Hookup the onsite rate field
    $("#onsite-service").click(function() 
    { 
    	var _display = $('#onsite-service').attr('checked') ? 'none' : 'inline';
    	$("#onsite_service_rate_box").css('display', _display);
    });
	// Hookup the offsite rate field
     $("#offsite-service").click(function() 
    { 
    	var _display = $('#offsite-service').attr('checked') ? 'none' : 'inline';
    	$("#offsite_service_rate_box").css('display', _display);
    	$("#offsite_service_details").css('display', _display);
    });
	
    
}