/**
 * Handler the registration form via ajax.
 *
 * @todo PS - Maybe use jquery masked input plugin http://digitalbush.com/projects/masked-input-plugin/
 */
$(document).ready(function() {
  // STYLE FIX HACK ///
  // fix to make the password fields layout correctly as the checkbox fields are pulled from the normal flow
  $('#edit-field18-wrapper').before('<div class="clear"></div>');

  /////// REGISTER FORM EVENTS //////////

  $(document).bind('disableRegistrationForm', function(event) {
    $('#user-register-form :input').attr('disabled', 'disabled').addClass('disabled');
    $('#user-register-form :submit').css('display', 'none').after('<img id="buttonregister-loading" class="disabled" src="/css/mybrighttalk/images/buttonlogin-loading-85.gif" style="display:block;" />');
  });

  $(document).bind('enableRegistrationForm', function(event) {
    $("#user-register-form #buttonregister-loading").remove();
    $('#user-register-form :submit').css('display', 'block');
    $('#user-register-form :input').removeAttr('disabled').removeClass('disabled');
  });

  var validator = $("#user-register-form").validate({
    rules: {
      field1: {
        maxlength: 100
      },
      field2: {
        maxlength: 100
      },
      field3: {
        email: true,
        maxlength: 100
      },
      field4: {
        containsDigits: 10,
        maxlength: 100
      },
      field5: {
        maxlength: 100
      },
      field7: {
        maxlength: 100
      },
      field12: {
        required: function(element) {
          return $("#edit-field11").val() == 'United States';
        }
      },
      field11: {
        dashesempty:true
      },
      field18: {
        nospaces: true,
        minlength: 6,
        maxlength: 32
      },
      field19: {
        nospaces: true,
        minlength: 6,
        maxlength: 32,
        equalTo: "#edit-field18"
      }
    },
    messages: {
      field15: "Please accept the User Agreement",
      field16: "Please accept the Privacy Policy"
    },
    submitHandler: function() {
      // we do not use :input to avoid readonly text area
      var formFields = $("#user-register-form input:text, #user-register-form input:checkbox, #user-register-form input:password, #user-register-form select");
      var requestBody = $.bt.brightTALKRequestXmlWrapper($.bt.formAnswersXmlFromJQuery(formFields));
      var url = "/service/user/xml/register/";

      $(document).trigger('disableRegistrationForm');

      $.ajax({
        url: url,
        data: requestBody,
        processData: false,
        success: function(xml) {
          var state = $(xml).find('response').attr('state');
          if (state == 'processed') {
            $('#registration-message').html("Registered and Logged in now redirecting...");
            $(document).trigger('loginSuccess');
          }
          else {
            $(document).trigger("enableRegistrationForm");
            var formElement = $(xml).find('form');
            if (formElement.length > 0) {
              var errors = $.bt.formXmlToErrors(xml);
              validator.showErrors(errors);

              var firstErrorField;
              for (var member in errors) {
                if (errors.hasOwnProperty(member) && typeof(errors[member]) !== 'function') {
                  firstErrorField = member;
                  break;
                }
              }
              $('#edit-' + firstErrorField).focus();
            }
            else {
              $(document).trigger("showUnexpectedError");
            }
          }
        },
        error: function() {
          $(document).trigger("enableRegistrationForm");
        }
      });
      return false;
    }
  });

});