/*
if you need to display the path to user, you need to write some JavaScript like these.
*/



function getEl(el){
	if( typeof(el) === 'string') el = document.getElementById(el);
	return el;
}

//simple addEvent, buggy but works 
function addEvent(el,type,fn){
	el = getEl(el);
	var sOn = el.attachEvent ? 'on' : '';
	var wfn =  function(e){
		fn.call(el,e || window.event);
	};

	if(sOn){
	   el.attachEvent( sOn + type , wfn  );
	}else if(el.addEventListener){
	   el.addEventListener(type , wfn , false);
	};
}

//you need to sync the value when user select a new file path;
function syncFilePath(){
	this.form.elements.namedItem('my-input-file-path').value = this.value;
}

function disableFilePath(){
  this.elements.namedItem('my-input-file-path').disabled = true ;
}


function render_start(){

	var aBtn = document.getElementsByName('attach1');
	var dBtn;
	for(var i=0;dBtn = aBtn[i];i++){
		addEvent(dBtn,'change',syncFilePath);
    addEvent(dBtn.form,'submit',disableFilePath);
	};
  
	render_start = null;
}


$(function(){

jQuery.validator.addMethod("phoneUS", function(phone_number, element) {
    phone_number = phone_number.replace(/\s+/g, ""); 
	return this.optional(element) || phone_number.length > 9 &&
		phone_number.match(/^(1-?)?(\([2-9]\d{2}\)|[2-9]\d{2})-?[2-9]\d{2}-?\d{4}$/);
}, "Please specify a valid phone number");

jQuery.validator.addMethod("dateformat", function(date, element) {
 	return this.optional(element) || date.match(/(0[1-9]|1[012])[- \/.](0[1-9]|[12][0-9]|3[01])[- \/.](19|20)\d\d/);
//    return this.optional(element) || date.match(/((0*[1-9])|(1[012]))[- \/.]((0*[1-9])|[12][0-9]|3[01])[- \/.](19|20)\d\d/);
}, "Please specify a valid Date");


	$("#photoForm").validate({
		rules: {
			email: { required: true, email : true },
			firstname: { required: true },
			lastname: { required: true },
			comments: { required: true },
			city: { required: true },
			phone: { required: true, phoneUS : true },
			Wishes_To: { required: true },
			gender: { required: true },
			cele_date: { required: true, dateformat: true },
			age: { digits: true },
			attach1: { required: true, accept: "png|jpe?g|gif|tif?f" },
			rules: { required: true }
		},
		
		messages: {
			firstname: "Please enter your firstname",
			lastname: "Please enter your lastname",
			email: "Please enter a valid email address <br> No spaces or Special character are allowed.<br/>i.e: *  (  )  !  # \" \' \&",
			phone : "Please specify a Valid phone number <br>Valid Format 000-000-0000  or 000 000 0000",
			cele_date : "Please specify a Valid Date <br>Example 01/31/2010",
			city: "Please enter your city",
			Wishes_To: "Please enter Celebration Wishes To",
			comments: "Please enter Celebration Wishes From",
			age : "Please enter only digits",
			attach1 : "Please select a jpg, gif, or tif image to upload.",
			rules: "Please agree to the rules and regulations for this contest."
			}
		
		/*errorElement: "em",
		errorPlacement: function(error, element) {
			$(element).parent().addClass("error");
			$(element.form).find("label[for=" + element.id + "]").append(error);
		}*/
	});
	
});