/*
-------------------
FORMS - SMBIZ
-------------------
*/

// validate an individual field
function validate_field(id) {
	// init
	var valid           = true;
	var string          = '';
	var label           = '';
	var format          = false;
	
	// regex
	var format_regex    = /format-(\w*)/;
	var email_regex     = /^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
	var alpha_regex     = /^[a-zA-Z]*$/;
	var alnum_regex     = /^\w*$/;
	var integer_regex   = /^\d*$/;
	var zip_regex       = /^\d{5}([\-]\d{4})?$/;
	var mmddyyyy_regex  = /^[\d{1,2}](-|\/)[\d{1,2}](-|\/)[\d{4}]$/;
	
	// get values
	var parent_class    = $("#" + id).parent().attr("class");
	var value           = $("#" + id).val();
		
	// is field empty?
	if (value == '') {
		valid  = false;
		string = 'empty';
	}
	
	// format?
	if (format_regex.test(parent_class) == true) {
		format  = true;
		matches = format_regex.exec(parent_class);
		
		// which format ---------------------------------
		if (matches.length) {
			var format = matches[1];
			
			// format email
			if (format == 'email' && value != '') {
				if (email_regex.test(value) == false) {
					valid   = false;
					string  = 'invalid email address'
				}
			}
			
			// format alnum
			if (format == 'alnum' && value != '') {
				if (alnum_regex.test(value) == false) {
					valid   = false;
					string  = 'must be alphanumeric'
				}
			}
			
			// format alpha
			if (format == 'alpha' && value != '') {
				if (alpha_regex.test(value) == false) {
					valid   = false;
					string  = 'only letters please'
				}
			}
			
			// format integer
			if (format == 'integer' && value != '') {
				if (integer_regex.test(value) == false) {
					valid   = false;
					string  = 'only numbers please'
				}
			}
			
			// format zip
			if (format == 'zip' && value != '') {
				if (zip_regex.test(value) == false) {
					valid   = false;
					string  = 'invalid zip format'
				}
			}
			
			// format mmddyyyy
			if (format == 'mmddyyyy' && value != '') {
				if (mmddyyyy_regex.test(value) == false) {
					valid   = false;
					string  = 'invalid date format'
				}
			}
		}
	}
	
	
	if (valid == false) {
		// insert error msg
		$("#" + id).parent().addClass("error").find("label > span").remove();
		$("#" + id).parent().find("img").attr("src", "/icon/exclamation.png");
		if (string != 'empty') {
			$("#" + id).parent().addClass("error").find("label").append(" <span>" + string + "</span>");
		}
		
		// return error string
		return string;
	} else {
		// remove error msg
		$("#" + id).parent().removeClass("error");
		$("#" + id).parent().addClass("valid");
		$("#" + id).parent().find("label > span").remove();
		$("#" + id).parent().find("img").attr("src", "/icon/tick.png");
		
		return valid;
	}
}

// validate entire form
function validate_form() {
	// init
	var valid  = true;
	var string = '';
	var error  = '';
	var label  = '';
	
	// hide button
	$("#btn-checkform").hide();
	
	// check coverages
	if ($("#coverage-gl").is(':not(:checked)') && 
		$("#coverage-wc").is(':not(:checked)') && 
		$("#coverage-auto").is(':not(:checked)') && 
		$("#coverage-cp").is(':not(:checked)')) {
			valid  = false;
			string = string + '<li><strong>Coverages:</strong> Please select at least one coverage option</li>\n';
	}
	
	// find all required fields and validate
	$("div[class*='field'][class*='required']").not('.valid').each(function() {
		if ($(this).attr("class")) {
			error  = validate_field($(this).attr('id'));
			label  = $(this).find("label").text();
			
			if (error != '') {
				if (error == 'empty') {
					valid  = false;
					string = string + '<li><strong>Missing:</strong> ' + label + '</li>\n';
				} else {
					valid  = false;
					string = string + '<li><strong>Invalid Format:</strong> ' + label + ' - ' + error + '</li>\n';
				}
			}
			
			// alert(label + ': ' + validate_field($(this).attr('id')));
			// reset vars
			error = '';
			label = '';
		}
	});
	
	// check current insurance carriers
	
	// check auto coverages
	if ($("#coverage-auto").is(':checked') && 
		$("#vehicle-1-coverage-liability").is(':not(:checked)') && 
		$("#vehicle-1-coverage-liability-physical").is(':not(:checked)') && 
		$("#vehicle-1-coverage-pip").is(':not(:checked)') && 
		$("#vehicle-1-coverage-um").is(':not(:checked)') && 
		$("#vehicle-1-coverage-contact").is(':not(:checked)')) {
			valid  = false;
			string = string + '<li><strong>Vehicle Coverages:</strong> Please select at least one coverage option per vehicle</li>\n';
	}
	
	// alert(string);
	
	if (!valid) {
		string = '<ul>' + string + '</ul>';
		form_response(string, 'error');
		$("#btn-checkform").show();
	} else {
		$("#btn-submit").show().find("button").before('<span style="color:green; float:left;"><img src="/icon/tick.png" alt=" width="16" height="16" /> Form is valid &nbsp; </span> ');
	}
}


// show/hide coverage divs
function toggle_coverage_divs() {
	// general liability
	if ($("input#coverage-gl").is(':checked')) {
		$("#gl-carriers").slideDown();
	} else {
		$("#gl-carriers").slideUp();
	}
	
	// workers comp
	if ($("input#coverage-wc").is(':checked')) {
		$("fieldset#wcclass").slideDown();
		$("#wc-carriers").slideDown();
	} else {
		$("fieldset#wcclass").slideUp();
		$("#wc-carriers").slideUp();
	}
	
	// business auto
	if ($("input#coverage-auto").is(':checked')) {
		$("fieldset#auto").slideDown();
		$("#auto-carriers").slideDown();
		$("#f-addmore-vehicles").slideDown();
	} else {
		$("fieldset#auto").slideUp();
		$("#auto-carriers").slideUp();
		$("#f-addmore-vehicles").slideUp();
	}
	
	// commercial property
	if ($("input#coverage-cp").is(':checked')) {
		$("fieldset#prop-1").slideDown();
		$("#cp-carriers").slideDown();
		$("#f-addmore-properties").slideDown();
	} else {
		$("fieldset#prop-1").slideUp();
		$("#cp-carriers").slideUp();
		$("#f-addmore-properties").slideUp();
	}
}

// show/hide other organization type
function toggle_org_other() {
	if ($("input#org-other").is(':checked')) {
		$("#f-org-other-name").slideDown();
	} else {
		$("#f-org-other-name").slideUp();
	}
}


// count checked boxes
function count_checked_coverages() {
	var checked = jQuery.makeArray($("input[id^='coverage']:checked"));
	return checked.length;
}


// add more fields - principals
var fields_principal_counter = 1;
function addmorefields_principals() {
	// increment the counter
	fields_principal_counter++;
	var counter = fields_principal_counter;
	
	// html markup
	var html = '<div id="f-principal-' + counter + '-name" class="field">\n'+
					'<label for="principals-' + counter + '-name-">Principal ' + counter + '</label>\n'+
					'<input type="text" class="med" id="principal-' + counter + '-name" name="principals[' + counter + '][name]" value="" />\n'+
				'</div>\n'+
				'\n'+
				'<div id="f-principal-' + counter + '-title" class="field">\n'+
					'<label for="principals-' + counter + '-title-">Title</label>\n'+
					'<input type="text" class="med" id="principal-' + counter + '-title" name="principals[' + counter + '][title]" value="" />\n'+
				'</div>\n'+
				'\n'+
				'<div id="f-principal-' + counter + '-ownership" class="field">\n'+
					'<label for="principals-' + counter + '-ownership">% Ownership</label>\n'+
					'<input type="text" class="med" id="principals' + counter + '-ownership" name="principals[' + counter + '][ownership]" value="" />\n'+
				'</div>\n';
	
	// insert the markup
	$("#f-addmore-principals").hide().before(html);
	$("#f-addmore-principals").slideDown();
}


// add more fields - wc
var fields_wc_counter = 0;
function addmorefields_wc() {
	// increment the counter
	fields_wc_counter++;
	var counter = fields_wc_counter;
	
	// html markup
	var html = '<div class="row">\n'+
				'<div id="f-wc-other-' + counter + '-name" class="field">\n'+
					'<label for="wc-other-' + counter + '-name" class="tooltip-trigger">Other Employee Class ' + counter + ' <span>Job title and/or job description</span></label>\n'+
					'<input type="text" class="med" id="wc-other-' + counter + '-name" name="wc-other[' + counter + '][name]" value="" />\n'+
				'</div>\n'+
				'<div id="f-wc-other-' + counter + '-emp" class="field format-integer">\n'+
					'<label for="wc-other-' + counter + '-emp"># Employees</label>\n'+
					'<input type="text" class="med" id="wc-other-' + counter + '-emp" name="wc-other[' + counter + '][emp]" value="" />\n'+
				'</div>\n'+
				'<div id="f-wc-other-' + counter + '-payroll" class="field">\n'+
					'<label for="wc-other-' + counter + '-payroll-">Payroll</label>\n'+
					'<input type="text" class="med" id="wc-other-' + counter + '-payroll" name="wc-other[' + counter + '][payroll]" value="" />\n'+
				'</div>\n'+
			'</div>\n'+
			'\n';
	
	// insert the markup
	$("#f-addmore-wc").hide().before(html);
	$("#f-addmore-wc").slideDown();
	jQuery.each($("label[class*='tooltip-trigger']"), function(e){
		$(this).find("img.help").remove();
		$(this).append(' <img src="/icon/help.png" alt="help" class="help" width="16" height="16" style="margin-bottom:4px;" />').hover(
			function () {
				$(this).find("span").show();
			}, 
			function () {
				$(this).find("span").hide();
			}
		);
	});
}


// add more fields - properties
var fields_properties_counter = 1;
function addmorefields_properties() {
	// increment the counter
	fields_properties_counter++;
	var counter = fields_properties_counter;
	
	// html markup
	var html = '\n'+
		'<p>&nbsp;</p>\n'+
		'\n'+
		'<fieldset id="prop-' + counter + '">\n'+
			'<legend>Property ' + counter + ' - Requested Coverage</legend>\n'+
			'<div class="row">\n'+
				'<div id="f-prop-' + counter + '-address-" class="field">\n'+
					'<label for="prop-' + counter + '-address">Street Address</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-address" name="prop[' + counter + '][address]" value="" />\n'+
				'</div>\n'+
				'<div id="f-prop-' + counter + '-sqft" class="field format-integer">\n'+
					'<label for="prop-' + counter + '-sqft">Sq. Ft.</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-sqft" name="prop[' + counter + '][sqft]" value="" />\n'+
				'</div>\n'+
				'<div id="f-prop-' + counter + '-built" class="field format-year">\n'+
					'<label for="prop-' + counter + '-built">Year Built</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-built" name="prop[' + counter + '][built]" value="" />\n'+
				'</div>\n'+
			'</div>\n'+
			'\n'+
			'<div class="row">\n'+
				'<div id="f-prop-' + counter + '-construction" class="field">\n'+
					'<label for="prop-' + counter + '-construction">Construction (Masonry, Frame, etc.)</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-construction" name="prop[' + counter + '][construction]" value="" />\n'+
				'</div>\n'+
				'<div id="f-prop-' + counter + '-stories" class="field format-integer">\n'+
					'<label for="prop-' + counter + '-stories"># of stories</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-stories" name="prop[' + counter + '][stories]" value="" />\n'+
				'</div>\n'+
				'<div id="f-prop-' + counter + '-value" class="field">\n'+
					'<label for="prop-' + counter + '-value">Building Value</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-value" name="prop[' + counter + '][value]" value="" />\n'+
				'</div>\n'+
			'</div>\n'+
			'\n'+
			'<div class="row">\n'+
				'<div id="f-prop-' + counter + '-contents" class="field">\n'+
					'<label for="prop-' + counter + '-contents">Contents</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-contents" name="prop[' + counter + '][contents]" value="" />\n'+
				'</div>\n'+
				'<div id="f-prop-' + counter + '-biee" class="field">\n'+
					'<label for="prop-' + counter + '-biee">Business Income/Extra Expense</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-biee" name="prop[' + counter + '][biee]" value="" />\n'+
				'</div>\n'+
				'<div id="f-prop-' + counter + '-hardware" class="field">\n'+
					'<label for="prop-' + counter + '-hardware">Electronic Data Processing Hardware</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-hardware" name="prop[' + counter + '][hardware]" value="" />\n'+
				'</div>\n'+
			'</div>\n'+
			'\n'+
			'<div class="row">\n'+
				'<div class="field wcclass">\n'+
					'If Over 20 Yrs Old <img src="/icon/bullet_go.png" alt="" width="16" height="16" style="margin-bottom:20px;" />\n'+
				'</div>\n'+
				'<div id="f-prop-' + counter + '-updates" class="field">\n'+
					'<label for="prop-' + counter + '-updates">Roof/HVAC/Wiring updates</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-updates" name="prop[' + counter + '][updates]" value="" />\n'+
				'</div>\n'+
				'<div id="f-prop-' + counter + '-updates-year" class="field">\n'+
					'<label for="prop-' + counter + '-updates-year">Year Updated</label>\n'+
					'<input type="text" class="med" id="prop-' + counter + '-updates-year" name="prop[' + counter + '][updates-year]" value="" />\n'+
				'</div>\n'+
			'</div>\n'+
		'</fieldset>\n';
				
	$("#f-addmore-properties").hide().before(html);
	$("#f-addmore-properties").slideDown();
}


// add more fields - drivers
var fields_drivers_counter = 1;
function addmorefields_drivers() {
	// increment the counter
	fields_drivers_counter++;
	var counter = fields_drivers_counter;
	
	// html markup
	var html = '<div class="row">\n'+
					'<div id="f-driver-' + counter + '-name" class="field">\n'+
						'<label for="driver-' + counter + '-name">Driver ' + counter + ' Name</label>\n'+
						'<input type="text" class="med" id="driver-' + counter + '-name" name="driver[' + counter + '][name]" value="" />\n'+
					'</div>\n'+
					'<div id="f-driver-' + counter + '-dob" class="field format-mmddyyyy">\n'+
						'<label for="driver-' + counter + '-dob">D.O.B.</label>\n'+
						'<input type="text" class="med" id="driver-' + counter + '-dob" name="driver[' + counter + '][dob]" value="" />\n'+
					'</div>\n'+
					'<div id="f-driver-' + counter + '-dl" class="field">\n'+
						'<label for="driver-' + counter + '-dl">D.L. State/Number</label>\n'+
						'<input type="text" class="med" id="driver-' + counter + '-dl" name="driver[' + counter + '][dl]" value="" />\n'+
					'</div>\n'+
				'</div>\n'+
				'\n';
	
	// insert the markup
	$("#f-addmore-drivers").hide().before(html);
	$("#f-addmore-drivers").slideDown();
}


// add more fields - vehicles
var fields_vehicles_counter = 1;
function addmorefields_vehicles() {
	// increment the counter
	fields_vehicles_counter++;
	var counter = fields_vehicles_counter;
	
	// html markup
	var html = '<fieldset class="nested vehicles">\n'+
				'<legend>Vehicle ' + counter + '</legend>\n'+
				'<div class="row">\n'+
					'<div id="f-vehicle-' + counter + '-vin" class="field">\n'+
						'<label for="vehicle-' + counter + '-vin">Yr/Make/Model or V.I.N.</label>\n'+
						'<input type="text" class="med" id="vehicle-' + counter + '-vin" name="vehicle[' + counter + '][vin]" value="" />\n'+
					'</div>\n'+
					'<div id="f-vehicle-' + counter + '-value" class="field">\n'+
						'<label for="vehicle-' + counter + '-value">Est. Value</label>\n'+
						'<input type="text" class="med" id="vehicle-' + counter + '-value" name="vehicle[' + counter + '][value]" value="" />\n'+
					'</div>\n'+
					'<div id="f-vehicle-' + counter + '-radius" class="field">\n'+
						'<label for="vehicle-' + counter + '-radius">Driving Radius</label>\n'+
						'<input type="text" class="med" id="vehicle-' + counter + '-radius" name="vehicle[' + counter + '][radius]" value="" />\n'+
					'</div>\n'+
				'</div>\n'+
				'\n'+
				'<div class="row">\n'+
					'<strong>Coverages</strong><br />\n'+
					'<input type="checkbox" name="vehicle[' + counter + '][coverage][]" id="vehicle-' + counter + '-coverage-lo" value="Liability Only" class="checkbox" checked="checked" />\n'+
					'<label for="individual" class="inline small">Liability Only</label>\n'+
					'\n'+
					'<input type="checkbox" name="vehicle[' + counter + '][coverage][]" id="vehicle-' + counter + '-coverage-lplus" value="Liability Plus Physical Damage" class="checkbox" />\n'+
					'<label for="partnership" class="inline small">Liability Plus Physical Damage</label>\n'+
					'\n'+
					'<input type="checkbox" name="vehicle[' + counter + '][coverage][]" id="vehicle-' + counter + '-coverage-pip" value="Personal Injury" class="checkbox" />\n'+
					'<label for="corporation" class="inline small">Personal Injury</label>\n'+
					'\n'+
					'<input type="checkbox" name="vehicle[' + counter + '][coverage][]" id="vehicle-' + counter + '-coverage-um" value="Uninsured Motorist" class="checkbox" />\n'+
					'<label for="association" class="inline small">Uninsured Motorist</label>\n'+
					'\n'+
					'<input type="checkbox" name="vehicle[' + counter + '][coverage][]" id="vehicle-' + counter + '-coverage-contact" value="Contact Me" class="checkbox" />\n'+
					'<label for="association" class="inline small">Contact Me</label>\n'+
				'</div>\n'+
			'</fieldset>\n'+
			'\n';
	
	// insert the markup
	$("#f-addmore-vehicles").hide().before(html);
	$("#f-addmore-vehicles").slideDown();
}


// onload
$(document).ready(function(){		
	// init coverage checkboxes
	if ($('#smbizapp').is('form')) {
		$("#coverage-gl").bind("click",        toggle_coverage_divs);
		$("#coverage-wc").bind("click",        toggle_coverage_divs);
		$("#coverage-auto").bind("click",      toggle_coverage_divs);
		$("#coverage-cp").bind("click",        toggle_coverage_divs);
		$("#org-other").bind("click",          toggle_org_other);
		
		// adding fields
		$("#addmore-principals").bind("click", addmorefields_principals);
		$("#addmore-properties").bind("click", addmorefields_properties);
		$("#addmore-drivers").bind("click",    addmorefields_drivers);
		$("#addmore-vehicles").bind("click",   addmorefields_vehicles);
		$("#addmore-wc").bind("click",         addmorefields_wc);
		
		// reset form
		$("#btn-reset button").click(function(){
			$(this).reset();
		});
	}
	
	// attach validation to required and formatted fields
	$("div[class*='field'][class*='required']").
		find(":input").
		unbind().
		bind("focus", function(e){
			$(this).toggleClass('field-focus');
		}).
		bind("blur", function(e){
			$(this).toggleClass('field-focus');
			validate_field($(this).attr('id'));
			// alert('blurred away from ' + $(this).attr('id'));
		});
	
	// bind validation to form submit
	$("#btn-submit button").click(function(){ 
		SubmitForm($(this));
	});
});