document.addEventListener("DOMContentLoaded", function () {
  const menubar = new Menubar(document.getElementById('main-nav'));
  menubar.init();

  const menu_toggle_links = [].slice.call(document.querySelectorAll('#main-nav .hasSub > a'));

  const close_all_submenus = function () {
    menu_toggle_links.map(function (item) {
      item.setAttribute('aria-expanded', 'false')
    });
  };

  // open close
  document.addEventListener('click', function (e) {
    if (!menu_toggle_links.includes(e.target)) {
      close_all_submenus();
      return;
    }

    e.preventDefault();
    e.stopImmediatePropagation();
    const menu_item = e.target;

    if (menu_item.getAttribute('aria-expanded') === 'true') {
      close_all_submenus();
      return;
    }

    close_all_submenus();
    menu_item.setAttribute('aria-expanded', 'true');
  });

  // toggle active state on sub menu items including their parent
  const menu_links_all = [].slice.call(document.querySelectorAll('#main-nav a'));
  const menu_links_sub = [].slice.call(document.querySelectorAll('#main-nav ul a'));
  menu_links_sub.map(function (a) {
    a.addEventListener('click', function () {
      if (a.classList.contains('active')) {
        return;
      }

      menu_links_all.map(function (l) {
        l.classList.remove('active');
      });
      a.classList.add('active');
      const parent = a.parentNode.parentNode.previousSibling;

      if (parent) {
        if (parent.hasAttribute('aria-expanded')) {
          parent.classList.add('active');
        }
      }
    });
  });

  // toggle active state on first level menu items
  const menu_links_first_level_no_sub = [].slice.call(document.querySelectorAll('#main-nav > li > a[aria-haspopup="false"]'))
  menu_links_first_level_no_sub.map(function (a) {
    a.addEventListener('click', function () {
      menu_links_all.map(function (l) {
        l.classList.remove('active')
      });
      a.classList.add('active');
    });
  });
});