diff --git a/src/patterns/04-components/menu/menu--horizontal/menu--horizontal.js b/src/patterns/04-components/menu/menu--horizontal/menu--horizontal.js index c494ab85d1ad614bd6fd4eaffcd5774e0b3df2d4..e1408004aefd753ebe6307f413506e3357a4a9bc 100644 --- a/src/patterns/04-components/menu/menu--horizontal/menu--horizontal.js +++ b/src/patterns/04-components/menu/menu--horizontal/menu--horizontal.js @@ -9,6 +9,7 @@ // uw-horizontal-nav. $(document).ready( function () { + // Have to add the run this code only once, so that multiple // loads of the menu are not shown when logged in. $(document, context).once('menuhorizontal').each( @@ -19,14 +20,9 @@ var menus = document.querySelectorAll('.menu--horizontal'); var items = document.querySelectorAll('.menu__item'); - /* Toggle mobile menu */ /** - * Javascript for Toggle mobile menu - * Allows for buttons to be used. - * @const {string} - * @const {string} - * @const {Object} - * @const {Object} + * Javascript for Toggle mobile menu, + * allows for buttons to be used. * @returns {boolean} css for toggle. */ function toggleMenu() { @@ -50,12 +46,8 @@ } /** - * Javascript for Toggle items - * Allows for buttons to be used. - * @const {string} - * @const {string} - * @const {Object} - * @const {Object} + * Javascript for Toggle items, + * allows for buttons to be used. * @returns {boolean} css for toggle. */ function toggleItem() { @@ -72,6 +64,7 @@ this.setAttribute('aria-expanded', 'false'); } + // If hamburger. if (screenWidth <= 767) { // Look at parents and reset the menus. @@ -106,22 +99,14 @@ } for (let menu of menus) { - /* Close Submenu From Anywhere */ - /** - * Javascript - * Allows for close menu. - * @returns {boolean} close menu. - */ - function closeSubmenu(e) { - + document.addEventListener('click', function(e) { let isClickInside = menu.contains(e.target); if (!isClickInside && menu.querySelector('.submenu-active')) { menu.querySelector('.submenu-active').classList.remove('submenu-active'); } - } - document.addEventListener('click', closeSubmenu, false); + }); } for (let item of items) { @@ -160,14 +145,10 @@ toggle.addEventListener('click', toggleMenu, false); } - // Apply timeout to the to event firing - // so it fires at end of event. /** * Javascript for debounce - * @var {string} - * @var {Object} - * @const {Object} - * @returns {funcction} debounce. + * @param {func} func, the type of function. + * @returns {function} debounce. */ function debouncer(func) { var timeoutID; @@ -188,10 +169,7 @@ // force the button click if wider that 767px. /** * Javascript for check width - * @var {string} - * @var {Object} - * @const {Object} - * @returns {funcction} how wide. + * @returns {function} how wide. */ function menuCheckWidth() { // Check if menu is on page.