https://somersetnlv.org/apps-shared/navigation/navigation.js?acn=384110

1function ENResponsiveNavigation(enNav, params) {
2
3    this.init = function(enNav, params) {
4        let me  = this;
5        this.params = params ? params : {};
6        if (enNav.tagName == "HEADER" || enNav.tagName == "DIV") {
7            this.container = enNav;
8            this.enNav = this.container.querySelector("nav.en-nav");
9        } else if (enNav.tagName == "NAV") {
10            this.enNav = enNav;
11        } else {
12            throw("Invalid navigation. Tag name is '" + enNav.tagName + "' (expected: 'NAV', 'HEADER' or 'DIV')");
13        }
14        if (this.enNav == null) {
15            throw ("Navigation is null.");
16        }
17        if (this.enNav.tagName != "NAV") {
18            throw("Invalid navigation. Tag name is '" + this.enNav.tagName + "' (expected: 'NAV')");
19        }
20
21        for (let c = 0; c < this.enNav.childNodes.length; c++) {
22            if (this.enNav.childNodes[c].tagName == "UL" && this.menu == null) {
23                this.menu = this.enNav.childNodes[c];
24            }
25        }
26        if (this.menu == null) {
27            throw ("Menu list (UL) could not be found.");
28        }
29
30        if (!this.params.expandAtStart || (this.params.expandAtStart !== "all" && this.params.expandAtStart !== "first-level-only" && this.params.expandAtStart !== "no")) {
31            let expandAtStart = this.enNav.getAttribute("mobnav-expand-at-start");
32            if (expandAtStart === "all" || expandAtStart === "first-level-only" || expandAtStart === "no") {
33                this.params.expandAtStart = expandAtStart;
34            } else {
35                this.params.expandAtStart = "first-level-only";
36            }
37        }
38
39        if (this.params.appearFrom != null) {
40            if (this.params.appearFrom.trim().toLowerCase() === "left") {
41                this.enNav.classList.add("en-mobnav-slide-from-left");
42            } else if (this.params.appearFrom.trim().toLowerCase() === "right") {
43                this.enNav.classList.remove("en-mobnav-slide-from-left");
44            }
45        }
46
47        this.initClickEventListeners(this.menu);
48        document.addEventListener("keydown", function(e) {
49            if (e.keyCode == 27) {
50                me.hideMenu();
51            }
52        });
53        this.mobileMenuBackground = document.createElement("div");
54        this.mobileMenuBackground.classList.add("en-mobnav-bg");
55        let enButtons;
56        if (this.container) {
57            enButtons = this.container.querySelectorAll("button");
58        } else {
59            enButtons = this.enNav.querySelectorAll("button");
60        }
61        enButtons.forEach((thisButton) => {
62            if(!thisButton.getAttribute("onclick")) {
63                if (thisButton.getAttribute("en-action") == "mobnav-toggle") {
64                    thisButton.addEventListener("click", function(e) {
65                        me.toggleMenu();
66                    });
67                }
68                if (thisButton.getAttribute("en-action") == "mobnav-hide") {
69                    thisButton.addEventListener("click", function(e) {
70                        me.hideMenu();
71                    });
72                }
73            }
74        });
75    }
76
77    this.showMenu = function() {
78        document.body.appendChild(this.mobileMenuBackground);
79        this.mobileMenuBackground.classList.add("en-mobnav-bg-blur");
80        this.enNav.classList.remove("en-mobnav-hide");
81        this.enNav.classList.add("en-mobnav-show");
82        document.body.classList.add("disable-overflow");
83        document.body.classList.add("en-mobnav-active");
84        document.documentElement.classList.add("disable-overflow");
85        document.documentElement.classList.add("en-mobnav-active");
86        this.enNav.querySelector("a").focus();
87    }
88
89    this.hideMenu = function() {
90        this.enNav.classList.remove("en-mobnav-show");
91        this.enNav.classList.add("en-mobnav-hide");
92
93        this.mobileMenuBackground.classList.remove("en-mobile-nav-background-blur");
94        this.mobileMenuBackground.remove();
95        document.documentElement.classList.remove("disable-overflow");
96        document.documentElement.classList.remove("en-mobnav-active");
97        document.body.classList.remove("disable-overflow");
98        document.body.classList.remove("en-mobnav-active");
99    }
100
101    this.toggleMenu = function() {
102        if (this.enNav.classList.contains("en-mobnav-show")) {
103            this.hideMenu();
104        } else {
105            this.showMenu();
106        }
107    }
108
109    this.initClickEventListeners = function(parent, level) {
110        if (level == null || level < 0) {
111            level = 0;
112        }
113        let curStyle = parent.getAttribute("style") || "";
114        parent.style = curStyle + (!curStyle.endsWith(";") ? ";" : "") + " --en-menu-level: " + level + ";";
115        for (let c = 0; c < parent.childNodes.length; c++) {
116            let thisEl = parent.childNodes[c];
117            if (thisEl.tagName != "LI") {
118                continue;
119            }
120            let thisSubmenuLink;
121            for (let x = 0; x < thisEl.childNodes.length; x++) {
122                if (thisEl.childNodes[x].tagName == "A") {
123                    thisSubmenuLink = thisEl.childNodes[x];
124                    continue;
125                }
126                if (thisEl.childNodes[x].tagName == "UL" && thisSubmenuLink != null) {
127                    let thisMenu = thisEl.childNodes[x];
128                    if (this.params.expandAtStart === "all" || (this.params.expandAtStart === "first-level-only" && level == 0)) {
129                        thisMenu.classList.add("en-mobile-submenu-open");
130                        thisEl.classList.add("en-mobile-submenu-opened");
131                    }
132                    thisSubmenuLink.onclick = function(e) {
133                        if (thisEl.classList.contains("en-mobile-submenu-opened")) {
134                            thisMenu.classList.add("en-mobile-submenu-close");
135                            thisEl.classList.remove("en-mobile-submenu-opened");
136                        } else {
137                            thisMenu.classList.remove("en-mobile-submenu-close");
138                            thisMenu.classList.add("en-mobile-submenu-open");
139                            thisEl.classList.add("en-mobile-submenu-opened");
140                        }
141                        e.stopPropagation();
142                    }
143                    thisEl.classList.add("en-has-submenu");
144                    this.initClickEventListeners(thisMenu, level + 1);
145                    break;
146                }
147            }
148        }
149    }
150
151    this.init(enNav, params);
152}
153
154document.addEventListener('readystatechange', () => {
155    if ("complete" === document.readyState) {
156        let navContainers = document.querySelectorAll("[en-init-nav]");

157        navContainers.forEach((thisCont) => {
158            if (thisCont.getAttribute("en-init-nav").toLowerCase() == "true") {
159                thisCont.removeAttribute("en-init-nav");
160                new ENResponsiveNavigation(thisCont, null);
161            }
162        });
163        if (navContainers.length == 0) {
164            let globalMenuParams = null;
165            try {
166                globalMenuParams = _enNavMobileMenuParams;
167            } catch (e) {}
168
169            if (globalMenuParams) {
170                window._ennav = new ENResponsiveNavigation(document.querySelector(".en-nav"), globalMenuParams);
171            }
172
173        }
174    }
175});
176
177
178