// Input's mask

$(document).ready(function () {
  const phoneMask = $(".--phone-mask");

  if (!phoneMask.length) return;

  phoneMask.inputmask({
    mask: "+38 (999) 999 99 99",
    showMaskOnHover: false,
  });
});

// Adaptive textarea height

function setTextareaAdaptiveHeight(e) {
  e.target.style.height = "0";
  e.target.style.height = `${e.target.scrollHeight}px`;
}

function updateTextareaAdaptiveHeight() {
  $("textarea.-adaptive-height").trigger("input");
}

$(window).on("resize", updateTextareaAdaptiveHeight);
$(document).on("input", "textarea.-adaptive-height", setTextareaAdaptiveHeight);

// Form validation

function formValidation(form) {
  $(form)
    .find("[data-important]")
    .removeClass("-valid -invalid")
    .each(function () {
      const input = $(this).find("input, textarea");
      const validationType = $(this).attr("data-important");

      if (validationType === "email") emailValidator(input);
      if (validationType === "count") countValidator(input);
      if (validationType === "length") lengthValidator(input);
      if (validationType === "checked") isCheckedValidator(input);
      if (validationType === "not-empty") notEmptyValidator(input);
      if (validationType === "inputmask") inputmaskValidator(input);
      if (validationType === "file") fileValidator(input);
    });

  return $(form).find("[data-important].-invalid").length === 0;
}

$(document).on(
  "focus",
  ".form [data-important] input, .form [data-important] textarea",
  function () {
    $(this).closest("[data-important]").removeClass("-valid -invalid");
  }
);

// Form validation - helper

function setInputValidation(input, status) {
  if (status) {
    input.closest("[data-important]").addClass("-valid");
  } else {
    input.closest("[data-important]").addClass("-invalid");
  }
}

// Form validation - validators

function notEmptyValidator(input) {
  setInputValidation(input, input.val().trim().length > 0);
}

function inputmaskValidator(input) {
  setInputValidation(input, input.inputmask("isComplete"));
}

function isCheckedValidator(input) {
  setInputValidation(input, input.is(":checked"));
}

function emailValidator(input) {
  const value = input.val().trim();
  const reg =
    /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{1,}))$/;

  setInputValidation(input, reg.test(String(value).toLowerCase()));
}

function countValidator(input) {
  let isValid = true;

  const value = input.val().trim();

  const min = input.data("min");
  const max = input.data("max");

  if (value.length === 0) isValid = false;

  if (min && value < min) isValid = false;

  if (max && value > max) isValid = false;

  setInputValidation(input, isValid);
}

function lengthValidator(input) {
  const value = input.val().trim();

  const minLength = input.closest("[data-important]").attr("data-min-length");
  const maxLength = input.closest("[data-important]").attr("data-max-length");

  let isValid = false;

  if (minLength && maxLength) {
    isValid = value.length >= minLength && value.length <= maxLength;
  }

  if (minLength && !maxLength) {
    isValid = value.length >= minLength;
  }

  if (!minLength && maxLength) {
    isValid = value.length <= maxLength;
  }

  setInputValidation(input, isValid);
}

function fileValidator(input) {
  const files = input[0].files;

  let isValid = false;

  if (!files.length || files.length > 1) {
    setInputValidation(input, isValid);
    return;
  }

  const file = files[0];
  const fileType = file.type;
  const fileSize = file.size;

  const checkFileType = fileType == "application/pdf";
  const checkFileSize = fileSize <= 5242880;

  if (checkFileType && checkFileSize) {
    isValid = true;
  }

  setInputValidation(input, isValid);
}

// Form's elements focus functions

$(document).on("focus", ".input input, .input textarea", function () {
  const parent = $(this).closest(".input");
  parent.addClass("-focus");
});

$(document).on("blur", ".input input, .input textarea", function () {
  const parent = $(this).closest(".input");

  if (parent.hasClass("-fill")) return;

  parent.removeClass("-focus");
});

// Form's elements input functions

$(document).on("input", ".input input, .input textarea", function () {
  const value = $(this).val();
  const parent = $(this).closest(".input");

  if (value.length > 0) {
    parent.addClass("-fill");
  } else {
    parent.removeClass("-fill");
  }
});

// Upload file helper

$(document).on("focus", ".input.-file .input__box", function () {
  $(this).closest("[data-important]").removeClass("-valid -invalid");
});

$(document).on("click", ".input.-file .input__file-button", function () {
  const parent = $(this).closest(".input");
  const input = parent.find('input[type="file"]');

  input.trigger("click");
});

$(document).on("change", `.input.-file input[type="file"]`, function () {
  const parent = $(this).closest(".input");

  if ($(this).val().length) {
    parent.addClass("-fill");
  } else {
    parent.removeClass("-fill");
    return;
  }

  const infoBox = parent.find(".file-info__info-box");
  const nameBox = infoBox.find("p");
  const sizeBox = infoBox.find("span");
  const sizeUnit = sizeBox.attr("data-unit");

  const files = $(this)[0].files;
  const file = files[0];

  const fileName = file.name;
  const fileSize = (file.size / 1048576).toFixed(2);

  nameBox.text(fileName);
  sizeBox.text(`(${fileSize} ${sizeUnit})`);
});

$(document).on("click", ".input.-file .file-info__remove-icon", function () {
  const parent = $(this).closest(".input");
  const input = parent.find('input[type="file"]');

  input.attr("type", "text");

  input[0].value = "";
  parent.removeClass("-fill");

  input.attr("type", "file");
});

// Checkboxes

$(document).on("click", ".--checkbox", function () {
  const input = $(this).find('input[type="checkbox"]');
  const checked = input.is(":checked");

  $(this).toggleClass("-checked");
  input[0].checked = !checked;
});

function customCheckboxReady() {
  $(".--checkbox").each(function () {
    const checked = $(this).find('input[type="checkbox"]').is(":checked");
    const hasCheckedClass = $(this).hasClass("-checked");

    if (checked && !hasCheckedClass) {
      $(this).addClass("-checked");
    } else if (!checked && hasCheckedClass) {
      $(this).removeClass("-checked");
    }
  });
}

$(window).on("load", customCheckboxReady);

• [D] lib
• [F] custom-solutions.js
  Delete
• [F] form.js
  Delete
• [F] script.js
  Delete
• [F] scroll-animation.js
  Delete
• [F] test.js
  Delete