require(['html-form-validation', function (Validator) {});

import Validator from 'html-form-validation';

/**
 * First param. Form to validate.
 *
 * @type {jQuery|HTMLElement|String}
 */
var param1 = $('form');

/**
 * Second param. Params for AJAX request performed when form is valid.
 *
 * @type {Function|Object}
 */
var param2 = function (context) {
  console.log('%csuccess! Context:\n%o', 'color: blue;', context);

  // function should return Object with AJAX params.
  return {
    url: 'ajax/example.json',
    method: 'get',
    success: () => console.log('ajax success callback')
  }
};

/**
 * Third param. User-specified options. Unnecessary.
 *
 * @type {Object}
 */
var param3 = {
  // If form is situated in bootstrap modal (login form etc.),
  // incorrect field state will be removed when modal is closed.
  // DEFAULT: false
  modal: false,
  // Selector to find form's fields.
  // When changing, you should also change CSS styles.
  // DEFAULT: '.form-input'.
  fieldsSelector: '.form-input',
  // Remove fields incorrect state, when clicked outside the form.
  // DEFAULT: false.
  removeOnFocusOut: true
};

/** Initialize Validator */
new Validator(param1, param2, param3);

const param2 = context => {
  // function should return Promise
  return new Promise((resolve, reject) => {
    // perform async actions. main ajax request will be performed on promise resolve
    $.ajax({
      url: 'path/to/async/action',
      method: 'get',
      // remember, function must return options for AJAX request
      success: res => resolve({
        url: 'path/to/main/ajax',
        method: 'post',
        success: res => console.log('main AJAX success %o', res)
      }),
      error: xhr => reject(xhr)
    });
  })
};