$.validator.setDefaults({
	submitHandler: function() {
		alert("submitted! (skipping validation for cancel button)");
	}
});

$(document).ready(function() {
	
	document.getElementById('member.prefix').focus();
	
	if ($('#nameVersion table:gt(0)').length!=0 && $('#nameVersion table:gt(0)').length!=4){
		$("#addNameVerAnoth").css("display","block");
	}
	if ($('#addressInfo table:gt(0)').length!=0 && $('#addressInfo table:gt(0)').length!=4){
		$("#addAddressInfoAnoth").css("display","block");
	}
	if ($('#nameVersion table:gt(0)').length!=0){
		$("#addNameVer").find("img").attr("src","../common/images/btn_minus.gif");
	}
	if ($('#addressInfo table:gt(0)').length!=0){
		$("#addAddressInfo").find("img").attr("src","../common/images/btn_minus.gif");
	}
	$('.help').bind('click',function(){
		$(this).nextAll().remove();
		$('.addArea .tipsTemplate').remove();
		var clone = $('.tipsTemplate').clone().insertAfter($(this)).fadeIn('slow');
		clone.find('p').html(clone.find('p').html().replace('{$text}',$(this).html()));
		$('.closeWin').bind('click',function(){
			$(this).parent().fadeOut('slow');
		});
	});	
	$('.what').bind('click',function(){
		var helpEle=$(this).parent().parent().find('.help');
		$(this).nextAll().remove();
		$('.addArea .tipsTemplate').remove();
		var clone = $('.tipsTemplate').clone().insertAfter(helpEle).fadeIn('slow');
		clone.find('p').html(clone.find('p').html().replace('{$text}',helpEle.html()));
		$('.closeWin').bind('click',function(){
			$(this).parent().fadeOut('slow');
		});

	});

	//-----add NameVersion
	var nameVer = jQuery.format($(".addNameVerTemplate").html());
	function addNameVer() {
		$('.addArea').css({'position':'static'});
		$(nameVer(i++)).appendTo("#nameVersion");
		$('.addArea').css({'position':'relative'});
		rebindAllNameRemoveAnchor();
		rebindAllNameDynaField();
	}
	function removeNameVer() {
		$('.addArea').css({'position':'static'});
		$(this).parent().parent().parent().parent().parent().remove();
		$('.addArea').css({'position':'relative'});
		rebindAllNameDynaField();
	}
	function rebindAllNameRemoveAnchor() {
		$('.removeNameVer').bind('click',removeNameVer);
	}
	function rebindAllNameDynaField() {
		for (var k=1;k<=$('#nameVersion table:gt(0)').length ;k++ ){
			if (k==1) $('#nameVersion table:eq('+k+') .SubHeader').text("Second Name");
			if (k==2) $('#nameVersion table:eq('+k+') .SubHeader').text("Third Name");
			if (k==3) $('#nameVersion table:eq('+k+') .SubHeader').text("Fourth Name");
			if (k==4) $('#nameVersion table:eq('+k+') .SubHeader').text("Fifth Name");
			$('#nameVersion table:eq('+k+') label').each(function(){
				if ($(this).attr('for')!=""){
					$(this).attr({'for':$(this).attr('for').slice(0,$(this).attr('for').length-1)+k});
				}
			});
			$('#nameVersion table:eq('+k+')').find("input,select").each(function(){
				if ($(this).attr('id')!=""){
					$(this).attr({'id':$(this).attr('id').slice(0,$(this).attr('id').length-1)+k,
								'name':$(this).attr('id').slice(0,$(this).attr('id').length-1)+k});
				}
			});
		}
	}
	$('#addNameVer').bind('click',function(){
		if ($('#nameVersion table:gt(0)').length==0){
			$("#addNameVerAnoth").css("display","block");
			$("#closeAddName").css("display","block");
		}
		i = $('#nameVersion table:gt(0)').length + 1;
		addNameVer();
		if ($('#nameVersion table:gt(0)').length>3){
			$("#addNameVer").parent().parent().css("display","none");
		}
	});

	$('#addNameVerAnoth').bind('click',function(){
		i = $('#nameVersion table:gt(0)').length + 1;
		addNameVer();
		if ($('#nameVersion table:gt(0)').length==4){
			//alert("You can only add 5 Names.");
			$("#addNameVerAnoth").css("display","none");
			return false;
		}

	});

	// Init name bind
	rebindAllNameRemoveAnchor();
	rebindAllNameDynaField();

	//
	$('#closeAddName').bind('click',function(){
		//open
		if($('#nameVersion table:gt(0)').css("display")=="none"){
			if ($.browser.msie) {
				$('#closeAddName').find('img').css('filter','');
			}else{
				$('#closeAddName').find('img').attr('src','../common/images/ico_arrow_down.gif');
			}
			
			$('#nameVersion table:gt(0)').css('display','block');
			$(this).find("span").text('close');
				if($('#nameVersion table:gt(0)').length>0 && $('#nameVersion table:gt(0)').length<4){
					$("#addNameVer").parent().parent().css("display","block");
				}else{
					$("#addNameVer").parent().parent().css("display","none");
				}
		}
		//close
		else{
			if ($.browser.msie) {
				$('#closeAddName').find('img').css('filter','flipv');
			}else{
				$('#closeAddName').find('img').attr('src','../common/images/ico_arrow_up.gif');
			}
			$('#nameVersion table:gt(0)').css('display','none');
			$(this).find("span").text('open');
			$("#addNameVer").parent().parent().css("display","none");

		}
	});


	//-----add AddressInfo
	var addressInfo = jQuery.format($(".addressInfoTemplate").html());
	function addAddressInfo() {
		$('.addArea').css({'position':'static'});
		$(addressInfo(j++)).appendTo("#addressInfo");
		$('.addArea').css({'position':'relative'});
		rebindAllAddressRemoveAnchor();
		rebindAllAddressDynaField();
		rebindAllZipCodeMask();
	}
	function removeAddressInfo() {
		$(this).parent().parent().parent().parent().parent().remove();
		rebindAllAddressDynaField();
	}
	function rebindAllAddressRemoveAnchor() {
		$('.removeAddress').bind('click',removeAddressInfo);
	}
	function rebindAllAddressDynaField() {
		for (var k=1;k<=$('#addressInfo table:gt(0)').length ;k++ ){
			if (k==1) $('#addressInfo table:eq('+k+') .SubHeader').text("Second Address");
			if (k==2) $('#addressInfo table:eq('+k+') .SubHeader').text("Third Address");
			if (k==3) $('#addressInfo table:eq('+k+') .SubHeader').text("Fourth Address");
			if (k==4) $('#addressInfo table:eq('+k+') .SubHeader').text("Fifth Address");
			$('#addressInfo table:eq('+k+') label').each(function(){
				if ($(this).attr('for')!=""){
					var id = $(this).attr('for');
					$(this).attr({'for':id.substring(0,id.indexOf('[')+1)+k+id.substring(id.indexOf(']'))});
				}
			});
			$('#addressInfo table:eq('+k+')').find("input,select").each(function(){
				if ($(this).attr('id')!=""){
					var id = $(this).attr('id');
					$(this).attr({'id':id.substring(0,id.indexOf('[')+1)+k+id.substring(id.indexOf(']')),
								'name':id.substring(0,id.indexOf('[')+1)+k+id.substring(id.indexOf(']'))});
				}
			});
		}
	}
	function rebindAllZipCodeMask() {
		/*
		$("[id$='zipCode']").unmask();
		$("[id$='zipCode']").mask("99999");
		*/
	}
	$('#addAddressInfo').bind('click',function(){
		if ($('#addressInfo table:gt(0)').length==0){
		$("#addAddressInfoAnoth").css("display","block");
		$("#closeAddAddress").css("display","block");
		
		}
		j = $('#addressInfo table:gt(0)').length + 1;
		addAddressInfo();
		if ($('#addressInfo table:gt(0)').length>3){
			$("#addAddressInfo").parent().parent().css("display","none");
		}

	});

	$('#addAddressInfoAnoth').bind('click',function(){
		j = $('#addressInfo table:gt(0)').length + 1;
		addAddressInfo();
		if ($('#addressInfo table:gt(0)').length==4){
			$("#addAddressInfoAnoth").css("display","none");
			//alert("You can only add 5 addresses.");
			return false;
		}
	});

	// Init address bind
	rebindAllAddressRemoveAnchor();
	rebindAllAddressDynaField();
	rebindAllZipCodeMask();
	
	
	$('#closeAddAddress').bind('click',function(){
		//open
		if($('#addressInfo table:gt(0)').css("display")=="none"){
			if ($.browser.msie) {
				$('#closeAddAddress').find('img').css('filter','');
			}else{
				$('#closeAddAddress').find('img').attr('src','../common/images/ico_arrow_down.gif');
			}
			$('#addressInfo table:gt(0)').css('display','block');
			$(this).find("span").text('close');
			if($('#addressInfo table:gt(0)').length>0 && $('#addressInfo table:gt(0)').length<4){
					$("#addAddressInfo").parent().parent().css("display","block");
			}else{
					$("#addAddressInfo").parent().parent().css("display","none");
			}
		}
		//close
		else{
			if ($.browser.msie) {
				$('#closeAddAddress').find('img').css('filter','flipv');
			}else{
				$('#closeAddAddress').find('img').attr('src','../common/images/ico_arrow_up.gif');
			}
			$('#addressInfo table:gt(0)').css('display','none');
			$(this).find("span").text('open');
			$("#addAddressInfo").parent().parent().css("display","none");
		}
	});




	// Initial verify code gen button
	$("#verifyCodeGenButton").click(verifyCodeGenHandler);
	
	function verifyCodeGenHandler() {
		if($.browser.msie){
			$("#verifyCodeImg").parent().load("randVerifyCodeImageJsp.action");
		}else{
			$("#verifyCodeImg").attr("src", "randVerifyCodeImage.action?" + Math.random());
		}
		/*
		$.getJSON(
			'verifyCodeGenAjax.action',
			function(data) {
				if (!data.success) {
					alert("Regen verify code error.");
					return;
				}
				var verifyCode = data.data;
				$("#verifyCodeDisplay").text(verifyCode);
			}
		);
		*/
	}
	
	
	// Validate when submit form
	$("#memberForm").bind("submit", function() {
		if($('#nameVersion table:gt(0)').length>0){
		$('#nameVersion table:gt(0)').css('display','block');
		$('#closeAddName').find('span').text('close');
		}
		if($('#nameVersion table:gt(0)').length<4){
		$("#addNameVer").parent().parent().css("display","block");
		}
		if($('#addressInfo table:gt(0)').length>0){
		$('#addressInfo table:gt(0)').css('display','block');
		$('#closeAddAddress').find('span').text('close');
		}
		if($('#addressInfo table:gt(0)').length<4){
		$("#addAddressInfo").parent().parent().css("display","block");
		}

		$("#summary ul li.serverError").remove();
	});
	var container = $('div.summary');
	var validator = $("#memberForm").validate({
		debug: true,
		errorClass:'red',
		errorContainer: container,
		errorLabelContainer: $("ul", container),
		submitHandler: function(form) {
	   		form.submit();
	   	},
		highlight:function(element, errorClass) {
			$("#memberForm").find("label[for='" + element.id + "']").addClass(errorClass);
		},
		unhighlight: function(element, errorClass) {
     		$("#memberForm").find("label[for='" + element.id + "']").removeClass(errorClass);
  		},
		wrapper: 'li',
		rules: {
			"member.firstName" : {required:true, maxlength:20},
			"member.firstName1" : {required:true, maxlength:20},
			"member.firstName2" : {required:true, maxlength:20},
			"member.firstName3" : {required:true, maxlength:20},
			"member.firstName4" : {required:true, maxlength:20},
			"member.lastName" : {required:true, maxlength:20},
			"member.lastName1" : {required:true, maxlength:20},
			"member.lastName2" : {required:true, maxlength:20},
			"member.lastName3" : {required:true, maxlength:20},
			"member.lastName4" : {required:true, maxlength:20},
			"addressList.address1[0]" : {required:true, maxlength:80},
			"addressList.address1[1]" : {required:true, maxlength:80},
			"addressList.address1[2]" : {required:true, maxlength:80},
			"addressList.address1[3]" : {required:true, maxlength:80},
			"addressList.address1[4]" : {required:true, maxlength:80},
			"addressList.city[0]" : {required:true, maxlength:20},
			"addressList.city[1]" : {required:true, maxlength:20},
			"addressList.city[2]" : {required:true, maxlength:20},
			"addressList.city[3]" : {required:true, maxlength:20},
			"addressList.city[4]" : {required:true, maxlength:20},
			"addressList.state[0]" : {required:true},
			"addressList.state[1]" : {required:true},
			"addressList.state[2]" : {required:true},
			"addressList.state[3]" : {required:true},
			"addressList.state[4]" : {required:true},
			"addressList.zipCode[0]" : {required:true, digits:true, rangelength:[5,5]},
			"addressList.zipCode[1]" : {required:true, digits:true, rangelength:[5,5]},
			"addressList.zipCode[2]" : {required:true, digits:true, rangelength:[5,5]},
			"addressList.zipCode[3]" : {required:true, digits:true, rangelength:[5,5]},
			"addressList.zipCode[4]" : {required:true, digits:true, rangelength:[5,5]},
			"member.fnamesub" : {required:true, maxlength:20},
			"member.lnamesub" : {required:true, maxlength:20},
			"member.relate" : {required:true},
			"member.email" : {required:true, email:true, maxlength:40},
			"confirmEmail" : {required:true, equalTo:'[id=member.email]'},
			"verify_code" : {required:true}
		},
		messages:{
			"member.firstName" : "Please enter Individual's First Name in 1-20 characters",
			"member.firstName1" : "Please enter Individual's First Name(Second) in 1-20 characters",
			"member.firstName2" : "Please enter Individual's First Name(Third) in 1-20 characters",
			"member.firstName3" : "Please enter Individual's First Name(Fourth) in 1-20 characters",
			"member.firstName4" : "Please enter Individual's First Name(Fifth) in 1-20 characters",
			"member.lastName" : "Please enter Individual's Last Name in 1-20 characters",
			"member.lastName1" : "Please enter Individual's Last Name(Second) in 1-20 characters",
			"member.lastName2" : "Please enter Individual's Last Name(Third) in 1-20 characters",
			"member.lastName3" : "Please enter Individual's Last Name(Fourth) in 1-20 characters",
			"member.lastName4" : "Please enter Individual's Last Name(Fifth) in 1-20 characters",
			"addressList.address1[0]" : "Please enter Individual's Address in 1-80 characters",
			"addressList.address1[1]" : "Please enter Individual's Address(Second) in 1-80 characters",
			"addressList.address1[2]" : "Please enter Individual's Address(Third) in 1-80 characters",
			"addressList.address1[3]" : "Please enter Individual's Address(Fourth) in 1-80 characters",
			"addressList.address1[4]" : "Please enter Individual's Address(Fifth) in 1-80 characters",
			"addressList.city[0]" : "Please enter Individual's City in 1-20 characters",
			"addressList.city[1]" : "Please enter Individual's City(Second) in 1-20 characters",
			"addressList.city[2]" : "Please enter Individual's City(Third) in 1-20 characters",
			"addressList.city[3]" : "Please enter Individual's City(Fourth) in 1-20 characters",
			"addressList.city[4]" : "Please enter Individual's City(Fifth) in 1-20 characters",
			"addressList.state[0]" : "Please select Individual's State",
			"addressList.state[1]" : "Please select Individual's State(Second)",
			"addressList.state[2]" : "Please select Individual's State(Third)",
			"addressList.state[3]" : "Please select Individual's State(Fourth)",
			"addressList.state[4]" : "Please select Individual's State(Fifth)",
			"addressList.zipCode[0]" : "Please enter Individual's Zip Code in 5 digits",
			"addressList.zipCode[1]" : "Please enter Individual's Zip Code(Second) 5 digits",
			"addressList.zipCode[2]" : "Please enter Individual's Zip Code(Third) 5 digits",
			"addressList.zipCode[3]" : "Please enter Individual's Zip Code(Fourth) 5 digits",
			"addressList.zipCode[4]" : "Please enter Individual's Zip Code(Fifth) 5 digits",
			"member.fnamesub" : "Please enter your First Name in 1-20 characters",
			"member.lnamesub" : "Please enter your Last Name in 1-20 characters",
			"member.relate" : "Please your relationship to the Individual",
			"member.email" : {
				required : "Please enter your Email",
				email: "Invalid email format",
				maxlength: "Email's maxlength is 40"
			},
			"confirmEmail" : "Re-enter email must equal Email",
			"verify_code" : "Enter characters"
		}
	});
});
