https://www.4bu.com.au/wp-content/themes/gb-station/assets/js/libs/_nav-off-canvas.js?m=1777684737g

1
2function hamburgerOnClick() {
3	let main = document.getElementById('primary');
4	let footer = document.getElementsByClassName('gb-footer');
5	let hamburger_button = document.getElementById('hamburger');
6	let nav_container = document.getElementById('off-canvas-nav');
7
8	if(hamburger_button.classList.contains('is-active') && nav_container.classList.contains('open')) {
9		hamburger_button.classList.remove('is-active');
10		nav_container.classList.remove('open');
11		main.classList.remove('open');
12		footer[0].classList.remove('open');
13	} else {
14		hamburger_button.classList.add('is-active');
15		nav_container.classList.add('open');
16		main.classList.add('open');
17		footer[0].classList.add('open');
18	}
19}
20
21let acc = document.getElementsByClassName('btn-accordion-trigger');
22
23let firstAccordion;
24let firstPanel;
25
26if(acc.length > 0) {
27// Open the first accordion
28	firstAccordion = acc[0];
29	firstPanel = firstAccordion.nextElementSibling;
30}
31
32// firstAccordion.classList.add("active");
33// firstPanel.style.maxHeight = firstPanel.scrollHeight + "px";
34

35// Add onclick listener to every accordion element
36for (let i = 0; i < acc.length; i++) {
37	acc[i].onclick = function() {
38
39		// For toggling purposes detect if the clicked section is already "active"
40		let isActive = this.classList.contains("active");
41
42		// Close all accordions
43		let allAccordions = document.getElementsByClassName("btn-accordion-trigger");
44
45		let j;
46
47		for (j = 0; j < allAccordions.length; j++) {
48
49			// Remove active class from section header
50			allAccordions[j].classList.remove("active");
51
52			// Remove the max-height class from the panel to close it
53			let panel = allAccordions[j].nextElementSibling;
54
55			let maxHeightValue = getStyle(panel, "maxHeight");
56
57			if (maxHeightValue !== "0px") {
58				panel.style.maxHeight = null;
59			}
60		}
61
62
63		// Toggle the clicked section using a ternary operator
64		isActive ? this.classList.remove("active") : this.classList.add("active");
65
66		// Toggle the panel element
67		let panel = this.nextElementSibling;
68		let maxHeightValue = getStyle(panel, "maxHeight");
69
70		if (maxHeightValue !== "0px") {
71			panel.style.maxHeight = null;
72		} else {
73			panel.style.maxHeight = panel.scrollHeight + "px";
74		}
75	};
76}
77
78// Cross-browser way to get the computed height of a certain element. Credit to @CMS on StackOverflow (http://stackoverflow.com/a/2531934/7926565)
79function getStyle(el, styleProp) {
80	var value, defaultView = (el.ownerDocument || document).defaultView;
81	// W3C standard way:
82	if (defaultView && defaultView.getComputedStyle) {
83		// sanitize property name to css notation
84		// (hypen separated words eg. font-Size)
85		styleProp = styleProp.replace(/([A-Z])/g, "-$1").toLowerCase();
86		return defaultView.getComputedStyle(el, null).getPropertyValue(styleProp);
87	} else if (el.currentStyle) { // IE
88		// sanitize property name to camelCase
89		styleProp = styleProp.replace(/\-(\w)/g, function(str, letter) {
90			return letter.toUpperCase();
91		});
92		value = el.currentStyle[styleProp];
93		// convert other units to pixels on IE
94		if (/^\d+(em|pt|%|ex)?$/i.test(value)) {
95			return (function(value) {
96				var oldLeft = el.style.left, oldRsLeft = el.runtimeStyle.left;
97				el.runtimeStyle.left = el.currentStyle.left;
98				el.style.left = value || 0;
99				value = el.style.pixelLeft + "px";
100				el.style.left = oldLeft;
101				el.runtimeStyle.left = oldRsLeft;
102				return value;
103			})(value);
104		}
105		return value;
106	}
107}
108
109
110