/* global window, document, Image */

(function () {
  "use strict";

  var staticsHost = '@@STATIC_BASE_URL';
  var grootCdn = '@@RC_GROOT_CDN_BASE_URL';
  if (grootCdn && grootCdn.length > 0) {
    staticsHost = grootCdn;
  }
  var trackHost = '@@TRACK_BASE_URL';
  var cdnHost = '@@CDN_BASE_URL' || 'https://assets.mlcdn.com/ml';

  var subscribeFormSelector = '.ml-subscribe-form form, .ml-contact-form form, .ml-preferences-form form';
  var subscribeFormsCount = 0;

  function onJqueryReady() {
    if (typeof window.jQuery !== "undefined") {
      window.ml_jQuery = window.jQuery.noConflict(true);
    }

    ml_load_libs();
  }

  if (
    typeof window.ml_jQuery !== "undefined" &&
    typeof window.ml_jQuery.ajax === "function"
  ) {
    ml_load_libs();
    return;
  }

  if (
    typeof window.jQuery !== "undefined" &&
    typeof window.jQuery.ajax === "function"
  ) {
    window.ml_jQuery = window.jQuery;

    ml_load_libs();
    return;
  }

  var script_tag = document.createElement("script");
  script_tag.setAttribute("type", "text/javascript");
  script_tag.setAttribute(
    "src",
    cdnHost + "/ajax/libs/jquery/1.8.3/jquery.min.js"
  );
  script_tag.onload = onJqueryReady;
  script_tag.onreadystatechange = function () {
    if (this.readyState === "complete" || this.readyState === "loaded")
      onJqueryReady();
  };
  document.getElementsByTagName("head")[0].appendChild(script_tag);

  window.ml_guid = function () {
    function s4() {
      return Math.floor((1 + Math.random()) * 0x10000)
        .toString(16)
        .substring(1);
    }

    return (
      s4() +
      s4() +
      "-" +
      s4() +
      "-" +
      s4() +
      "-" +
      s4() +
      "-" +
      s4() +
      s4() +
      s4()
    );
  };

  function doSuccess($form, $wrapper) {
    if (typeof window.ml_webform_after_success === "function") {
      window.ml_webform_after_success();
    }

    //skip if one of them is true
    if (!$form.data("continue") && !$form.data("redirect")) {
      var webform_id = $wrapper.attr("id").substr(5);
      var parts = webform_id.split('-');
      if (parts.length === 0) return;
      var successFnName = "ml_webform_success_" + parts[0];

      var blockSuccess = $wrapper.find(".ml-block-success");
      var blockForm = $wrapper.find(".ml-block-form");

      if (blockSuccess.length && blockForm.length) {
        blockSuccess.show();
        blockForm.hide();
      } else if (typeof window[successFnName] === "function") {
        window[successFnName]();
        ml_webform_embed();
      }
    }

    if (window != window.parent) {
      window.parent.postMessage(
        "mlWebformSubmitSuccess-" + $wrapper.attr("id").substr(5),
        "*"
      );
    }

    var successSurveyFnName = "ml_survey_success";
    if (typeof window[successSurveyFnName] === "function") {
      window[successSurveyFnName]($form.data("scope-id"));
      ml_webform_embed();
    }
  }

  function doConfirm() {
    $('.row-form').hide();
    $('.row-confirm').show();
    $(window).scrollTop(0);
  }

  function ml_load_libs() {
    var libs = [
      staticsHost + "/js/w/ml_jQuery.inputmask.bundle.min.js?v3.3.1"
    ];

    for (var i in libs) {
      if (libs.hasOwnProperty(i)) {
        var script_tag = document.createElement("script");
        script_tag.setAttribute("type", "text/javascript");
        script_tag.setAttribute("src", libs[i]);

        if (i == libs.length - 1) {
          script_tag.onload = ml_webform_embed;
          script_tag.onreadystatechange = function () {
            if (this.readyState === "complete" || this.readyState === "loaded")
              ml_webform_embed();
          };
        }
        document.getElementsByTagName("head")[0].appendChild(script_tag);
      }
    }
  }

  function ml_mutation() {
    var webforms = document.querySelectorAll(subscribeFormSelector);

    if(subscribeFormsCount !== webforms.length){
      subscribeFormsCount = webforms.length;
      ml_webform_embed();
    }
  }

  function ml_webform_embed() {
    var guid = "";
    if (typeof window.ml_guid === "function") {
      guid = window.ml_guid();
      try {
        if (window.localStorage) {
          if (window.localStorage.ml_guid) {
            guid = window.localStorage.ml_guid;
          } else {
            window.localStorage.ml_guid = guid;
          }
        }
      } catch (err) { }
    }

    var preview = false;
    try {
      if (
        window &&
        window.location &&
        window.location.hostname &&
        window.parent &&
        window.parent.window &&
        window.parent.window.location &&
        window.parent.window.location.hostname
      ) {
        preview =
          window.location.hostname === window.parent.window.location.hostname;
      }
    } catch (err) {
      preview = false;
    }

    var ml_observer = new MutationObserver(ml_mutation);
    ml_observer.observe(window.document, { attributes: true, childList: true, subtree: true });

    window
      .ml_jQuery(subscribeFormSelector)
      .each(function () {
        var $form = window.ml_jQuery(this);
        var $wrapper = window
          .ml_jQuery(this)
          .closest(".ml-subscribe-form, .ml-contact-form, .ml-preferences-form");

        var formSelector = window.ml_jQuery(this);

        var submitOutsideForm = ml_submit_button_outside(this);
        if (submitOutsideForm) formSelector = formSelector.closest(".ml-webform-submit-wrapper");

        var submit_primary = formSelector.find("button.primary");
        var submit_loading = formSelector.find("button.loading");
        var submit_loading_enabled = submit_loading.length > 0;

        $form.find("input,textarea,select").attr('aria-invalid', 'false'); // Adding attribute from here instead of html
        $form.find(".ml-validate-date input").inputmask(undefined, {
          oncomplete: function () {
            window
              .ml_jQuery(this)
              .closest(".ml-validate-date")
              .addClass("ml-validate-date-valid");
          },
          onincomplete: function () {
            window
              .ml_jQuery(this)
              .closest(".ml-validate-date")
              .removeClass("ml-validate-date-valid");
          },
          oncleared: function () {
            window
              .ml_jQuery(this)
              .closest(".ml-validate-date")
              .removeClass("ml-validate-date-valid");
          },
          onKeyValidation: function () {
            window
              .ml_jQuery(this)
              .closest(".ml-validate-date")
              .removeClass("ml-validate-date-valid");
          }
        });

        $form.find(".ml-validate-phone input").inputmask(undefined, {
          oncomplete: function () {
            window
              .ml_jQuery(this)
              .closest(".ml-validate-phone")
              .addClass("ml-validate-phone-valid");
          },
          onincomplete: function () {
            window
              .ml_jQuery(this)
              .closest(".ml-validate-phone")
              .removeClass("ml-validate-phone-valid");
          },
          oncleared: function () {
            window
              .ml_jQuery(this)
              .closest(".ml-validate-phone")
              .removeClass("ml-validate-phone-valid");
          },
          onKeyValidation: function () {
            window
              .ml_jQuery(this)
              .closest(".ml-validate-phone")
              .removeClass("ml-validate-phone-valid");
          }
        });

        if (
          $form.data("ml-submit-bound") === undefined ||
          !$form.data("ml-submit-bound")
        ) {
          $form.data("ml-submit-bound", 1);

          $wrapper.find(".ml-block-success").bind("click", function () {
            $wrapper.find(".ml-block-success").hide();
            $wrapper
              .find(".ml-block-form")
              .find('input[type="text"]')
              .val("");
            var $checkboxes = $wrapper
              .find(".ml-block-form")
              .find('input[type="checkbox"],input[type="radio"]');
            if ($checkboxes.prop !== undefined) {
              $checkboxes.prop("checked", false);
            } else {
              $checkboxes.attr("checked", false);
            }

            $wrapper.find(".ml-block-form").show();
          });

          var $submitButton = window.ml_jQuery(":submit", $form);

          if (submitOutsideForm) $submitButton = submitOutsideForm;

          $submitButton.click(function () {
            $form.find('input[type="hidden"].ml-submit-hidden-value').remove();
            if (window.ml_jQuery(this).attr("name")) {
              $form.append(
                window
                  .ml_jQuery(
                    '<input type="hidden" class="ml-submit-hidden-value">'
                  )
                  .attr({
                    name: window.ml_jQuery(this).attr("name"),
                    value: window.ml_jQuery(this).attr("value")
                  })
              );
            }
          });

          //if body has ml-submit-success class - show success immediatelly
          if (window.ml_jQuery("body").hasClass("ml-submit-success")) {
            doSuccess($form, $wrapper);
          }

          var submitAction = function (e) {
            e.preventDefault();

            // prevent multi submits
            if ($form.data("loading")) {
              return false;
            }

            //nuvalom visus error'us
            $form.find(".ml-error").removeClass("ml-error");
            $form.find(":input[aria-invalid=true]").attr("aria-invalid", "false");
            $form.find(".ml-server-error").addClass("d-none");
            $form.find(".ml-field-error-message").text("");

            if (ml_validate_form($form)) {
              if (submit_loading_enabled) {
                submit_primary.hide();
                submit_loading.show();
              }

              var form_data = $form.serialize();
              form_data = form_data + "&ajax=1" + "&guid=" + guid;
              var form_url = $form.attr("action");
              $form.data("loading", true);

              var form_method = 'GET';
              if ($form.data("force-post")) form_method = 'POST';

              var data_type = 'jsonp';
              if ($form.data("request-data-type")) data_type = $form.data("request-data-type");

              var form_url_valid = /^https?:\/\/.*$/i.test(form_url);

              if (form_url_valid && (!preview || form_data.toLowerCase().indexOf("email") >= 0)) {
                window.ml_jQuery.ajax({
                  type: form_method,
                  url: form_url,
                  data: form_data,
                  dataType: data_type,
                  success: function (result) {
                    $form.data("loading", false);
                    if (submit_loading_enabled) {
                      submit_primary.show();
                      submit_loading.hide();
                    }

                    if (result.success) {
                      doSuccess($form, $wrapper);
                    } else if (result.fieldsToConfirm && result.fieldsToConfirm.length) {
                      doConfirm();
                    } else {
                      if (result.errors !== undefined) {
                        if (
                          result.errors.groups !== undefined &&
                          result.errors.groups
                        ) {
                          $form.find(".ml-block-groups").addClass("ml-error");
                          $form.find(".ml-block-groups :input[aria-invalid=false]").attr("aria-invalid", "true");
                        }
                        if (
                          result.errors.fields !== undefined &&
                          result.errors.fields
                        ) { showInvalidFields($form, result.errors.fields) }
                      }
                    }

                    if ($form.data("redirect")) {
                      var target = $form.data("redirect-target");
                      if (preview) {
                        window.top.open(
                          $form.data("redirect"),
                          target || "_blank"
                        );
                      } else {
                        window.parent.postMessage(
                          "mlWebformRedirect-" +
                          encodeURIComponent($form.data("redirect")) +
                          (target ? "-" + target : ""),
                          "*"
                        );
                      }
                    }
                  },
                  error: function (jqXHR) {
                    $form.data("loading", false);
                    if (submit_loading_enabled) {
                      submit_primary.show();
                      submit_loading.hide();
                    }

                    var result = {};
                    try { result = JSON.parse(jqXHR.responseText) }
                    catch (err) { }

                    $form.find(".ml-server-error").text(result.message || 'Something went wrong, please try again');
                    $form.find(".ml-server-error").removeClass("d-none");

                    if (result.errors && result.errors.fields && Object.keys(result.errors.fields).length) {
                      showInvalidFields($form, Object.keys(result.errors.fields))
                      showFieldsErrorMessages($form, result.errors.fields);
                    }
                  }
                });
              }

              var closeFnName = "close";
              if (
                $form.data("close") &&
                typeof window[closeFnName] === "function"
              ) {
                window[closeFnName]();
              }
            }
          }

          if (submitOutsideForm) {
            $submitButton.bind("click", submitAction);
          } else {
            $form.bind("submit", submitAction);
          }

          // Track webform view
          var webform_id = $form.attr("data-id");
          var webform_code = $form.attr("data-code");

          if (webform_id) {
            new Image().src =
              trackHost + "/webforms/o/" +
              webform_id +
              "/" +
              webform_code +
              "?v" +
              Math.floor(Date.now() / 1000);
          }
        }

        ml_prepopulate_field_values($form);

        if (window != window.parent) {
          window
            .ml_jQuery(document)
            .on("click", ".overlay, .ml-subscribe-close", function () {
              window.parent.postMessage(
                "mlCloseIframe-" + $form.data("code"),
                "*"
              );
            });

          window.ml_jQuery(".ml-subscribe-form").bind("click", function (e) {
            var target = e.target || e.srcElement;
            if (window.ml_jQuery(target).is("div.ml-subscribe-close")) {
              return;
            }

            e.stopPropagation();
          });
        }
      });
  }

  function ml_validate_form($form) {
    var form_valid = true;

    $form.find(".ml-validate-required").each(function (index, w) {
      var element_valid = false;
      window
        .ml_jQuery(w)
        .find('input[type="text"], input[type="email"], input[type="number"], select, textarea')
        .each(function (i, v) {
          if (
            window.ml_jQuery(v).val() !== undefined &&
            window.ml_jQuery(v).val() !== ""
          ) {
            element_valid = true;
          }
        });
      window
        .ml_jQuery(w)
        .find('input[type="checkbox"],input[type="radio"],input[type="hidden"]')
        .each(function (i, v) {
          if (window.ml_jQuery(v).prop !== undefined) {
            if (window.ml_jQuery(v).prop("checked")) {
              element_valid = true;
            }
          } else {
            if (window.ml_jQuery(v).attr("checked")) {
              element_valid = true;
            }
          }
        });

      if (!element_valid) {
        window.ml_jQuery(w).addClass("ml-error");
        window.ml_jQuery(w).find(":input[aria-invalid=false]").attr("aria-invalid", "true");
        form_valid = false;
      }
    });

    $form.find(".ml-validate-email").each(function (index, w) {
      var element_valid = true;
      window
        .ml_jQuery(w)
        .find('input[type="text"], input[type="email"]')
        .each(function (i, v) {
          if (
            window.ml_jQuery(v).val() !== undefined &&
            window.ml_jQuery(v).val() !== "" &&
            !ml_valid_email(window.ml_jQuery(v).val())
          ) {
            element_valid = false;
          }
        });

      if (!element_valid) {
        window.ml_jQuery(w).addClass("ml-error");
        window.ml_jQuery(w).find(":input[aria-invalid=false]").attr("aria-invalid", "true");
        form_valid = false;
      }
    });

    $form.find(".ml-validate-date").each(function (index, w) {
      var element_valid = true;
      window
        .ml_jQuery(w)
        .find('input[type="text"]')
        .each(function (i, v) {
          if (
            window.ml_jQuery(v).val() !== undefined &&
            window.ml_jQuery(v).val() !== "" &&
            !window.ml_jQuery(w).hasClass("ml-validate-date-valid")
          ) {
            element_valid = false;
          }
        });

      if (!element_valid) {
        window.ml_jQuery(w).addClass("ml-error");
        window.ml_jQuery(w).find(":input[aria-invalid=false]").attr("aria-invalid", "true");
        form_valid = false;
      }
    });

    $form.find(".ml-validate-phone").each(function (index, w) {
      var element_valid = true;
      window
        .ml_jQuery(w)
        .find('input[type="text"]')
        .each(function (i, v) {
          if (
            window.ml_jQuery(v).val() !== undefined &&
            window.ml_jQuery(v).val() !== "" &&
            !window.ml_jQuery(w).hasClass("ml-validate-phone-valid")
          ) {
            element_valid = false;
          }
        });

      if (!element_valid) {
        window.ml_jQuery(w).addClass("ml-error");
        window.ml_jQuery(w).find(":input[aria-invalid=false]").attr("aria-invalid", "true");
        form_valid = false;
      }
    });

    return form_valid;
  }

  function ml_valid_email(email) {
    var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]){2,40}$/;
    return regex.test(email.trim());
  }

  function ml_submit_button_outside($form) { // when submit button is outside <form> (e.g. preferences page)
    var formWrapper = window.ml_jQuery($form).closest(".ml-webform-submit-wrapper");
    var formSubmitButton = window.ml_jQuery(".ml-webform-submit-button", formWrapper[0])

    if (formWrapper.length && formSubmitButton.length) {
      return formSubmitButton;
    }
    return false;
  }

  function ml_prepopulate_field_values($form) {
    if (!window.fields || !window.fields.length || typeof window.fields !== 'object' || !$form) return;

    window.fields.forEach(function (fieldData) {
      if (!fieldData.field || !fieldData.field_type) {
        console.error('Missing data! "field" and "field_type" properties are required.');
        return;
      }

      var fieldElem = $form.find("input[aria-label='" + fieldData.field + "']");
      if (!fieldElem.length) return;

      fieldElem.val(fieldData.value);

      if (fieldData.field_type === 'DATE') {
        fieldElem.closest(".ml-validate-date").addClass("ml-validate-date-valid");
      }

    })
  }

  function showInvalidFields($form, fieldsArray) {
    if (!$form || !fieldsArray) return;

    window.ml_jQuery.each(fieldsArray, function (key, field) {
      $form.find(".ml-field-" + field).addClass("ml-error");
      $form.find(".ml-field-" + field + ":input[aria-invalid=false]").attr("aria-invalid", "true");
    });
  }

  function showFieldsErrorMessages($form, fieldsObject) {
    if (!$form || !fieldsObject) return;

    window.ml_jQuery.each(fieldsObject, function (field, messagesArray) {
      if (field && messagesArray) {
        var message = messagesArray.join(' ');
        $form.find(".ml-field-" + field).find(".ml-field-error-message").text(message);
      }
    });
  }

})();