mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-10-17 07:16:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

HUGE: handle workspaces as individual containers instead of a single list of tabs

Browse Source
This commit is contained in:
mr. M
2025-02-11 22:01:41 +01:00
parent 6f612d62cf
commit e387652c8b
16 changed files with 413 additions and 226 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/browser/components/tabbrowser/content/tabbrowser-js.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/components/tabbrowser/content/tabbrowser.js b/browser/components/tabbrowser/content/tabbrowser.js
index ff90a70bdad6c94ec4b90027ff102972d0eb28e5..f7c02c14498b4ec5fcf5521480c88abac25a2283 100644
index ff90a70bdad6c94ec4b90027ff102972d0eb28e5..c90119b4b248887fd8612beb9aac83c6eeb57088 100644
--- a/browser/components/tabbrowser/content/tabbrowser.js
+++ b/browser/components/tabbrowser/content/tabbrowser.js
@@ -406,11 +406,39 @@
@@ -49,7 +49,7 @@ index ff90a70bdad6c94ec4b90027ff102972d0eb28e5..f7c02c14498b4ec5fcf5521480c88aba
if (this.tabContainer.verticalMode) {
this._handleTabMove(aTab, () =>
- this.verticalPinnedTabsContainer.appendChild(aTab)
+ aTab.hasAttribute("zen-essential") ? document.getElementById("zen-essentials-container").appendChild(aTab) : this.verticalPinnedTabsContainer.appendChild(aTab)
+ aTab.hasAttribute("zen-essential") ? document.getElementById("zen-essentials-container").appendChild(aTab) : this.verticalPinnedTabsContainer.insertBefore(aTab, this.verticalPinnedTabsContainer.lastChild)
);
} else {
- this.moveTabTo(aTab, this.pinnedTabCount, { forceStandaloneTab: true });

105
src/browser/components/tabbrowser/content/tabs-js.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/components/tabbrowser/content/tabs.js b/browser/components/tabbrowser/content/tabs.js
index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ceab5c1dcf 100644
index 8aeb244ffca9f48661805f5b7d860b5896055562..ab0a6a6ed80608385b4663775b4edf67709dae7d 100644
--- a/browser/components/tabbrowser/content/tabs.js
+++ b/browser/components/tabbrowser/content/tabs.js
@@ -94,7 +94,7 @@
@@ -101,6 +101,15 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
) {
delete draggedTab._dragData;
return;
@@ -1478,7 +1491,7 @@
}
get newTabButton() {
- return this.querySelector("#tabs-newtab-button");
+ return ZenWorkspaces.activeWorkspaceStrip.querySelector("#tabs-newtab-button");
}
get verticalMode() {
@@ -1498,7 +1511,7 @@
if (this.#allTabs) {
return this.#allTabs;
@@ -110,7 +119,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
// remove arrowScrollbox periphery element
children.pop();
@@ -1512,14 +1525,24 @@
@@ -1512,14 +1525,28 @@
}
this.#allTabs = [
@@ -126,6 +135,10 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
+ // insert right after the parent tab
+ this.#allTabs.splice(Math.min(i + 1, lastPinnedTabIdx), 0, glanceTab);
+ i++;
+ } else if (this.#allTabs[i].classList.contains("vertical-pinned-tabs-container-separator")) {
+ // remove the separator from the list
+ this.#allTabs.splice(i, 1);
+ i--;
+ }
+ }
return this.#allTabs;
@@ -137,16 +150,20 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
return children.filter(node => node.tagName == "tab-group");
}
@@ -1577,7 +1600,7 @@
let verticalPinnedTabsContainer = document.getElementById(
"vertical-pinned-tabs-container"
);
@@ -1574,10 +1601,8 @@
return this.#focusableItems;
}
- let verticalPinnedTabsContainer = document.getElementById(
- "vertical-pinned-tabs-container"
- );
- let children = Array.from(this.arrowScrollbox.children);
+ let verticalPinnedTabsContainer = this.verticalPinnedTabsContainer;
+ let children = Array.from(ZenWorkspaces.tabboxChildren);
let focusableItems = [];
for (let child of children) {
@@ -1593,6 +1616,7 @@
@@ -1593,6 +1618,7 @@
}
this.#focusableItems = [
@@ -154,7 +171,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
...verticalPinnedTabsContainer.children,
...focusableItems,
];
@@ -1617,8 +1641,8 @@
@@ -1617,8 +1643,8 @@
#isContainerVerticalPinnedExpanded(tab) {
return (
this.verticalMode &&
@@ -165,7 +182,25 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
);
}
@@ -1816,7 +1840,7 @@
@@ -1633,7 +1659,7 @@
if (node == null) {
// We have a container for non-tab elements at the end of the scrollbox.
- node = this.arrowScrollbox.lastChild;
+ node = ZenWorkspaces.activeWorkspaceStrip.lastChild;
}
node.before(tab);
@@ -1733,7 +1759,7 @@
// There are separate "new tab" buttons for horizontal tabs toolbar, vertical tabs and
// for when the tab strip is overflowed (which is shared by vertical and horizontal tabs);
// Attach the long click popup to all of them.
- const newTab = document.getElementById("new-tab-button");
+ const newTab = ZenWorkspaces.activeWorkspaceStrip.querySelector("#tabs-newtab-button");
const newTab2 = this.newTabButton;
const newTabVertical = document.getElementById(
"vertical-tabs-newtab-button"
@@ -1816,7 +1842,7 @@
let rect = ele => {
return window.windowUtils.getBoundsWithoutFlushing(ele);
};
@@ -174,7 +209,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
if (tab && rect(tab).width <= this._tabClipWidth) {
this.setAttribute("closebuttons", "activetab");
} else {
@@ -1832,6 +1856,7 @@
@@ -1832,6 +1858,7 @@
this.arrowScrollbox.ensureElementIsVisible(selectedTab, aInstant);
}
@@ -182,7 +217,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
selectedTab._notselectedsinceload = false;
}
@@ -1843,7 +1868,7 @@
@@ -1843,7 +1870,7 @@
return;
}
@@ -191,7 +226,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
if (!tabs.length) {
return;
}
@@ -1879,7 +1904,7 @@
@@ -1879,7 +1906,7 @@
if (isEndTab && !this._hasTabTempMaxWidth) {
return;
}
@@ -200,7 +235,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
// Force tabs to stay the same width, unless we're closing the last tab,
// which case we need to let them expand just enough so that the overall
// tabbar width is the same.
@@ -1894,7 +1919,7 @@
@@ -1894,7 +1921,7 @@
let tabsToReset = [];
for (let i = numPinned; i < tabs.length; i++) {
let tab = tabs[i];
@@ -209,22 +244,40 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
if (!isEndTab) {
// keep tabs the same width
tab.style.transition = "none";
@@ -1965,11 +1990,11 @@
);
@@ -1960,16 +1987,15 @@
// Move pinned tabs to another container when the tabstrip is toggled to vertical
// and when session restore code calls _positionPinnedTabs; update styling whenever
// the number of pinned tabs changes.
- let verticalTabsContainer = document.getElementById(
- "vertical-pinned-tabs-container"
- );
+ let verticalTabsContainer = this.verticalPinnedTabsContainer;
let numPinned = gBrowser.pinnedTabCount;
- if (gBrowser.pinnedTabCount !== verticalTabsContainer.children.length) {
- let tabs = this.visibleTabs;
+ if (gBrowser.pinnedTabCount !== (verticalTabsContainer.children.length + document.getElementById("zen-essentials-container").children.length)) {
+ ZenWorkspaces.makeSurePinTabIsInCorrectPosition();
+ if (gBrowser.pinnedTabCount !== (verticalTabsContainer.children.length - 1 + document.getElementById("zen-essentials-container").children.length)) {
+ let tabs = this.allTabs.filter(tab => !tab.hasAttribute("zen-glance-tab"));
for (let i = 0; i < numPinned; i++) {
tabs[i].style.marginInlineStart = "";
- verticalTabsContainer.appendChild(tabs[i]);
+ tabs[i].hasAttribute("zen-essential") ? document.getElementById("zen-essentials-container").appendChild(tabs[i]) : verticalTabsContainer.appendChild(tabs[i]);
+ tabs[i].hasAttribute("zen-essential") ? document.getElementById("zen-essentials-container").appendChild(tabs[i]) : verticalTabsContainer.insertBefore(tabs[i], verticalTabsContainer.lastChild);
}
}
@@ -1992,8 +2017,8 @@
@@ -1977,9 +2003,7 @@
}
_resetVerticalPinnedTabs() {
- let verticalTabsContainer = document.getElementById(
- "vertical-pinned-tabs-container"
- );
+ let verticalTabsContainer = this.verticalPinnedTabsContainer;
if (!verticalTabsContainer.children.length) {
return;
@@ -1992,8 +2016,8 @@
}
_positionPinnedTabs() {
@@ -235,7 +288,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
let absPositionHorizontalTabs =
this.overflowing && tabs.length > numPinned && numPinned > 0;
@@ -2074,7 +2099,7 @@
@@ -2074,7 +2098,7 @@
return;
}
@@ -244,7 +297,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
let directionX = screenX > dragData.animLastScreenX;
let directionY = screenY > dragData.animLastScreenY;
@@ -2257,9 +2282,9 @@
@@ -2257,9 +2281,9 @@
}
let pinned = draggedTab.pinned;
@@ -257,7 +310,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
pinned ? numPinned : undefined
);
@@ -2502,8 +2527,9 @@
@@ -2502,8 +2526,9 @@
);
}
@@ -269,7 +322,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
return;
}
@@ -2668,9 +2694,9 @@
@@ -2668,9 +2693,9 @@
function newIndex(aTab, index) {
// Don't allow mixing pinned and unpinned tabs.
if (aTab.pinned) {
@@ -281,7 +334,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
}
}
@@ -2754,7 +2780,7 @@
@@ -2754,7 +2779,7 @@
}
_notifyBackgroundTab(aTab) {
@@ -290,7 +343,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
return;
}
@@ -2772,12 +2798,14 @@
@@ -2772,12 +2797,14 @@
selectedTab = {
left: selectedTab.left,
right: selectedTab.right,
@@ -306,7 +359,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
selectedTab,
];
})
@@ -2794,8 +2822,11 @@
@@ -2794,8 +2821,11 @@
delete this._lastTabToScrollIntoView;
// Is the new tab already completely visible?
if (
@@ -320,7 +373,7 @@ index 8aeb244ffca9f48661805f5b7d860b5896055562..ef532d6b5d311cab5bc573c2d0aae6ce
) {
return;
}
@@ -2803,21 +2834,29 @@
@@ -2803,21 +2833,29 @@
if (this.arrowScrollbox.smoothScroll) {
// Can we make both the new tab and the selected tab completely visible?
if (