mirror of
https://github.com/zen-browser/desktop.git
synced 2025-10-14 05:46:26 +00:00
refactor: move sidebar height throttle and content element separation to ZenUIManager; streamline tab toolbar updates
This commit is contained in:
@@ -1,6 +1,5 @@
|
|||||||
{
|
{
|
||||||
const lazy = {};
|
const lazy = {};
|
||||||
XPCOMUtils.defineLazyPreferenceGetter(lazy, 'sidebarHeightThrottle', 'zen.view.sidebar-height-throttle', 500);
|
|
||||||
var ZenStartup = {
|
var ZenStartup = {
|
||||||
init() {
|
init() {
|
||||||
this.logHeader();
|
this.logHeader();
|
||||||
@@ -41,51 +40,13 @@
|
|||||||
gZenVerticalTabsManager.init();
|
gZenVerticalTabsManager.init();
|
||||||
gZenCompactModeManager.init();
|
gZenCompactModeManager.init();
|
||||||
|
|
||||||
XPCOMUtils.defineLazyPreferenceGetter(
|
|
||||||
this,
|
|
||||||
'contentElementSeparation',
|
|
||||||
'zen.theme.content-element-separation',
|
|
||||||
0
|
|
||||||
);
|
|
||||||
|
|
||||||
document.l10n.setAttributes(document.getElementById('tabs-newtab-button'), 'tabs-toolbar-new-tab');
|
document.l10n.setAttributes(document.getElementById('tabs-newtab-button'), 'tabs-toolbar-new-tab');
|
||||||
|
|
||||||
function throttle(f, delay) {
|
|
||||||
let timer = 0;
|
|
||||||
return function (...args) {
|
|
||||||
clearTimeout(timer);
|
|
||||||
timer = setTimeout(() => f.apply(this, args), delay);
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
new ResizeObserver(throttle(this._updateTabsToolbar.bind(this), lazy.sidebarHeightThrottle)).observe(
|
|
||||||
document.getElementById('tabbrowser-tabs')
|
|
||||||
);
|
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error('ZenThemeModifier: Error initializing browser layout', e);
|
console.error('ZenThemeModifier: Error initializing browser layout', e);
|
||||||
}
|
}
|
||||||
this.closeWatermark();
|
this.closeWatermark();
|
||||||
},
|
},
|
||||||
|
|
||||||
_updateTabsToolbar() {
|
|
||||||
// Set tabs max-height to the "toolbar-items" height
|
|
||||||
const toolbarItems = document.getElementById('tabbrowser-tabs');
|
|
||||||
const tabs = document.getElementById('tabbrowser-arrowscrollbox');
|
|
||||||
tabs.style.maxHeight = '0px'; // reset to 0
|
|
||||||
const toolbarRect = toolbarItems.getBoundingClientRect();
|
|
||||||
let height = toolbarRect.height;
|
|
||||||
// -5 for the controls padding
|
|
||||||
let totalHeight = toolbarRect.height - (this.contentElementSeparation * 2) - 5;
|
|
||||||
// remove the height from other elements that aren't hidden
|
|
||||||
const otherElements = document.querySelectorAll('#tabbrowser-tabs > *:not([hidden="true"])');
|
|
||||||
for (let tab of otherElements) {
|
|
||||||
if (tabs === tab) continue;
|
|
||||||
totalHeight -= tab.getBoundingClientRect().height;
|
|
||||||
}
|
|
||||||
tabs.style.maxHeight = totalHeight + 'px';
|
|
||||||
//console.info('ZenThemeModifier: set tabs max-height to', totalHeight + 'px');
|
|
||||||
},
|
|
||||||
|
|
||||||
openWatermark() {
|
openWatermark() {
|
||||||
if (!Services.prefs.getBoolPref('zen.watermark.enabled', false)) {
|
if (!Services.prefs.getBoolPref('zen.watermark.enabled', false)) {
|
||||||
return;
|
return;
|
||||||
|
@@ -5,6 +5,45 @@ var gZenUIManager = {
|
|||||||
init() {
|
init() {
|
||||||
document.addEventListener('popupshowing', this.onPopupShowing.bind(this));
|
document.addEventListener('popupshowing', this.onPopupShowing.bind(this));
|
||||||
document.addEventListener('popuphidden', this.onPopupHidden.bind(this));
|
document.addEventListener('popuphidden', this.onPopupHidden.bind(this));
|
||||||
|
XPCOMUtils.defineLazyPreferenceGetter(this, 'sidebarHeightThrottle', 'zen.view.sidebar-height-throttle', 500);
|
||||||
|
XPCOMUtils.defineLazyPreferenceGetter(
|
||||||
|
this,
|
||||||
|
'contentElementSeparation',
|
||||||
|
'zen.theme.content-element-separation',
|
||||||
|
0
|
||||||
|
);
|
||||||
|
|
||||||
|
function throttle(f, delay) {
|
||||||
|
let timer = 0;
|
||||||
|
return function (...args) {
|
||||||
|
clearTimeout(timer);
|
||||||
|
timer = setTimeout(() => f.apply(this, args), delay);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
new ResizeObserver(throttle(this.updateTabsToolbar.bind(this), this.sidebarHeightThrottle)).observe(
|
||||||
|
document.getElementById('tabbrowser-tabs')
|
||||||
|
);
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
updateTabsToolbar() {
|
||||||
|
// Set tabs max-height to the "toolbar-items" height
|
||||||
|
const toolbarItems = document.getElementById('tabbrowser-tabs');
|
||||||
|
const tabs = document.getElementById('tabbrowser-arrowscrollbox');
|
||||||
|
tabs.style.maxHeight = '0px'; // reset to 0
|
||||||
|
const toolbarRect = toolbarItems.getBoundingClientRect();
|
||||||
|
let height = toolbarRect.height;
|
||||||
|
// -5 for the controls padding
|
||||||
|
let totalHeight = toolbarRect.height - (this.contentElementSeparation * 2) - 5;
|
||||||
|
// remove the height from other elements that aren't hidden
|
||||||
|
const otherElements = document.querySelectorAll('#tabbrowser-tabs > *:not([hidden="true"])');
|
||||||
|
for (let tab of otherElements) {
|
||||||
|
if (tabs === tab) continue;
|
||||||
|
totalHeight -= tab.getBoundingClientRect().height;
|
||||||
|
}
|
||||||
|
tabs.style.maxHeight = totalHeight + 'px';
|
||||||
|
//console.info('ZenThemeModifier: set tabs max-height to', totalHeight + 'px');
|
||||||
},
|
},
|
||||||
|
|
||||||
openAndChangeToTab(url, options) {
|
openAndChangeToTab(url, options) {
|
||||||
|
@@ -1160,6 +1160,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
|||||||
await this._updateWorkspacesChangeContextMenu();
|
await this._updateWorkspacesChangeContextMenu();
|
||||||
|
|
||||||
document.getElementById('tabbrowser-tabs')._positionPinnedTabs();
|
document.getElementById('tabbrowser-tabs')._positionPinnedTabs();
|
||||||
|
gZenUIManager.updateTabsToolbar();
|
||||||
|
|
||||||
await this._propagateWorkspaceData({clearCache: onInit});
|
await this._propagateWorkspaceData({clearCache: onInit});
|
||||||
for (let listener of this._changeListeners ?? []) {
|
for (let listener of this._changeListeners ?? []) {
|
||||||
|
Reference in New Issue
Block a user