https://www.iglta.org/includes/public/managed/v_a2e6ae52_e071b31d/…/virtuals/js/custom_nav_desktop_dropdown.js

1define([
2	'jquery',
3	'plugins_nav_custom_nav_helper',
4	'goatee',
5], function ($, navHelper, goatee) {
6	return {
7		init: function (root, desktopNavSelector, depth) {
8			var desktopNav = root.find(desktopNavSelector);
9			var navItemsTemplate = desktopNav.find('[data-nav-item-template]').html();
10
11			var children = desktopNav.find('.level-1.nav-item');
12			var numChildren = children.length;
13
14			children.each(function (i, el) {
15				if ((i + 3) >= numChildren) {
16					$(this).addClass('on-right');
17				}
18			});
19
20			desktopNav.on('click', '[data-dropdown-toggle]', handleDropdownToggle);
21			desktopNav.on('mouseenter', '[data-nav-item]', handleDropdownEnter);
22			desktopNav.on('mouseleave', '[data-nav-item]', handleDropdownLeave);
23
24			function handleDropdownToggle(e) {
25				var node = $(this);
26				var navItem = node.closest('[data-nav-item]');
27				var dropdownMenu = _getDropdown(navItem);
28				var dropdownMenuIsOpen = dropdownMenu.hasClass('open');
29
30				if (dropdownMenuIsOpen) {
31					hideDropdown(dropdownMenu);
32				} else {
33					showDropdown(dropdownMenu);
34				}
35			}
36
37			function handleDropdownLeave(e) {
38				var navItem = $(this);
39				var dropdownMenu = _getDropdown(navItem);
40
41				if (dropdownMenu.length === 0) { return; }
42
43				hideDropdown(dropdownMenu);
44			}
45
46			function hideDropdown(dropdownMenu) {
47				dropdownMenu.find('a, button').attr('tabindex', '-1');
48				dropdownMenu.removeClass('open');
49				dropdownMenu.closest('[data-nav-item]').removeClass('open');
50			}
51
52			function handleDropdownEnter(e) {
53				var navItem = $(this);
54				var dropdownMenu = _getDropdown(navItem);
55
56				if (dropdownMenu.length === 0) { return; }
57
58				showDropdown(dropdownMenu);
59			}
60
61			function showDropdown(dropdownMenu) {
62				var dropdownNotRendered = !dropdownMenu.hasClass('rendered');
63
64				if (dropdownNotRendered) {
65					_renderDropdown(dropdownMenu);
66				}
67				_showDropdown(dropdownMenu);
68			}
69
70			function _renderDropdown(dropdownMenu) {
71				var start = dropdownMenu.attr('data-start');
72				var section = dropdownMenu.attr('data-section');
73
74				navHelper.getNavTree({
75					section: section,
76					start: start,
77					depth: depth,
78					checkForChildren: false,
79				}, function (err, res) {
80					if (err) { console.log(err); return; }
81
82					var html = goatee.fill(navItemsTemplate, res);
83					dropdownMenu.html(html);
84					dropdownMenu.addClass('rendered');
85				});
86			}
87
88			function _showDropdown(dropdownMenu) {
89				dropdownMenu.find('a, button').attr('tabindex', '0');
90				dropdownMenu.addClass('open');
91				dropdownMenu.closest('[data-nav-item]').addClass('open');
92			}
93
94			function _getDropdown(navItem) {
95				var navId = navItem.attr('data-id')
96				return navItem.find('[data-dropdown-menu]').filter(function (i, val) {
97					return $(val).closest('[data-nav-item]').attr('data-id') === navId
98				});
99			}
100		}
101	}
102});