JavaScript Force Scroll on Click

event-calendar-scroll-up-on-ajax-reload.js

/**
 * Scroll to top of page when lower nav link is clicked in calendar.
 */
import { ready } from '../utils/ready';

function fetchButtons() {
  return document.querySelectorAll(
    '.tribe-events-c-nav__list-item > a, .tribe-events-c-nav__list-item > button'
  );
}

function addListeners(buttons) {
  buttons.forEach((btn) => {
    btn.addEventListener('click', (e) => {
      e.stopPropagation();

      // Slight delay for aesthetic purposes.
      setTimeout(function () {
        window.scrollTo(0, 0);
      }, 1000);

      // Delay to set new listeners via recursion.
      setTimeout(function () {
        let newButtons = fetchButtons();
        if (newButtons.length !== 0) {
          addListeners(newButtons);
        }
      }, 4000);
    });
  });
}

ready(() => {
  let eventNavButtons = fetchButtons();
  if (eventNavButtons.length === 0) {
    return;
  } else {
    addListeners(eventNavButtons);
  }
});