// Custom JS to make the site look pretty while ITS shrinks and expands the window with the menu open const NAV_ELEMENT_ID_STRING = 'headerGlobalNavbar'; // ID built into the site's HMTL const NAVBAR_COLLAPSE_ID = 'headerGlobalNavbarContent'; // ID built into the sites' HTML const GLOBAL_NAVIGATION_ITEMS = 'navGlobalBottom'; // ID built into the site's HMTL const NAVBAR_ELEMENT = document.getElementById(NAV_ELEMENT_ID_STRING); // The <nav> element built into the site's HMTL const BOOTSTRAP_COLLAPSE_SHOW_CLASS_STRING = 'show'; const BOOTSTRAP_DROPDOWN_TOGGLER_CLASS = '.dropdown-toggle'; // Class specific to Bootstrap 4 code

function openNavigationCollapse() {

if ( NAVBAR_ELEMENT.navbar_toggled === true )  // Track if the navbar has already been toggled
  return; // Bail-out to prevent repetitive calls to the code below (without this the code is called many, many, many times while the screen is resizing)

const menuCollapseElement = document.getElementById(NAVBAR_COLLAPSE_ID);

NAVBAR_ELEMENT.navbar_toggled = true;
$(menuCollapseElement).collapse(BOOTSTRAP_COLLAPSE_SHOW_CLASS_STRING);  // BOOTSTRAP 4 METHOD (requires jQuery (yuck!).)!!! Official BS4 docs on `.collapse()` https://getbootstrap.com/docs/4.4/components/collapse/#via-javascript

}

function checkForOpenDropdownMenus(menuItem) {

const dropdown = menuItem.parentElement;

if ( dropdown.classList.contains(BOOTSTRAP_COLLAPSE_SHOW_CLASS_STRING) ) {
  openNavigationCollapse();
}

}

function loopOverDropdownItems(nodeList) {

let len = nodeList.length;

for (var i = 0; i < len; i++) {
  checkForOpenDropdownMenus(nodeList[i]);
}

}

function windowResizeHandler() {

const dropdownToggleNodeList = document.getElementById(GLOBAL_NAVIGATION_ITEMS).querySelectorAll(BOOTSTRAP_DROPDOWN_TOGGLER_CLASS);

if ( window.innerWidth <= 992 ) {
  loopOverDropdownItems(dropdownToggleNodeList);
} else {
  NAVBAR_ELEMENT.navbar_toggled = false;
}

}

function toggleDropdownOnWindowResize() {

if ( ! NAVBAR_ELEMENT )
  return;

window.addEventListener('resize', windowResizeHandler);

}

export default toggleDropdownOnWindowResize;