From 1ae11fef58ff06f9918a9d41bf288be0ccfdf0e1 Mon Sep 17 00:00:00 2001 From: "mr. m" Date: Fri, 28 Feb 2025 21:20:11 +0100 Subject: [PATCH] Worked a bit more on split view groups --- .../base/content/zen-styles/zen-folders.css | 6 +++ .../base/zen-components/ZenFolders.mjs | 6 +++ .../base/zen-components/ZenViewSplitter.mjs | 4 +- .../tabbrowser/content/tabbrowser-js.patch | 29 ++++++++----- .../tabbrowser/content/tabs-js.patch | 43 +++++++++++++------ 5 files changed, 64 insertions(+), 24 deletions(-) diff --git a/src/browser/base/content/zen-styles/zen-folders.css b/src/browser/base/content/zen-styles/zen-folders.css index 822c43796..d84a160b0 100644 --- a/src/browser/base/content/zen-styles/zen-folders.css +++ b/src/browser/base/content/zen-styles/zen-folders.css @@ -37,6 +37,12 @@ tab-group[split-view-group] { & .tab-close-button { display: none !important; } + + @media (prefers-reduced-motion: no-preference) { + #tabbrowser-tabs[movingtab] & { + transition: var(--tab-dragover-transition); + } + } } tab-group[split-view-group] .tabbrowser-tab { diff --git a/src/browser/base/zen-components/ZenFolders.mjs b/src/browser/base/zen-components/ZenFolders.mjs index 1b939365b..42fcaad54 100644 --- a/src/browser/base/zen-components/ZenFolders.mjs +++ b/src/browser/base/zen-components/ZenFolders.mjs @@ -19,6 +19,12 @@ #onTabUngrouped(event) {} #onTabGroupRemoved(event) {} + + expandGroupTabs(group) { + for (const tab of group.tabs) { + gBrowser.ungroupTab(tab); + } + } } window.gZenFolders = new ZenFolders(); diff --git a/src/browser/base/zen-components/ZenViewSplitter.mjs b/src/browser/base/zen-components/ZenViewSplitter.mjs index f06bc59c0..97256a478 100644 --- a/src/browser/base/zen-components/ZenViewSplitter.mjs +++ b/src/browser/base/zen-components/ZenViewSplitter.mjs @@ -565,6 +565,8 @@ class ZenViewSplitter extends ZenDOMOperatedFeature { * @param {number} groupIndex - The index of the group to remove. */ removeGroup(groupIndex) { + const group = this._data[groupIndex]; + gZenFolders.expandGroupTabs(group); if (this.currentView === groupIndex) { this.deactivateCurrentSplitView(); } @@ -721,7 +723,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature { } else { // Add any tabs that are not already in the group for (const tab of tabs) { - if (!group.tabs.includes(tab)) { + if (!group.tabs.includes(tab) && tab.pinned === group.pinned) { group.tabs.push(tab); this.addTabToSplit(tab, group.layoutTree); } diff --git a/src/browser/components/tabbrowser/content/tabbrowser-js.patch b/src/browser/components/tabbrowser/content/tabbrowser-js.patch index 49f2b1166..2c8f57de7 100644 --- a/src/browser/components/tabbrowser/content/tabbrowser-js.patch +++ b/src/browser/components/tabbrowser/content/tabbrowser-js.patch @@ -1,5 +1,5 @@ diff --git a/browser/components/tabbrowser/content/tabbrowser.js b/browser/components/tabbrowser/content/tabbrowser.js -index 628aa6596627c85efe361fc1ece8fd58f7ee653e..59c563683fc18972fffd51c41d1d1c159b62f28d 100644 +index 628aa6596627c85efe361fc1ece8fd58f7ee653e..a1500038ff8f129fc249a221c2b534c8b2edf053 100644 --- a/browser/components/tabbrowser/content/tabbrowser.js +++ b/browser/components/tabbrowser/content/tabbrowser.js @@ -412,11 +412,50 @@ @@ -441,21 +441,28 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..59c563683fc18972fffd51c41d1d1c15 } else { aIndex = Math.max(aIndex, this.pinnedTabCount); } -@@ -5684,9 +5797,11 @@ +@@ -5684,11 +5797,17 @@ } this._handleTabMove(aTab, () => { - let neighbor = this.tabs[aIndex]; - if (forceStandaloneTab && neighbor.group) { + let neighbor = this.tabs.filter(tab => !tab.hasAttribute("zen-glance-tab"))[aIndex]; -+ if (forceStandaloneTab && neighbor.group || (neighbor.group && neighbor.group.hasAttribute("split-view-group"))) { ++ const _tPos = aTab._tPos; ++ if ((forceStandaloneTab && neighbor.group) || neighbor.group?.hasAttribute("split-view-group")) { neighbor = neighbor.group; + } else if (aTab.group && aTab.group.hasAttribute("split-view-group")) { + aTab = aTab.group; ++ } ++ if (aTab.group?.hasAttribute("split-view-group") && neighbor == aTab.group) { ++ return; } - if (neighbor && aIndex >= aTab._tPos) { +- if (neighbor && aIndex >= aTab._tPos) { ++ if (neighbor && aIndex >= _tPos) { neighbor.after(aTab); -@@ -5697,7 +5812,7 @@ + } else { + this.tabContainer.insertBefore(aTab, neighbor); +@@ -5697,7 +5816,7 @@ } moveTabToGroup(aTab, aGroup) { @@ -464,7 +471,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..59c563683fc18972fffd51c41d1d1c15 return; } if (aTab.group && aTab.group.id === aGroup.id) { -@@ -5721,6 +5836,8 @@ +@@ -5721,6 +5840,8 @@ moveActionCallback(); @@ -473,7 +480,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..59c563683fc18972fffd51c41d1d1c15 // Clear tabs cache after moving nodes because the order of tabs may have // changed. this.tabContainer._invalidateCachedTabs(); -@@ -5771,7 +5888,7 @@ +@@ -5771,7 +5892,7 @@ createLazyBrowser, }; @@ -482,7 +489,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..59c563683fc18972fffd51c41d1d1c15 if (aIndex < numPinned || (aTab.pinned && aIndex == numPinned)) { params.pinned = true; } -@@ -7415,6 +7532,7 @@ +@@ -7415,6 +7536,7 @@ aWebProgress.isTopLevel ) { this.mTab.setAttribute("busy", "true"); @@ -490,7 +497,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..59c563683fc18972fffd51c41d1d1c15 gBrowser._tabAttrModified(this.mTab, ["busy"]); this.mTab._notselectedsinceload = !this.mTab.selected; } -@@ -8381,7 +8499,7 @@ var TabContextMenu = { +@@ -8381,7 +8503,7 @@ var TabContextMenu = { ); contextUnpinSelectedTabs.hidden = !this.contextTab.pinned || !multiselectionContext; @@ -499,7 +506,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..59c563683fc18972fffd51c41d1d1c15 // Move Tab items let contextMoveTabOptions = document.getElementById( "context_moveTabOptions" -@@ -8414,7 +8532,7 @@ var TabContextMenu = { +@@ -8414,7 +8536,7 @@ var TabContextMenu = { let contextMoveTabToStart = document.getElementById("context_moveToStart"); let isFirstTab = tabsToMove[0] == visibleTabs[0] || @@ -508,7 +515,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..59c563683fc18972fffd51c41d1d1c15 contextMoveTabToStart.disabled = isFirstTab && allSelectedTabsAdjacent; document.getElementById("context_openTabInWindow").disabled = -@@ -8647,6 +8765,7 @@ var TabContextMenu = { +@@ -8647,6 +8769,7 @@ var TabContextMenu = { if (this.contextTab.multiselected) { gBrowser.removeMultiSelectedTabs(); } else { diff --git a/src/browser/components/tabbrowser/content/tabs-js.patch b/src/browser/components/tabbrowser/content/tabs-js.patch index 18847db2a..2c8855359 100644 --- a/src/browser/components/tabbrowser/content/tabs-js.patch +++ b/src/browser/components/tabbrowser/content/tabs-js.patch @@ -1,5 +1,5 @@ diff --git a/browser/components/tabbrowser/content/tabs.js b/browser/components/tabbrowser/content/tabs.js -index fa96568d366fd3608f9bd583fa793150bd815c8b..2ef63a6b462f28029f02decf14ad93de88446bab 100644 +index fa96568d366fd3608f9bd583fa793150bd815c8b..03a525205457f723e204614834e32e7a917f41f7 100644 --- a/browser/components/tabbrowser/content/tabs.js +++ b/browser/components/tabbrowser/content/tabs.js @@ -94,7 +94,7 @@ @@ -328,15 +328,16 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2ef63a6b462f28029f02decf14ad93de let absPositionHorizontalTabs = this.overflowing && tabs.length > numPinned && numPinned > 0; -@@ -2042,6 +2078,7 @@ +@@ -2041,7 +2077,7 @@ + if (this.verticalMode) { this._updateVerticalPinnedTabs(); - } else if (absPositionHorizontalTabs) { -+ return; +- } else if (absPositionHorizontalTabs) { ++ } else if (absPositionHorizontalTabs && false) { let layoutData = this._pinnedTabsLayoutCache; let uiDensity = document.documentElement.getAttribute("uidensity"); if (!layoutData || layoutData.uiDensity != uiDensity) { -@@ -2113,7 +2150,7 @@ +@@ -2113,7 +2149,7 @@ return; } @@ -345,7 +346,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2ef63a6b462f28029f02decf14ad93de let directionX = screenX > dragData.animLastScreenX; let directionY = screenY > dragData.animLastScreenY; -@@ -2296,10 +2333,11 @@ +@@ -2296,10 +2332,11 @@ } let pinned = draggedTab.pinned; @@ -361,7 +362,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2ef63a6b462f28029f02decf14ad93de ); if (this.#rtlMode) { -@@ -2347,8 +2385,12 @@ +@@ -2347,8 +2384,12 @@ (lastMovingTabScreen + tabSize); translate = Math.min(Math.max(translate, firstBound), lastBound); @@ -376,7 +377,25 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2ef63a6b462f28029f02decf14ad93de } dragData.translatePos = translate; -@@ -2541,8 +2583,9 @@ +@@ -2484,12 +2525,16 @@ + // Shift background tabs to leave a gap where the dragged tab + // would currently be dropped. + for (let tab of tabs) { +- if (tab == draggedTab) { ++ if (tab == draggedTab || (tab.group?.hasAttribute("split-view-group") && tab.group == draggedTab.group)) { + continue; + } + let shift = getTabShift(tab, newIndex); + let transform = shift ? `${translateAxis}(${shift}px)` : ""; ++ if (tab.group?.hasAttribute("split-view-group")) { ++ tab.group.style.transform = transform; ++ } else { + tab.style.transform = transform; ++ } + if (tab.group?.tabs[0] == tab) { + tab.group.style.setProperty( + "--tabgroup-dragover-transform", +@@ -2541,8 +2586,9 @@ ); } @@ -388,7 +407,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2ef63a6b462f28029f02decf14ad93de return; } -@@ -2553,6 +2596,7 @@ +@@ -2553,6 +2599,7 @@ tab.style.transform = ""; if (tab.group) { tab.group.style.removeProperty("--tabgroup-dragover-transform"); @@ -396,7 +415,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2ef63a6b462f28029f02decf14ad93de } tab.removeAttribute("dragover-createGroup"); } -@@ -2604,7 +2648,7 @@ +@@ -2604,7 +2651,7 @@ movingTab._moveTogetherSelectedTabsData.newIndex = movingTabNewIndex; movingTab._moveTogetherSelectedTabsData.animate = false; }; @@ -405,7 +424,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2ef63a6b462f28029f02decf14ad93de postTransitionCleanup(); } else { let onTransitionEnd = transitionendEvent => { -@@ -2707,9 +2751,9 @@ +@@ -2707,9 +2754,9 @@ function newIndex(aTab, index) { // Don't allow mixing pinned and unpinned tabs. if (aTab.pinned) { @@ -417,7 +436,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2ef63a6b462f28029f02decf14ad93de } } -@@ -2793,7 +2837,7 @@ +@@ -2793,7 +2840,7 @@ } _notifyBackgroundTab(aTab) {