$(document).ready(function () {
  // Constansts
  const TIME_FOR_SCROLL = 1000;

  // Buttons
  const mainBtn = document.getElementById('main-btn');
  const offerBtns = document.querySelectorAll('#offer-btn');
  const callbackBtn = document.getElementById('callback-btn');
  const getMoreBtn = document.querySelector('.main-more')
  const toFormBtns = [mainBtn, ...Array.from(offerBtns)]
  // Inputs
  const phoneInput = document.querySelector('form #phone');
  const nameInput = document.querySelector('form #name');
  // Blocks
  const formBlock = document.querySelector('.graduation__block.callback');
  const descriptionBlock = document.querySelector('.description')
  

  // Add event listeners
  toFormBtns.forEach(x => x.addEventListener('click', btnClickHandler.bind(null, formBlock)));
  getMoreBtn.addEventListener('click', scrollToElem.bind(null, descriptionBlock));
  callbackBtn.addEventListener('click', submitForm);


  //Handlers
  function btnClickHandler(elem) {
    scrollToElem(elem);
    phoneInput.focus();
  }


  // Function with jQuery
  $(phoneInput).mask('+7 (000) 000-00-00');
  
  function scrollToElem(element) {
      
    $([document.documentElement, document.body]).animate({
        scrollTop: $(element).offset().top
    }, TIME_FOR_SCROLL);
  }

  function submitForm(event) {
    event.preventDefault();
    
    const name = nameInput.value;
    const phone = phoneInput.value;

    if (!name || !phone) return;

    //AJAX send
  }

})