https://vitalchek.com/v/js/ad/readMore.js

1document.addEventListener("DOMContentLoaded", () => {
2	setFixedCardHeight();
3});
4
5window.addEventListener("resize", () => {
6	setFixedCardHeight();
7});
8
9document.addEventListener("click", (e) => {
10	const button = e.target.closest(".read-more-toggle");
11	if (!button) return;
12
13	const expanded = button.getAttribute("aria-expanded") === "true";
14	const panelId = button.getAttribute("aria-controls");
15	const panel = document.getElementById(panelId);
16
17	if (!panel) return;
18
19	button.setAttribute("aria-expanded", String(!expanded));
20
21	updateLabel(button, expanded);
22
23	const opening = !expanded;
24	if (opening) {
25		openPanel(panel);
26	} else {
27		closePanel(panel);
28	}
29
30});
31
32// This is for the accordion in the new product landing page hero section
33document.addEventListener("click", (e) => {
34	const accordionButton = e.target.closest(".landing-accordion-button");
35	if (!accordionButton) return;
36
37	const icon = accordionButton.closest(".accordion-header").querySelector(".accordion-header__icon-container");
38
39	if (icon) {
40		icon.classList.toggle("is-open");
41	}
42
43	const expanded = accordionButton.getAttribute("aria-expanded") === "true";
44	updateLabel(accordionButton, !expanded);
45
46});
47
48document.addEventListener("DOMContentLoaded", () => {
49	const accordion = document.getElementById("introList");
50
51	if (!accordion) return;
52
53	const buttons = Array.from(
54		accordion.querySelectorAll(".landing-accordion-button")
55	);
56
57	accordion.addEventListener("keydown", (event) => {
58		const currentIndex = buttons.indexOf(document.activeElement);
59
60		if (currentIndex === -1) return;
61
62		let newIndex = null;
63
64		switch (event.key) {
65			case "ArrowDown":
66			case "ArrowRight":
67				newIndex = (currentIndex + 1) % buttons.length;
68				break;
69
70			case "ArrowUp":
71			case "ArrowLeft":
72				newIndex =
73					(currentIndex - 1 + buttons.length) % buttons.length;
74				break;
75
76			case "Home":
77				newIndex = 0;
78				break;
79
80			case "End":
81				newIndex = buttons.length - 1;
82				break;
83
84			default:
85				return;
86		}
87
88		event.preventDefault();
89		buttons[newIndex].focus();
90	});
91});
92
93function openPanel(panel) {
94	panel.style.display = 'block';
95	panel.offsetHeight; // eslint-disable-line no-unused-expressions
96	panel.classList.add('is-open');
97}
98
99function closePanel(panel) {
100	panel.classList.remove('is-open');
101	panel.addEventListener('transitionend', () => {
102		panel.style.display = 'none';
103	}, { once: true });
104}
105
106function setFixedCardHeight() {
107	equalizeGroup(".step-card-home", 992);
108	equalizeGroup(".step-card:not(.step-card-home)", 768);
109}
110
111function equalizeGroup(selector, minWidth) {
112	const cards = document.querySelectorAll(selector);
113	if (cards.length === 0) return;
114
115	cards.forEach(c => { c.style.minHeight = ""; });
116
117	if (window.innerWidth < minWidth) return;
118
119	let tallest = 0;
120	cards.forEach(c => {
121		if (c.offsetHeight > tallest) tallest = c.offsetHeight;
122	});
123	cards.forEach(c => { c.style.minHeight = tallest + "px"; });
124}
125
126
127function updateLabel(button, wasExpanded) {
128	const label = button.querySelector(".read-more");
129
130	if (!label) return;
131
132	const showText = button.dataset.readMore ?? "Read More";
133	const hideText = button.dataset.readLess ?? "Read Less";
134
135	label.textContent = wasExpanded ? showText : hideText;
136}