/* global _ grecaptcha */
var onEnqForm
((function(oef) {
oef.helpers = {}
oef.scrollQueue = [];
// Bound to the "Start Form" button, hides intro, shows main form
oef.helpers.triggerFormStart = function() {
var formEl = $(this).parents('form')
$(formEl)
.find('#form_intro_text')
.addClass('hide')
.end()
.find('#main_form_contents')
.show()
$(formEl)
.siblings('h1')
.addClass('hide')
}
// Opposite of oef.trigerFormStart. Hides main form content and displays the intro
oef.helpers.gotoBeginning = function(lnk) {
var formEl = $(lnk).parents('form')
$(formEl)
.find('#form_intro_text')
.removeClass('hide')
.end()
.find('#main_form_contents')
.hide()
$(formEl)
.siblings('h1')
.removeClass('hide')
$('.sq-form-section').addClass('hide')
$('.sq-form-section:first').removeClass('hide')
}
// A simple, show this div if this checkbox selection was selected
oef.helpers.displayDivOnCheck = function(args) {
var $input = $(args.input)
var divSelector = $input.data('display')
$input.on('change', function() {
if ($input.is(':checked')) {
$(divSelector).removeClass('hide')
} else {
$(divSelector).addClass('hide')
}
})
}
// a simple, show this div if this radio button is selected
/* oef.helpers.displayDivOnRadio = function(args) {
var $input = $(args.input)
var divSelector = $input.data('display')
$('[name="' + $input.attr('name') + '"]').on('change', function() {
if ($(this).attr('id') === $input.attr('id')) {
$(divSelector).removeClass('hide')
} else {
$(divSelector).addClass('hide')
}
})
}*/
oef.helpers.displayDivOnRadio = function(args) {
var $inputs = $(args.input).find(':radio,:checkbox.act-as-radio')
var allSelectors = _.chain($inputs)
.map(function(el) {
return typeof $(el).data('display') === 'undefined' ? '' : $(el).data('display').split(',')
})
.flatten()
.uniq()
.compact()
.value()
$inputs.on('change', function() {
var displayDiv = $(this).data('display')
console.log('displayDiv', displayDiv)
if (typeof displayDiv === 'undefined') {
$(allSelectors.join(',')).find('input:text').each(function(i,e){ $(e).val('') })
$(allSelectors.join(',')).addClass('hide')
} else if ($(this).is(':checked')) {
$(displayDiv).removeClass('hide')
$(_.difference(allSelectors, displayDiv.split(',')).join(',')).addClass('hide')
} else {
$(displayDiv).find('input:text').each(function(i,e){ $(e).val('') })
$(displayDiv).addClass('hide')
}
})
}
// a simple, show this div if any child radio button is selected
//oef.helpers.displayDivOnSelection = function(args) {
// var $selector = $(args.selector)
// var divSelector = $selector.data('display')
// $selector.find('input:radio').on('change', function() {
// $(divSelector).removeClass('hide')
// })
//}
// display a div when this question has been answered
oef.helpers.displayOnAnswer = function(args) {
var $el = $(args.el)
var inputs = $el.find('input')
var divSelector = $el.data('display')
console.log('inputs', inputs)
$(inputs).on('change', function() {
console.log('changed')
switch ($(_.first(inputs)).attr('type')) {
case 'text':
if ($(_.first(inputs)).val() === '') {
$(divSelector).addClass('hide')
} else {
$(divSelector).removeClass('hide')
}
break
case 'radio':
case 'checkbox':
if ($(inputs).is(':checked')) {
$(divSelector).removeClass('hide')
} else {
$(divSelector).addClass('hide')
}
break
// no default
}
})
}
// make set of checkboxes OR only (useful in cases where you want, either option or no option)
oef.helpers.checkOr = function(args) {
var $el = $(args.el)
$el.on('change', function() {
$(':checkbox[name="' + $el.attr('name') + '"]:not(#' + $el.attr('id') + ')')
.prop('checked', false)
})
}
// Display the button for the Next Section
oef.helpers.displayNextSectionButton = function(section) {
$(section).find('a.next-section').removeClass('hide')
oef.helpers.scrollToElementBottom($(section).find('a.next-section'))
}
// Hides the button for the Next Section
oef.helpers.hideNextSectionButton = function(section) {
$(section).find('a.next-section').addClass('hide')
}
// Scroll to the bottom of an element
oef.helpers.scrollToElementBottom = function(element) {
var $el
if (_.isString(element)) { // if its a String, find it
$el = $(element)
} else if (element instanceof jQuery) {
$el = element
} else { // otherwise its a question
$el = $('.sq-form-question[data-question="' + element.id + '"]')
}
if ($el.length > 0) {
var bottomOfDiv = $el.position().top + $el.height()
// Dont scroll if the element is completely in the viewport OR if the window is below the top of the element
if (!($el.visible(false, true) || ($el.position().top < $(window).scrollTop()))) {
oef.scrollQueue.unshift(bottomOfDiv - $(window).height() + 15)
}
}
}
// Scroll to the top of an element
oef.helpers.scrollToElementTop = function(element) {
var $el
if (_.isString(element)) { // if its a String, find it
$el = $(element)
} else if (element instanceof jQuery) {
$el = element
} else { // otherwise its a question
$el = $('.sq-form-question[data-question="' + element.id + '"]')
}
if ($el.length > 0) {
oef.scrollQueue.unshift($el.position().top)
}
}
// execute Scroll Queue, we only run the first one as we dont care about the others.
oef.helpers.executeScrollQueue = function() {
var s = _.first(oef.scrollQueue)
$('html,body').animate({ scrollTop: s }, 400)
oef.scrollQueue = []
}
// Validate the form and then hit the special Squiz submit button
oef.submitForm = function(lnk, event) {
if ($(lnk).is('.disabled')) {
event.stopPropagation()
event.preventDefault()
return false
}
var thisSection = $(lnk).parents('fieldset.sq-form-section')
var validate = oef.validateFields($(thisSection).find('.sq-form-question[data-validators]'))
var sectionValid = oef.addValidationErrors(validate)
if (sectionValid && $(thisSection).find('.sq-form-question.error').length === 0) {
$(thisSection).find('input.sq-form-submit').trigger('click')
$(lnk)
.prop('disabled', true)
.addClass('disabled submitting')
.html('Submitting')
$('.submission-text').removeClass('hide')
}
event.stopPropagation()
event.preventDefault()
return false
}
// submit Method for forms with Invisible captcha. Validate the form then fire the Invis Captcha
oef.validateAndFireInvisibleCaptcha = function(lnk, event) {
if ($(lnk).is('.disabled')) {
event.stopPropagation()
event.preventDefault()
return false
}
var thisSection = $(lnk).parents('fieldset.sq-form-section')
var validate = oef.validateFields($(thisSection).find('.sq-form-question[data-validators]'))
var sectionValid = oef.addValidationErrors(validate);
if (sectionValid && $(thisSection).find('.sq-form-question.error').length == 0) {
grecaptcha.execute()
}
event.stopPropagation()
event.preventDefault()
return false
}
// Builds the Error html from the validation results
oef.addValidationErrors = function(validations) {
var allCorrect = true;
var allErrors = [];
console.log('validations', validations)
_.each(validations, function(validation, field) { // run through all validations returned
var question = $('#'+field).closest('.sq-form-question'); // grab the question
var correct = _.every(validation, function(val, key){ return val === true }) // all validations passed?
allCorrect = correct && allCorrect;
if(correct) { // if so, remove error class and all errors
$(question)
.removeAttr('aria-describedby')
.removeClass('error')
.find('span.error-message')
.remove()
}else{ // if not add error class and update all errors
$(question)
.removeAttr('aria-describedby')
.addClass('error')
.find('span.error-message')
.remove();
// add message for every validation thats failed
console.log(field)
_.each(_.filter(validation, function(val, key){ return val !== true }), function(message, type) {
$(question)
.find('label:first')
.after(''+message+'');
allErrors.push(message);
});
$(question)
.attr('aria-describedby', $(question).find('span.error-message').attr('id'));
}
})
return allCorrect;
}
// Invis captcha callback. Fill the response and submit the form proper.
// Must be in the window namespace for google recaptcha to call it.
window.invisibleCaptchaValid = function(response) {
$('#recaptcha_response').val(response)
var thisSection = $('#recaptcha_response').parents('fieldset.sq-form-section')
$(thisSection).find('input.sq-form-submit').trigger('click')
$(thisSection)
.find('.submit-form')
.prop('disabled', true)
.addClass('disabled submitting')
.html('Submitting')
event.stopPropagation()
event.preventDefault()
return false
}
window.grecaptchaLoaded = function() {
grecaptcha.render('recaptcha');
}
})(onEnqForm || (onEnqForm = {})))