/* Variables
   ================================================================== */
var searchToggleStatus = false

/* Selectors
   ================================================================== */
var searchButton = document.querySelector('#searchButton')
var searchCloseButton = document.querySelector('#searchCloseButton')
var searchNav = document.querySelector('#searchNav')
var searchNavInput = document.querySelector('#searchNav input')
var navbarNav = document.querySelector('#navbarNav')
var profileMenu = document.querySelector('#navbarNav .navbar-nav').lastElementChild

/* Interactions
   ================================================================== */
searchButton.addEventListener('click', showSearch)
searchCloseButton.addEventListener('click', closeSearch)


/* Functions
   ================================================================== */
function showSearch() {
  searchToggleStatus = true
  searchNav.classList.add('active')
  searchNavInput.focus()
  navbarNav.classList.add('invisible')
  profileMenu.classList.add('visible')
  // $('#search-overlay').addClass('active')
  // if (searchToggleStatus == true) {
  //   // $(document.body).click(function() {
  //     // console.log('detect click outside');      
  //     //   searchToggleStatus = false
  //     // })
  //     console.log(searchToggleStatus);
  //     console.log('detect click outside');      
  //     searchToggleStatus = false
  //     console.log(searchToggleStatus);
  // } else {
  //   console.log(searchToggleStatus);
  //   console.log('not detecting clicks');
    
  // }
    // $(document.body).click(function () {
    //   console.log('detected click outside');
    //   searchToggleStatus == false
    // }) else {
    // }
}

function closeSearch() {
  console.log('close button working')
  searchNav.classList.remove('active')
  navbarNav.classList.remove('invisible')
  profileMenu.classList.remove('visible')
  // $('#search-overlay').removeClass('active')
}