/*
Transamerica IPO Microsite - scripts.js
Global jQuery-based Scripts
TOC:
1) JavaScript toggle (removes class="no-js" from tag)
2) Expand / Collapse for FAQs page
3) Validate
4) Calculator Tab Switcher
5) Doc ready functions
(for calculator & slider scripts, please see fd-slider.js)
*/
// 1) JavaScript toggle (removes class="no-js" from tag)
function removeJS() {
$('html').removeClass('no-js');
};
// 2) Expand / Collapse for FAQs page
function accordion(){
if (($('#faqs').is('*')) == false ) {return;} // Exit entire function if we are not on the FAQ page.
function animateNextItem(obj) { // This is the Animate function that accepts the FAQ object.
var dd = obj.next();
if(!dd.is(':animated')){ // If the title is clicked and the dd is not currently animated,
dd.slideToggle(); // start an animation with the slideToggle() method
obj.toggleClass('opened'); // and toggle the arrow so it points up or down.
}
}
$('dt').click(function(){ // When a FAQ item is Clicked,
animateNextItem($(this)); // animate its sibling tag by sending the Click to the Animate function.
});
if(window.location.hash) { // Does the URL have a FAQ Hash (#) indicator?
hash = window.location.hash;
animateNextItem($(hash)); // If so, send it to the Animate function instead of a Click.
}
};
// 3) Validate
function validate() {
// parameters for validation
var validateText = /^[a-zA-Z-]+$/;
var validateEmail = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
var validateNumber = /^[0-9.-]+$/;
// errors logic
// blank input function
function errorBlank(obj) {
obj.addClass("error-textfield"); // add red border to text field,
obj.siblings(".error").addClass("error-message"); // add "error-message" class,
obj.siblings(".error").text("Please fill in the field"); // write out error message
}
// empty dropdown function
function errorDropdownBlank(obj) {
//obj.siblings(".error").addClass("error-message"); // add "error-message" class,
obj.siblings(".error").text("Please select a state"); // write out error message
}
// invalid input function
function errorInvalid(obj) {
obj.addClass("error-textfield"); // add red border to text field;
if (obj.attr("id")=="emailAddress") { // if it's "email" field,
obj.siblings(".error").addClass("error-message"); // add "error-message" class,
obj.siblings(".error").text("Enter a valid email"); // write out error message;
} else if (obj.attr("id")=="phoneNumber"){ // if it's "phone" field,
obj.siblings(".error").addClass("error-message"); // add "error-message" class,
obj.siblings(".error").text("Enter numbers only, no space"); // write out error message;
} else { // if it's other types of text field,
obj.siblings(".error").addClass("error-message"); // add "error-message" class,
obj.siblings(".error").text("Enter letters only, no space"); // write out error message
}
}
// no error function
function errorFree(obj) {
obj.removeClass("error-textfield"); // remove red border from text fields (if there's any),
obj.siblings(".error").removeClass("error-message").text(""); // clear out error message
}
var loaded = false;
// clear out text fields & dropdown on refresh
$(':input','.contact-info').not(':button, :submit, :reset, :hidden').val('').removeAttr('checked').removeAttr('selected');
$("select option:first").attr('selected','selected');
// validate all function
function validateAll() {
var state = $("select[name=state]");
$(state).unbind('change');
if ($("#tabs .error-message").length > 0) {
if($(state).val() == "" && loaded){
errorDropdownBlank(state);
$(state).bind('change', function(e){validateAll();})
}else{
errorFree(state);
//validateAll();
}
$(".btn_calculate_my_plan").addClass("btn_calculate_my_plan_off"); // if so, deactivate "calculate" button,
} else {
if($(state).val() == ""){
errorDropdownBlank(state);
$(state).bind('change', function(e){validateAll();})
}else{
errorFree(state);
$(".btn_calculate_my_plan").removeClass("btn_calculate_my_plan_off");
}
}
}
validateAll(); // call "validate all" function (for first timer)
// logic for "first name" text field
$("input[name=firstName]").blur(function(obj) { // when user leaves the field,
var obj = $(this);
if (obj.val() == "") { // if blank,
errorBlank(obj); // call "blank" function,
validateAll(); // call "validate all" function;
} else if (!validateText.test(obj.val())) { // if text is invalid,
errorInvalid(obj); // call "invalid" function,
validateAll(); // call "validate all" function;
} else { // otherwise,
errorFree(obj); // field is good - call "error free" function,
validateAll(); // call "validate all" function
};
loaded = true;
}).keydown(function(obj) { // when user leaves the field,
if(this.value.length > 1){
var obj = $(this);
if (obj.val() == "") { // if blank,
errorBlank(obj); // call "blank" function,
validateAll(); // call "validate all" function;
} else if (!validateText.test(obj.val())) { // if text is invalid,
errorInvalid(obj); // call "invalid" function,
validateAll(); // call "validate all" function;
} else { // otherwise,
errorFree(obj); // field is good - call "error free" function,
validateAll(); // call "validate all" function
};
}
});
// logic for "last name" text field
$("input[name=lastName]").blur(function(obj) { // when user leaves the field,
var obj = $(this);
if (obj.val() == "") { // if blank,
errorBlank(obj); // call "blank" function,
validateAll(); // call "validate all" function;
} else if (!validateText.test(obj.val())) { // if text is invalid,
errorInvalid(obj); // call "invalid" function,
validateAll(); // call "validate all" function;
} else { // otherwise,
errorFree(obj); // field is good - call "error free" function,
validateAll(); // call "validate all" function
};
loaded = true;
}).keydown(function(obj) {
if(this.value.length > 1){
var obj = $(this);
if (obj.val() == "") { // if blank,
errorBlank(obj); // call "blank" function,
validateAll(); // call "validate all" function;
} else if (!validateText.test(obj.val())) { // if text is invalid,
errorInvalid(obj); // call "invalid" function,
validateAll(); // call "validate all" function;
} else { // otherwise,
errorFree(obj); // field is good - call "error free" function,
validateAll(); // call "validate all" function
};
}
});
// logic for "email" text field
$("input[name=emailAddress]").blur(function(obj) { // when user leaves the field,
var obj = $(this);
if (obj.val() == "") { // if blank,
errorBlank(obj); // call "blank" function,
validateAll(); // call "validate all" function;
} else if (!validateEmail.test(obj.val())) { // if text is invalid,
errorInvalid(obj); // call "invalid" function,
validateAll(); // call "validate all" function;
} else { // otherwise,
errorFree(obj); // field is good - call "error free" function,
validateAll(); // call "validate all" function
};
loaded = true;
});
// logic for "phone" text field
$("input[name=phoneNumber]").blur(function(obj) { // when user leaves the field,
var obj = $(this);
if (obj.val() == "") { // if blank,
errorBlank(obj); // call "blank" function,
validateAll(); // call "validate all" function;
} else if (!validateNumber.test(obj.val())) { // if text is invalid,
errorInvalid(obj); // call "invalid" function,
validateAll(); // call "validate all" function;
} else { // otherwise,
errorFree(obj); // field is good - call "error free" function,
validateAll(); // call "validate all" function
};
loaded = true;
}).keydown(function(){
if(this.value.length > 1){
var obj = $(this);
if (obj.val() == "") { // if blank,
errorBlank(obj); // call "blank" function,
validateAll(); // call "validate all" function;
} else if (!validateNumber.test(obj.val())) { // if text is invalid,
errorInvalid(obj); // call "invalid" function,
validateAll(); // call "validate all" function;
} else { // otherwise,
errorFree(obj); // field is good - call "error free" function,
validateAll(); // call "validate all" function
}
}
});
}
// 4) Calculator Tab Switcher
function tabSwitcher() {
$('#tabs section').hide(); // hide all tabs on load,
$('#tabs section:first').show(); // show first tab,
$('#tabs ul li:first').addClass('active'); // add active state
}
// 5) Doc ready functions
$(document).ready(function(){
removeJS();
accordion();
});