$(function() {

    // adding js class for styling with accessibility in mind
    $('body').addClass('js');

    // form field label styling on focus
    $("form :input").focus(function() {
        $("label[for='" + this.id + "']").parent().addClass("is-focused");
    }).blur(function() {
        $("label").parent().removeClass("is-focused");
    });

    $('.status.message.submission-error').addClass("is-hidden");

    toggleSubmitButton(true);

    $('#survey-form').on('submit', function() {
      /* validate required fields */

        var $inputs = $('#survey-form :input');

        $('.status.message.submission-error .message-copy').empty();

        var cancel_submit = false;

        $inputs.each(function() {
            /* see if it is a required field and - if so - make sure user presented all information */
            if (typeof $(this).attr("required") !== typeof undefined) {
                var val = $(this).val();
                if (typeof(val) === "string") {
                    if (val.trim().length === 0) {
                        var field_label = $(this).parent().find("label");
                        $(this).parent().addClass('field-error');
                        $('.status.message.submission-error .message-copy').append("<li class='error-item'>"+field_label.text()+"</li>");
                        cancel_submit = true;
                    }
                } else if (typeof(val) === "object") {
                    /* for SELECT statements */
                    if (val === null || val.length === 0 || val[0] === "") {
                        var field_label = $(this).parent().find("label");
                        $(this).parent().addClass('field-error');
                        $('.status.message.submission-error .message-copy').append("<li class='error-item'>"+field_label.text()+"</li>");
                        cancel_submit = true;
                    }
                }
            }
        });

        if (cancel_submit) {
          $('.status.message.submission-error').
            removeClass("is-hidden").
            focus();
          $("html, body").animate({ scrollTop: 0 }, "fast");
          return false;
        }

        toggleSubmitButton(false);
    });

    $('#survey-form').on('ajax:error', function() {
        toggleSubmitButton(true);
    });

    $('#survey-form').on('ajax:success', function(event, json, xhr) {
        var url = json.redirect_url;
        location.href = url;
    });

    $('#survey-form').on('ajax:error', function(event, jqXHR, textStatus) {
        toggleSubmitButton(true);
        json = $.parseJSON(jqXHR.responseText);
        $('.status.message.submission-error').addClass('is-shown').focus();
        $('.status.message.submission-error .message-copy').
            html(gettext("There has been an error processing your survey.")).
            stop().
            css("display", "block");
    });
});

function toggleSubmitButton(enable) {
    var $submitButton = $('form .form-actions #submit');

    if(enable) {
        $submitButton.
            removeClass('is-disabled').
            attr('aria-disabled', false).
            removeProp('disabled');
    }
    else {
        $submitButton.
            addClass('is-disabled').
            attr('aria-disabled', true).
            prop('disabled', true);
    }
}