customer-riverside/web/modules/custom/riverside_pt/js/scroll.js

47 lines
1.9 KiB
JavaScript
Raw Permalink Normal View History

2026-06-03 23:02:27 -08:00
var FIXED_BUFFER = 0; // breathing room below fixed header when menu is closed
// Returns the effective scroll offset to clear the header.
// When the hamburger is open, offsetHeight already includes the expanded nav,
// so no extra buffer is needed. When closed, add FIXED_BUFFER for breathing room.
function headerOffset() {
2026-06-13 23:38:35 -08:00
var header = /** @type {HTMLElement | null} */ (document.querySelector(".rpt-header"));
2026-06-03 23:02:27 -08:00
if (!header) return 0;
var pos = window.getComputedStyle(header).position;
2026-06-03 23:02:27 -08:00
if (pos !== "fixed" && pos !== "sticky") return 0;
var nav = document.getElementById("rpt-main-nav");
var menuOpen = nav && nav.classList.contains("is-open");
return header.offsetHeight + (menuOpen ? 0 : FIXED_BUFFER);
}
2026-06-13 23:38:35 -08:00
/** @param {Element} el @param {boolean} [animate] */
2026-06-08 18:14:22 -08:00
function scrollToEl(el, animate) {
var top = Math.max(0, el.getBoundingClientRect().top + window.scrollY - headerOffset());
window.scrollTo({ top: top, behavior: animate ? "smooth" : "instant" });
}
window.rptScrollTo = scrollToEl;
2026-06-03 23:13:32 -08:00
// On load: scroll to the anchor from either the URL hash or drupalSettings
// (set by the server when rendering the home page at a clean URL like /services).
document.addEventListener("DOMContentLoaded", function () {
2026-06-03 23:13:32 -08:00
var settings = window.drupalSettings && window.drupalSettings.riversidePt;
var anchor = window.location.hash || (settings && settings.scrollTo);
if (!anchor) return;
2026-06-13 23:38:35 -08:00
const target = document.querySelector(anchor);
if (!target) return;
requestAnimationFrame(function () {
2026-06-08 18:14:22 -08:00
scrollToEl(target, false);
});
});
document.addEventListener("click", function (e) {
2026-06-13 23:38:35 -08:00
if (!(e.target instanceof Element)) return;
var link = /** @type {HTMLElement | null} */ (e.target.closest("[data-scroll-to]"));
if (!link) return;
2026-06-13 23:38:35 -08:00
var target = document.querySelector(link.dataset.scrollTo || "");
if (!target) return;
e.preventDefault();
2026-06-03 23:05:52 -08:00
history.pushState({}, "", link.getAttribute("href"));
2026-06-08 18:14:22 -08:00
scrollToEl(target, true);
});