forked from drowl87/hextra_mirror

Long sidebars did not scroll to show the selected entry. This made working with such long sidebars quite confusing.
37 lines
1.1 KiB
JavaScript
37 lines
1.1 KiB
JavaScript
document.addEventListener("DOMContentLoaded", function () {
|
|
scrollToActiveItem();
|
|
enableCollapsibles();
|
|
});
|
|
|
|
function enableCollapsibles() {
|
|
const buttons = document.querySelectorAll(".hextra-sidebar-collapsible-button");
|
|
buttons.forEach(function (button) {
|
|
button.addEventListener("click", function (e) {
|
|
e.preventDefault();
|
|
const list = button.parentElement.parentElement;
|
|
if (list) {
|
|
list.classList.toggle("open")
|
|
}
|
|
});
|
|
});
|
|
}
|
|
|
|
function scrollToActiveItem() {
|
|
const sidebarScrollbar = document.querySelector("aside.sidebar-container > .hextra-scrollbar");
|
|
const activeItems = document.querySelectorAll(".sidebar-active-item");
|
|
const visibleActiveItem = Array.from(activeItems).find(function (activeItem) {
|
|
return activeItem.getBoundingClientRect().height > 0;
|
|
});
|
|
|
|
if (!visibleActiveItem) {
|
|
return;
|
|
}
|
|
|
|
const yOffset = visibleActiveItem.clientHeight;
|
|
const yDistance = visibleActiveItem.getBoundingClientRect().top - sidebarScrollbar.getBoundingClientRect().top;
|
|
sidebarScrollbar.scrollTo({
|
|
behavior: "instant",
|
|
top: yDistance - yOffset
|
|
});
|
|
}
|