ZenBrowserMirrors/zen-desktop
1
0
Fork 1
mirror of https://github.com/zen-browser/desktop.git synced 2025-07-08 19:59:59 +02:00
Code Releases Wiki Activity

Refactor sidebar scrolling logic and improve tab height calculations for better UI performance

Browse source
This commit is contained in:
mr. M 2025-01-27 00:29:54 +01:00
parent 3931f8195b
commit b9ae18a0ca
No known key found for this signature in database
GPG key ID: CBD57A2AEDBDA1FB
7 changed files with 52 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/browser/base/content/ZenStartup.mjs
View file

@ -84,31 +84,31 @@
_initSidebarScrolling() {
// Disable smooth scroll
if (!Services.prefs.getBoolPref('zen.startup.smooth-scroll-in-tabs', false)) {
gBrowser.tabContainer.addEventListener('wheel', (event) => {
event.preventDefault(); // Prevent the smooth scroll behavior
gBrowser.tabContainer.scrollTop += event.deltaY * 20; // Apply immediate scroll
});
}
const canSmoothScroll = Services.prefs.getBoolPref('zen.startup.smooth-scroll-in-tabs', false);
const workspaceIndicator = document.getElementById('zen-current-workspace-indicator');
const tabsWrapper = document.getElementById('zen-browser-tabs-wrapper');
gBrowser.tabContainer.addEventListener('wheel', (event) => {
if (canSmoothScroll) return;
event.preventDefault(); // Prevent the smooth scroll behavior
gBrowser.tabContainer.scrollTop += event.deltaY * 20; // Apply immediate scroll
});
// Detect overflow and underflow
const observer = new ResizeObserver((_) => {
const tabContainer = gBrowser.tabContainer;
const isVertical = tabContainer.getAttribute('orient') === 'vertical';
let contentSize =
tabContainer.getBoundingClientRect()[isVertical ? 'height' : 'width'];
let contentSize = tabsWrapper.getBoundingClientRect()[isVertical ? 'height' : 'width'];
// NOTE: This should be contentSize > scrollClientSize, but due
// to how Gecko internally rounds in those cases, we allow for some
// minor differences (the internal Gecko layout size is 1/60th of a
// pixel, so 0.02 should cover it).
let overflowing = contentSize - tabContainer.arrowScrollbox.scrollClientSize > 0.02;
tabContainer.arrowScrollbox.toggleAttribute("overflowing", overflowing);
tabContainer.arrowScrollbox.dispatchEvent(
new CustomEvent(overflowing ? "overflow" : "underflow")
);
window.requestAnimationFrame(() => {
tabContainer.arrowScrollbox.toggleAttribute('overflowing', overflowing);
tabContainer.arrowScrollbox.dispatchEvent(new CustomEvent(overflowing ? 'overflow' : 'underflow'));
});
});
observer.observe(document.getElementById('navigator-toolbox'));
observer.observe(tabsWrapper);
},
_initSearchBar() {