$(document).ready(function () {
  let $sms_overlay = $('.js--sms-overlay');
  let $sms_input = $('.sms-input');


  if (!$sms_overlay.length) {
    return
  }

  let $form = $('form'),
      $sms_send_btn = $('.js--sms-send-btn'),
      $sms_resend_btn = $('.js--sms-resend-btn'),
      $sms_resend_status = $('.js--sms-resend-status'),
      $sms_resend_timer = $('.js--sms-resend-status > span'),
      $sms_submit_btn = $('.js--sms-submit-btn'),
      $sms_back_btn = $('.js--sms-back-btn'),
      sms_resend_delay = 60,
      parent_id = getCookie('parent_id'),
      show_overlay_onload = (!$('.form-input-wrap input:not(#phoneCode)').nextAll('.errorlist').length)
                            && ($('.form-input-wrap input#phoneCode').nextAll('.errorlist').length > 0),
      timer_running;

  function getCookie(name) {
    let value = '; ' + document.cookie;
    let parts = value.split('; ' + name + '=');
    if (parts.length == 2) return parts.pop().split(';').shift();
  }

  const csrftoken = getCookie('csrftoken');

  async function requestNewSmsCode() {
    let current_phone = $('input#phoneCustomer').val();
    return await $.ajax({
      url: '/sms_check/',
      headers: {'X-CSRFToken': csrftoken},
      method: 'POST',
      data: {
        phone: current_phone,
      }
    })
  }

  function runClock(time) {
    function declOfNum(number, titles) {
      let cases = [2, 0, 1, 1, 1, 2];
      return titles[ (number%100>4 && number%100<20)? 2 : cases[(number%10<5)?number%10:5] ];
    }

    function update_clock() {
      time -= 1;
      let time_string = time + ' ' + declOfNum(time, ['секунда', 'секунды', 'секунд']);
      $sms_resend_timer.text(time_string);

      if (time <= 0) {
        clearInterval(time_interval);
        timer_running = false;
        $sms_resend_status.addClass('hidden');
        $sms_resend_btn.removeClass('hidden');
      }
    }

    timer_running = true;
    update_clock();
    let time_interval = setInterval(update_clock,1000);
  }

  if (show_overlay_onload) {
    runClock(sms_resend_delay)
    $sms_overlay.css('width', '100%');
		$sms_input.css('display', 'block')
  }

  $sms_send_btn.on('click', function() {
    let valid_for_sms = true;

    $('.form-input-wrap input:not(#phoneCode), input[type=checkbox]').each(function() {
      if (!this.checkValidity()) {
        valid_for_sms = false;
        this.reportValidity();
      }

      return valid_for_sms;
    });
    if (valid_for_sms && timer_running !== true) {
      requestNewSmsCode().then((response) => {
        if (response.status === true) {
          !timer_running && runClock(sms_resend_delay);
          $sms_overlay.css('width', '100%');
					$sms_input.css('display', 'block')

        } else {
          $('.form-input-wrap[data-dadata="phone"]').addClass('form-input-wrap-error').append('<ul class="errorlist"><li>Сервис недоступен. Повторите попытку позднее.</li></ul>');
        }
      }).catch(err => console.log(err))
    } else if (valid_for_sms && timer_running === true) {
      $sms_overlay.css('width', '100%');
			$sms_input.css('display', 'block')
    }
  });

  $sms_back_btn.on('click', function() {
    $sms_overlay.css('width', '0');
		$sms_input.css('display', 'none')

  });

  $sms_resend_btn.on('click', function() {

    $sms_resend_btn.addClass('hidden');
    $sms_submit_btn.attr('disabled', true);

    requestNewSmsCode().then((response) => {
      if (response.status === true) {
        runClock(sms_resend_delay);
        $sms_submit_btn.attr('disabled', true);
        $sms_resend_status.removeClass('hidden');
      }
    })
  });
});