https://www.norquest.ca/Scripts/custom/core/home-menu.js?v=20260924041057

1let openMenu = document.querySelector(".open-button");
2let closeMenu = document.querySelector("#main-menu .close-button");
3let menu = document.getElementById("main-menu");
4
5let openStartDate = () => {
6	let startdate = document.getElementById("start-date");
7	startdate.classList.add("fade-in");
8	startdate.classList.remove("hidden");
9	setTimeout(() => {
10		startdate.classList.remove("fade-in");
11		startdate.classList.add("visible");
12	}, "250");
13
14	closestartdateMenu = document.querySelector("#start-date .close-button");
15	closestartdateMenu.addEventListener("click", (e) => {
16		e.preventDefault();
17		startdate.classList.add("fade-out");
18		setTimeout(() => {
19			startdate.classList.remove("fade-out");
20			startdate.classList.add("hidden");
21		}, "250");
22	});
23	closestartdateMenu.addEventListener("keypress", (e) => {
24		if (e.key === "Enter") {
25			e.preventDefault();
26			startdate.classList.add("fade-out");
27			setTimeout(() => {
28				startdate.classList.remove("fade-out");
29				startdate.classList.add("hidden");
30			}, "250");
31		}
32	});
33};
34
35if (document.getElementById("start-date")) {
36	startdateMenu = document.querySelector(".select-a-start-date");
37	startdateMenu.addEventListener("click", (e) => {
38		e.preventDefault();
39		openStartDate();
40	});
41
42	startdateMenu.addEventListener("keypress", (e) => {
43		if (e.key === "Enter") {
44			// Cancel the default action, if needed
45			e.preventDefault();
46			openStartDate();
47		}
48	});
49}
50
51if (document.querySelector(".inlineStartDateSelector")) {
52	inlineStartDate = document.querySelectorAll(".inlineStartDateSelector");
53	inlineStartDate.forEach((startDate) => {
54		startDate.addEventListener("click", (e) => {
55			e.preventDefault();
56			openStartDate();
57		});
58	});
59}
60
61openMenu.addEventListener("keypress", (e) => {
62	if (e.key === "Enter") {
63		// Cancel the default action, if needed
64		e.preventDefault();
65		menu.classList.add("fade-in");
66		menu.classList.remove("hidden");
67		menu.removeAttribute("hidden");
68		setTimeout(() => {
69			menu.classList.remove("fade-in");
70			menu.classList.add("visible");
71		}, "250");
72	}
73});
74
75openMenu.addEventListener("click", (e) => {
76	e.preventDefault();
77	menu.classList.add("fade-in");
78	menu.classList.remove("hidden");
79	menu.removeAttribute("hidden");
80	setTimeout(() => {
81		menu.classList.remove("fade-in");
82		menu.classList.add("visible");
83	}, "250");
84});
85
86closeMenu.addEventListener("keypress", (e) => {
87	if (e.key === "Enter") {
88		// Cancel the default action, if needed
89		e.preventDefault();
90		menu.classList.add("fade-out");
91		setTimeout(() => {
92			menu.classList.remove("visible");
93			menu.classList.remove("fade-out");
94			menu.classList.add("hidden");
95			menu.setAttribute("hidden", "");
96		}, "250");
97	}
98});
99
100closeMenu.addEventListener("click", (e) => {
101	e.preventDefault();
102	menu.classList.add("fade-out");
103	setTimeout(() => {
104		menu.classList.remove("visible");
105		menu.classList.remove("fade-out");
106		menu.classList.add("hidden");
107		menu.setAttribute("hidden", "");
108	}, "250");
109});
110
111window.addEventListener("keydown", (e) => {
112	if (e.code == "Escape" && menu.classList.contains("visible")) {
113		menu.classList.add("fade-out");
114		setTimeout(() => {
115			menu.classList.remove("visible");
116			menu.classList.remove("fade-out");
117			menu.classList.add("hidden");
118			menu.setAttribute("hidden", "");
119		}, "250");
120	}
121});
122
123// Wathces the if the menu has scrolled past the top of the screen if it make it sticky
124
125let header = document.querySelector("header");
126
127let options = {
128	root: document.querySelector("body"),
129	rootMargin: "0px 0px 0px 0px",
130	threshold: 1.0,
131};
132/*
133let callback = (entries, observer) => {
134    entries.forEach((entry) => {
135        if (entry.isIntersecting === false) {
136            openMenu.classList.add("stuck")
137            if (document.querySelector(".select-a-start-date")) {
138                document.querySelector(".select-a-start-date").classList.add("stuck")
139            }
140            if (document.querySelector(".shopping-cart")) {
141                document.querySelector(".shopping-cart").classList.add("stuck")
142            }
143        } else {
144            openMenu.classList.remove("stuck")
145            if (document.querySelector(".select-a-start-date")) {
146                document.querySelector(".select-a-start-date").classList.remove("stuck")
147            }
148            if (document.querySelector(".shopping-cart")) {
149                document.querySelector(".shopping-cart").classList.remove("stuck")
150            }   
151        }
152        });
153    };
154
155    if (document.querySelector(".site-alert-container")) {
156        let observer = new IntersectionObserver(callback, options);
157        observer.observe(header);
158    } else {
159        openMenu.classList.add("stuck")
160        if (document.querySelector(".select-a-start-date")) {
161            document.querySelector(".select-a-start-date").classList.add("stuck")
162        }
163        if (document.querySelector(".shopping-cart")) {
164            document.querySelector(".shopping-cart").classList.add("stuck")
165        }
166    }
167*/
168
169window.addEventListener("scroll", (e) => {
170	if (window.innerWidth < 768) {
171		if (window.scrollY > 36) {
172			document.querySelector(".open-button").classList.add("stuck");
173		}
174		if (window.scrollY < 36) {
175			document.querySelector(".open-button").classList.remove("stuck");
176		}
177	}
178
179	if (window.innerWidth >= 768 && window.innerWidth < 1440) {
180		if (window.scrollY > 56) {
181			document.querySelector(".open-button").classList.add("stuck");
182		}
183		if (window.scrollY < 56) {
184			document.querySelector(".open-button").classList.remove("stuck");
185		}
186	}
187	if (window.innerWidth >= 1440) {
188		if (window.scrollY > 92) {
189			document.querySelector(".open-button").classList.add("stuck");
190		}
191		if (window.scrollY < 92) {
192			document.querySelector(".open-button").classList.remove("stuck");
193		}
194	}
195});
196
197document.addEventListener("DOMContentLoaded", () => {
198    updateMenuButtonPos()
199})
200
201window.addEventListener("resize", () => {
202    updateMenuButtonPos()
203})
204
205let updateMenuButtonPos = () => {
206
207    let logo = document.querySelector("main header .logo")
208    let logoPos = logo.getBoundingClientRect();
209    console.log(logoPos.x)
210
211    document.documentElement.style.setProperty("--menuposition", logoPos.x + "px")
212
213}
214
215function getScrollbarWidth() {
216	// Creating invisible container
217	const outer = document.createElement("div");
218	outer.style.visibility = "hidden";
219	outer.style.overflow = "scroll"; // forcing scrollbar to appear
220	outer.style.msOverflowStyle = "scrollbar"; // needed for WinJS apps
221	document.body.appendChild(outer);
222
223	// Creating inner element and placing it in the container
224	const inner = document.createElement("div");
225	outer.appendChild(inner);
226
227	// Calculating difference between container's full width and the child width
228	const scrollbarWidth = outer.offsetWidth - inner.offsetWidth;
229
230	// Removing temporary elements from the DOM
231	outer.parentNode.removeChild(outer);
232
233	return scrollbarWidth;
234}
235document.documentElement.style.setProperty(
236	"--fullscrollbarwidth",
237	"-" + getScrollbarWidth() + "px"
238);
239document.documentElement.style.setProperty(
240	"--halfscrollbarwidth",
241	"-" + getScrollbarWidth() / 2 + "px"
242);
243
244if (getScrollbarWidth() == 0) {
245	document.querySelector("nav .container").classList.add("no-scrollbar");
246}
247
248// Set custom logo width
249
250//let header = document.querySelector("header")
251
252if (header.classList.contains("custom-logo")) {
253	let logo = document.querySelector("header .container .logo img");
254	console.log(logo.width / 10);
255	document.documentElement.style.setProperty(
256		"--logowidth",
257		logo.width / 10 + "em"
258	);
259}
260
261let headings = document.querySelectorAll("nav .menu .heading");

262headings.forEach((heading) => {
263	heading.addEventListener("click", (e) => {
264		e.preventDefault();
265		let openMenus = document.querySelector("nav .menu .open");
266		if (openMenus) {
267			openMenus.classList.remove("open");
268		}
269
270		if (e.target.parentElement != openMenus) {
271			e.target.parentElement.classList.add("open");
272		}
273	});
274});
275
276// Detect if a hero image is present
277
278if (document.querySelector("header.hero")) {
279	document.querySelector("body").classList.add("has-hero");
280}
281
282// Detech if we are on the homepage
283
284if (document.querySelector("main").classList.contains("home")) {
285	document.querySelector("body").classList.add("homepage");
286}
287
288// Watch if the URL is set to open the start date
289
290window.addEventListener("load", () => {
291	if (window.location.hash) {
292		console.log(window.location.hash);
293		let startDate = window.location.hash.replace("#", "").toLowerCase();
294		if (startDate == "start-date") {
295			let startdate = document.getElementById("start-date");
296			startdate.classList.remove("hidden");
297			startdate.classList.add("visible");
298			closestartdateMenu = document.querySelector("#start-date .close-button");
299			closestartdateMenu.addEventListener("click", (e) => {
300				e.preventDefault();
301				startdate.classList.add("fade-out");
302				setTimeout(() => {
303					startdate.classList.remove("fade-out");
304					startdate.classList.add("hidden");
305				}, "250");
306			});
307			closestartdateMenu.addEventListener("keypress", (e) => {
308				if (e.key === "Enter") {
309					e.preventDefault();
310					startdate.classList.add("fade-out");
311					setTimeout(() => {
312						startdate.classList.remove("fade-out");
313						startdate.classList.add("hidden");
314					}, "250");
315				}
316			});
317		}
318	}
319});