https://nic.bc.ca/_resources/js/scripts.js

1//Adds auto focus to search when opened
2$("#siteSearch").on("shown.bs.modal", function () {
3	$("body").addClass("modal-open-search");
4	$("#siteSearch .form-text").focus();
5});
6$("#siteSearch").on("hide.bs.modal", function () {
7	$("body").removeClass("modal-open-search");
8});
9
10$("#site-navigation").on("shown.bs.modal", function () {
11	$("body").addClass("modal-open-menu-mobile");
12});
13$("#site-navigation").on("hide.bs.modal", function () {
14	$("body").removeClass("modal-open-menu-mobile");
15});
16
17// UAT 236486
18function resetHover() {
19	document.body.classList.add("reset-hover");
20	setTimeout(() => document.body.classList.remove("reset-hover"), 50);
21}
22
23
24document.addEventListener("visibilitychange", resetHover);
25
26// UAT 237837
27document.addEventListener("touchstart", function (event) {
28	if (event.target === document.body) {
29		resetHover();
30	}
31});
32
33
34jQuery(document).ready(function ($) {
35	var alterClass = function () {
36		var ww = document.body.clientWidth;
37		if (ww >= 1200) {
38			$(".modal").modal("hide");
39		}
40	};
41	$(window).resize(function () {
42		alterClass();
43	});
44	//Fire it when the page first loads:
45	alterClass();
46});
47
48//Scroll to top button
49jQuery(document).ready(function ($) {
50	// browser window scroll (in pixels) after which the "back to top" link is shown
51	var offset = 300,
52		//browser window scroll (in pixels) after which the "back to top" link opacity is reduced
53		offset_opacity = 1200,
54		//duration of the top scrolling animation (in ms)
55		scroll_top_duration = 700,
56		//grab the "back to top" link
57		$back_to_top = $(".cd-top");
58
59	//hide or show the "back to top" link
60	$(window).scroll(function () {
61		$(this).scrollTop() > offset
62			? $back_to_top.addClass("cd-is-visible")
63		: $back_to_top.removeClass("cd-is-visible cd-fade-out");
64		if ($(this).scrollTop() > offset_opacity) {
65			$back_to_top.addClass("cd-fade-out");
66		}
67	});
68
69	//smooth scroll to top
70	$back_to_top.on("click", function (event) {
71		event.preventDefault();
72		$("body,html").animate(
73			{
74				scrollTop: 0,
75			},
76			scroll_top_duration
77		);
78	});
79});
80
81$(document).ready(function () {
82	document.getElementById("year").innerHTML = new Date().getFullYear();
83});
84
85$(document).ready(function () {
86	// Get the height of the header
87	var headerHeight = $('header').outerHeight();
88	// Select all links with hashes
89	$('a[href*="#"]')
90	// Remove links that don't actually link to anything
91		.not('[href="#"]')
92		.not('[href="#0"]')
93		.not("[data-bs-toggle]")
94		.click(function (event) {
95		// On-page links
96		if (
97			location.pathname.replace(/^\//, "") ===
98			this.pathname.replace(/^\//, "") &&
99			location.hostname === this.hostname
100		) {
101			// Figure out element to scroll to
102			var target = $(this.hash);
103			target = target.length
104				? target
105			: $("[name=" + this.hash.slice(1) + "]");
106			// Does a scroll target exist?
107			if (target.length) {
108				// Only prevent default if animation is actually gonna happen
109				event.preventDefault();
110				$("html, body").animate(
111					{
112						scrollTop: target.offset().top - headerHeight,
113					},
114					1000,
115					function () {
116						// Callback after animation
117						// Must change focus!
118						var $target = $(target);
119						$target.focus();
120						if ($target.is(":focus")) {
121							// Checking if the target was focused
122							return false;
123						} else {
124							$target.attr("tabindex", "-1"); // Adding tabindex for elements not focusable
125							$target.focus(); // Set focus again
126						}
127					}
128				);
129			}
130		}
131	});
132});
133
134
135document.addEventListener("DOMContentLoaded", function () {
136	"use strict";
137
138	var cookieAlert = document.querySelector(".cookiealert");
139	var acceptCookies = document.querySelector(".acceptcookies");
140
141	if (!cookieAlert) {
142		return;
143	}
144
145	cookieAlert.offsetHeight; // Force browser to trigger reflow (https://stackoverflow.com/a/39451131)
146
147	// Show the alert if we can't find the "acceptCookies" cookie
148	if (!getCookie("acceptCookies")) {
149		cookieAlert.classList.add("show");
150	}
151
152	// When clicking on the agree button, create a 1 year
153	// cookie to remember the user's choice and close the banner
154	acceptCookies.addEventListener("click", function () {
155		setCookie("acceptCookies", true, 365);
156		cookieAlert.classList.remove("show");
157	});
158
159	// Cookie functions from w3schools
160	function setCookie(cname, cvalue, exdays) {
161		var d = new Date();
162		d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
163		var expires = "expires=" + d.toUTCString();
164		document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
165	}
166
167	function getCookie(cname) {
168		var name = cname + "=";
169		var decodedCookie = decodeURIComponent(document.cookie);
170		var ca = decodedCookie.split(';');
171		for (var i = 0; i < ca.length; i++) {
172			var c = ca[i];
173			while (c.charAt(0) === ' ') {
174				c = c.substring(1);
175			}
176			if (c.indexOf(name) === 0) {
177				return c.substring(name.length, c.length);
178			}
179		}
180		return "";
181	}
182});
183
184
185$(document).ready(function () {
186	var playing = true;
187	$(".play-pause").click(function () {
188		if (playing == false) {
189			document.getElementById("myVideo").play();
190			playing = true;
191			$(this).html("<span class='fa fa-pause'></span>");
192		} else {
193			document.getElementById("myVideo").pause();
194			playing = false;

195			$(this).html("<span class='fa fa-play'></span>");
196		}
197	});
198});
199
200
201function hasTouch() {
202	return (
203		"ontouchstart" in document.documentElement ||
204		navigator.maxTouchPoints > 0 ||
205		navigator.msMaxTouchPoints > 0
206	);
207}
208
209if (hasTouch()) {
210	// remove all the :hover stylesheets
211	try {
212		// prevent exception on browsers not supporting DOM styleSheets properly
213		for (var si in document.styleSheets) {
214			var styleSheet = document.styleSheets[si];
215			if (!styleSheet.rules) continue;
216
217			for (var ri = styleSheet.rules.length - 1; ri >= 0; ri--) {
218				if (!styleSheet.rules[ri].selectorText) continue;
219
220				if (styleSheet.rules[ri].selectorText.match(":hover")) {
221					styleSheet.deleteRule(ri);
222				}
223			}
224		}
225	} catch (ex) { }
226}
227
228
229// keep side nav open on desktop view
230// Detect screen width and remove data-bs-toggle attribute on larger screens
231window.addEventListener('DOMContentLoaded', function () {
232	const sidenavHeading = document.querySelector('.sidenav-accordion .sidenav-heading');
233	const accordionMainCollapse = document.querySelector('.sidenav-accordion .accordion-main-collapse');
234
235	function handleToggle() {
236		const screenWidth = window.innerWidth;
237		if (screenWidth >= 991) { // Adjust the breakpoint as needed
238			accordionMainCollapse.classList.add('show');
239			sidenavHeading.removeAttribute('data-bs-toggle');
240		} else {
241			accordionMainCollapse.classList.remove('show');
242			sidenavHeading.setAttribute('data-bs-toggle', 'collapse');
243		}
244	}
245
246	if (sidenavHeading) {
247		handleToggle(); // Call the function on page load
248
249		// Call the function when the window is resized
250		// 		window.addEventListener('resize', handleToggle);
251	}
252});
253
254
255$(document).ready(function () {
256	const $header = $('#site-navigation');
257	const $body = $('body');
258	const $navbarDropdown = $('#navbarNavDropdown');
259	const $stickyHeaderGap = $('.sticky-header-gap');
260
261	// Function to adjust the height of the sticky-header-gap
262	function adjustStickyHeaderHeight() {
263		if ($header.length) {
264			const headerHeight = $header.outerHeight();
265			$stickyHeaderGap.css('height', headerHeight + 'px');
266		} else {
267			console.error('Header element not found');
268		}
269	}
270
271	// Function to toggle body scroll based on navbar-collapse state
272	function toggleBodyScroll() {
273		if ($navbarDropdown.hasClass('show')) {
274			$body.css('overflow', 'none');
275		} else {
276			$body.css('overflow', '');
277		}
278	}
279
280	// Initialize sticky header and toggle scroll on page load
281	adjustStickyHeaderHeight();
282	toggleBodyScroll();
283
284	// Event bindings
285	$(window).resize(adjustStickyHeaderHeight);
286
287	$navbarDropdown.on('show.bs.collapse hide.bs.collapse', toggleBodyScroll);
288});
289
290
291// header 
292$(document).ready(function () {
293	const $body = $('body');
294	const $header = $('#site-navigation');
295	const $navbarToggler = $('#site-navigation .navbar-toggler');
296	const $stickyHeaderGap = $('.sticky-header-gap');
297
298	if ($navbarToggler.length) {
299		function toggleIcon() {
300			const $icon = $navbarToggler.find('span.fa');
301			if ($icon.length) {
302				if ($navbarToggler.attr('aria-expanded') === 'true') {
303					$icon.removeClass('fa-bars').addClass('fa-times');
304					$body.css('overflow', 'hidden'); // Prevent scrolling when the menu is open
305				} else {
306					$icon.removeClass('fa-times').addClass('fa-bars');
307					$body.css('overflow', 'auto'); // Re-enable scrolling when the menu is closed
308				}
309			}
310		}
311
312		$navbarToggler.on('click', function () {
313			// Ensure aria-expanded is toggled appropriately here or elsewhere
314			toggleIcon();
315		});
316	} else {
317		console.error('Navbar toggler element not found');
318	}
319
320	function adjustStickyHeaderHeight() {
321		if ($header.length) {
322			const headerHeight = $header.outerHeight();
323			$stickyHeaderGap.css('height', headerHeight + 'px');
324		} else {
325			console.error('Header element not found');
326		}
327	}
328
329	adjustStickyHeaderHeight();
330	$(window).resize(adjustStickyHeaderHeight);
331
332
333	// header search icon toggler
334	document.getElementById('headerSearchToggler').addEventListener('click', function () {
335		var searchInput = document.getElementById('search');
336		searchInput.classList.toggle('active');
337	});
338});
339
340
341// Navigation Close Ticket 235393
342let lastScrollPosition = 0;
343// Define the function to close navigation
344function handleNavClose() {

345	const viewportHeight = window.innerHeight * 0.5;
346	const heading = document.querySelector(".navbar-nav a.dropdown-toggle.show");
347	const menu = document.querySelector(".navbar-nav .dropdown-menu.show");
348	const currentScrollPosition = window.scrollY;
349
350	// Check if the vertical scroll position is more than the viewport height
351	if (window.scrollY > viewportHeight) {
352		if (heading != null) {
353			heading.classList.remove("show");
354			heading.setAttribute("aria-expanded", "false");
355			heading.setAttribute("data-bs-popper", "");
356			heading.blur();
357		}
358		if (menu != null) {
359			menu.classList.remove("show");
360		}
361	}
362
363
364	// Update the last scroll position for the next scroll event
365	lastScrollPosition = currentScrollPosition;
366}
367
368// Attach the function to relevant window events
369["scroll"].forEach(event => {
370	window.addEventListener(event, handleNavClose);
371});
372
373