const RAF = requestAnimationFrame;
const $nav = document.querySelector('nav.depth3');
const threshold = $nav.getBoundingClientRect();
let updating = false;

const handleScroll = () => {
  console.info('updating');
  if (window.scrollY >= 600 || window.pageYOffset >= 600)
  $nav.classList.add('nav_fixed');else
  $nav.classList.remove('nav_fixed');
  updating = false;
};

window.onscroll = () => {
  if (updating) return;else
  {
    updating = true;
    RAF(handleScroll);
  }
};

$(function() {
  
  $(document).on("scroll", scroll);  
  menu = $('nav.depth3 a');  
  menu.filter(':first').addClass('tit'); 
  menu.on('click', function() {
    $(document).off("scroll");
    var id = $(this).attr('href'),
        target = this.hash;
    menu.removeClass('tit');
    $(this).addClass('tit'); 
    $('html, body').animate({ scrollTop: $(id).offset().top }, {
      duration: 500, 
      complete: function() { 
        $(document).on("scroll", scroll);
      }
    });
    return false;
  });
  
});

function scroll(event){
    var scrollPos = $(document).scrollTop();
    menu.each(function () {
        var currLink = $(this);
        var refElement = $(currLink.attr("href"));
        if (refElement.position().top <= scrollPos && refElement.position().top + refElement.height() > scrollPos) {
            menu.removeClass("tit");
            currLink.addClass("tit");
        }
        else{
            currLink.removeClass("");
        }
    });
}