Skip to content
This repository has been archived by the owner on Nov 14, 2024. It is now read-only.

Commit

Permalink
update multirow code for FF133
Browse files Browse the repository at this point in the history
  • Loading branch information
@Izheil
Izheil committed Nov 13, 2024
1 parent baffa53 commit 4cbe706
Show file tree
Hide file tree
Showing 7 changed files with 175 additions and 135 deletions.
51 changes: 31 additions & 20 deletions Installers/Multirow & other functions/functions/MultiRowTab-scrollable-autohide.uc.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,10 @@
// @namespace https://github.com/Izheil/Quantum-Nox-Firefox-Dark-Full-Theme
// @description Multi-row tabs draggability fix with autohiding scrollbar
// @include main
// @compatibility Firefox 70 to Firefox 115.0a1 (2023-05-09)
// @compatibility Firefox 70 to Firefox 131.0a1 (2024-09-07)
// @author Alice0775, Endor8, TroudhuK, Izheil, Merci-chao
// @version 13/11/2024 23:13 Fixed issue with Firefox 133+
// @version 07/09/2024 13:25 Compatibility fix for FF131a (Nightly)
// @version 10/05/2023 18:42 Fix tab-growth variable from not applying
// @version 14/01/2023 22:36 Fixed new tab button getting overlapped with last tab
// @version 15/12/2022 22:17 Fixed min/max/close button duplication when having menu bar always visible
Expand Down Expand Up @@ -61,11 +63,11 @@ function zzzz_MultiRowTabLite() {
// EDITABLE JAVASCRIPT VARIABLES

// Enables the use of the rows resizer
let useResizer = false;
const useResizer = false;

// Size of the scrollbar
// auto = default OS size (will show arrow handlers even when it's not needed) | thin = half the width | none = always hidden scrollbar
let scrollbarSize = "thin";
const scrollbarSize = "thin";

// CSS section
let css =`
Expand Down Expand Up @@ -138,7 +140,6 @@ function zzzz_MultiRowTabLite() {
The second rule (.titlebar-buttonbox) has paddings control the padding of the min/max/close buttons.
Changing these are required if you want the tab bar to be smaller when having 1 row. */
/*
#TabsToolbar {
--toolbarbutton-inner-padding: inherit !important;
}
Expand All @@ -148,11 +149,6 @@ function zzzz_MultiRowTabLite() {
height: var(--tab-min-height) !important;
}
.titlebar-buttonbox-container {
display: block;
}
*/
/*-------- Don't edit past here unless you know what you are doing --------*/
#tab-scrollbox-resizer {
Expand Down Expand Up @@ -246,6 +242,15 @@ function zzzz_MultiRowTabLite() {
padding-inline-start: 0 !important;
}
/* Remove duplicated min/max/close buttons */
#nav-bar > .titlebar-buttonbox-container {
display: none !important;
}
#TabsToolbar .titlebar-buttonbox-container {
display: block !important;
}
`;

// We check if using australis here
Expand Down Expand Up @@ -295,6 +300,11 @@ function zzzz_MultiRowTabLite() {
margin-right: 0;
overflow-y: scroll}
/* Firefox 131+ fix */
scrollbox > slot {
flex-wrap: wrap;
}
.arrowscrollbox-overflow-start-indicator,
.arrowscrollbox-overflow-end-indicator {position: fixed !important}
Expand Down Expand Up @@ -378,7 +388,7 @@ function zzzz_MultiRowTabLite() {
-moz-window-dragging: no-drag}
`;

if (useThinScrollbar == true) {
if (scrollbarSize == "thin") {
style.innerHTML += `
#tabbrowser-tabs .arrowscrollbox-scrollbox {
scrollbar-color: var(--tabs-scrollbar-color) transparent;
Expand Down Expand Up @@ -473,8 +483,8 @@ function zzzz_MultiRowTabLite() {
tabsScrollbox = document.querySelector("#tabbrowser-tabs .arrowscrollbox-scrollbox");
}

let tabsContainer = document.getElementById("TabsToolbar-customization-target");
let mainWindow = document.getElementById("main-window");
const tabsContainer = document.getElementById("TabsToolbar-customization-target");
const mainWindow = document.getElementById("main-window");

// Adds the resizer element to tabsContainer
let tabsResizer = document.createElement("div");
Expand Down Expand Up @@ -512,7 +522,7 @@ function zzzz_MultiRowTabLite() {

/* fix for moving multiple selected tabs */
gBrowser.visibleTabs.forEach(t => t.style.transform && "");
let tab = this._getDragTargetTab(event, false);
const tab = this._getDragTargetTab(event, false);
let selectedTabs = gBrowser.selectedTabs;
while (selectedTabs.length) {
let t = selectedTabs.pop();
Expand All @@ -538,7 +548,7 @@ function zzzz_MultiRowTabLite() {
if (!this._dragTime)
this._dragTime = Date.now();
if (!tab.hasAttribute("pendingicon") && // annoying fix
Date.now() >= this._dragTime + this._dragOverDelay);
Date.now() >= this._dragTime + this._dragOverDelay)
this.selectedItem = tab;
ind.hidden = true;
return;
Expand Down Expand Up @@ -591,17 +601,18 @@ function zzzz_MultiRowTabLite() {
let dt = event.dataTransfer;
let dropEffect = dt.dropEffect;
let draggedTab;
let movingTabs;
if (dt.mozTypesAt(0)[0] == TAB_DROP_TYPE) {
draggedTab = dt.mozGetDataAt(TAB_DROP_TYPE, 0);
if (!draggedTab) {
return;
}
movingTabs = draggedTab._dragData.movingTabs;
draggedTab.container._finishGroupSelectedTabs(draggedTab);
if (draggedTab.container._finishMoveTogetherSelectedTabs) {
draggedTab.container._finishMoveTogetherSelectedTabs(draggedTab);
} else {
draggedTab.container._finishGroupSelectedTabs(draggedTab);
}
}
if (draggedTab && dropEffect == "copy") {}
else if (draggedTab && draggedTab.container == this) {
if (draggedTab && dropEffect != "copy" && draggedTab.container == this) {
newIndex = this._getDropIndex(event, false);

/* fix for moving multiple selected tabs */
Expand All @@ -619,7 +630,7 @@ function zzzz_MultiRowTabLite() {
};

// We then attach the event listeners for the new functionability to take effect
if (Listeners == false) {
if (!Listeners) {
gBrowser.tabContainer.addEventListener("dragover", gBrowser.tabContainer._onDragOver, true);
gBrowser.tabContainer.addEventListener("drop", function(event){this.onDrop(event);}, true);
Listeners = true;
Expand Down
51 changes: 28 additions & 23 deletions Installers/Multirow & other functions/functions/MultiRowTab-scrollable.uc.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@
// @include main
// @compatibility Firefox 70 to Firefox 131.0a1 (2024-09-07)
// @author Alice0775, Endor8, TroudhuK, Izheil, Merci-chao
// @version 13/11/2024 23:13 Fixed issue with Firefox 133+
// @version 07/09/2024 13:25 Compatibility fix for FF131a (Nightly)
// @version 10/05/2023 18:42 Fix tab-growth variable from not applying
// @version 14/01/2023 22:36 Fixed new tab button getting overlapped with last tab
// @version 15/12/2022 22:17 Fixed min/max/close button duplication when having menu bar always visible
// @version 14/12/2022 19:11 Fixed issue with Firefox 108 (Stable)
// @version 21/11/2022 18:38 Fixed issue with Firefox 108a (Nightly)
Expand Down Expand Up @@ -57,11 +57,11 @@ function zzzz_MultiRowTabLite() {
// EDITABLE JAVASCRIPT VARIABLES

// Enables the use of the rows resizer
let useResizer = false;
const useResizer = false;

// Size of the scrollbar
// auto = default OS size | thin = half the width | none = always hidden scrollbar
let scrollbarSize = "auto";
const scrollbarSize = "auto";

// CSS section
let css =`
Expand Down Expand Up @@ -129,7 +129,6 @@ function zzzz_MultiRowTabLite() {
YOU DON'T NEED TO CHANGE THESE unless you want to use values of --tab-min-height lower than 20px.
Before changing them, you need to UNCOMMENT the 2 rules below for them TO TAKE EFFECT. */
/*
#TabsToolbar {
--toolbarbutton-inner-padding: inherit !important;
}
Expand All @@ -139,12 +138,6 @@ function zzzz_MultiRowTabLite() {
height: var(--tab-min-height) !important;
}
.titlebar-buttonbox-container {
display: block !important;
}
*/
/*-------- Don't edit past here unless you know what you are doing --------*/
#tab-scrollbox-resizer {
Expand Down Expand Up @@ -228,6 +221,15 @@ function zzzz_MultiRowTabLite() {
padding-inline-start: 0 !important;
}
/* Remove duplicated min/max/close buttons */
#nav-bar > .titlebar-buttonbox-container {
display: none !important;
}
#TabsToolbar .titlebar-buttonbox-container {
display: block !important;
}
`;

// We check if using australis here
Expand All @@ -241,12 +243,13 @@ function zzzz_MultiRowTabLite() {

// Check if it's proton past FF91
let tabsHavePadding = false;
let tabBackground = document.getElementsByClassName("tab-background")[0];
const tabBackground = document.getElementsByClassName("tab-background")[0];
if (parseInt(getComputedStyle(tabBackground).getPropertyValue('--tab-block-margin').substring(0,1)) > 0) {
tabsHavePadding = true;
}

// Here the FF71+ changes
let style = document.createElement('style');
if (document.querySelector("#tabbrowser-tabs > arrowscrollbox").shadowRoot) {
css +=
`scrollbar, #tab-scrollbox-resizer {-moz-window-dragging: no-drag !important}
Expand All @@ -257,7 +260,6 @@ function zzzz_MultiRowTabLite() {
`

// This is a fix for the shadow elements:
let style = document.createElement('style');
style.innerHTML = `
.scrollbox-clip {
overflow: visible;
Expand Down Expand Up @@ -358,7 +360,7 @@ function zzzz_MultiRowTabLite() {
-moz-window-dragging: no-drag}
`;

if (useThinScrollbar == true) {
if (scrollbarSize == "thin") {
style.innerHTML += `
#tabbrowser-tabs .arrowscrollbox-scrollbox {
scrollbar-color: var(--tabs-scrollbar-color) transparent;
Expand Down Expand Up @@ -453,8 +455,8 @@ function zzzz_MultiRowTabLite() {
tabsScrollbox = document.querySelector("#tabbrowser-tabs .arrowscrollbox-scrollbox");
}

let tabsContainer = document.getElementById("TabsToolbar-customization-target");
let mainWindow = document.getElementById("main-window");
const tabsContainer = document.getElementById("TabsToolbar-customization-target");
const mainWindow = document.getElementById("main-window");

// Adds the resizer element to tabsContainer
let tabsResizer = document.createElement("div");
Expand Down Expand Up @@ -492,7 +494,7 @@ function zzzz_MultiRowTabLite() {

/* fix for moving multiple selected tabs */
gBrowser.visibleTabs.forEach(t => t.style.transform && "");
let tab = this._getDragTargetTab(event, false);
const tab = this._getDragTargetTab(event, false);
let selectedTabs = gBrowser.selectedTabs;
while (selectedTabs.length) {
let t = selectedTabs.pop();
Expand All @@ -518,7 +520,7 @@ function zzzz_MultiRowTabLite() {
if (!this._dragTime)
this._dragTime = Date.now();
if (!tab.hasAttribute("pendingicon") && // annoying fix
Date.now() >= this._dragTime + this._dragOverDelay);
Date.now() >= this._dragTime + this._dragOverDelay)
this.selectedItem = tab;
ind.hidden = true;
return;
Expand Down Expand Up @@ -571,17 +573,20 @@ function zzzz_MultiRowTabLite() {
let dt = event.dataTransfer;
let dropEffect = dt.dropEffect;
let draggedTab;
let movingTabs;
if (dt.mozTypesAt(0)[0] == TAB_DROP_TYPE) {
draggedTab = dt.mozGetDataAt(TAB_DROP_TYPE, 0);
if (!draggedTab) {
return;
}
movingTabs = draggedTab._dragData.movingTabs;
draggedTab.container._finishGroupSelectedTabs(draggedTab);

// Fix for FF133+
if (draggedTab.container._finishMoveTogetherSelectedTabs) {
draggedTab.container._finishMoveTogetherSelectedTabs(draggedTab);
} else {
draggedTab.container._finishGroupSelectedTabs(draggedTab);
}
}
if (draggedTab && dropEffect == "copy") {}
else if (draggedTab && draggedTab.container == this) {
if (draggedTab && dropEffect != "copy" && draggedTab.container == this) {
newIndex = this._getDropIndex(event, false);

/* fix for moving multiple selected tabs */
Expand All @@ -599,7 +604,7 @@ function zzzz_MultiRowTabLite() {
};

// We then attach the event listeners for the new functionability to take effect
if (Listeners == false) {
if (!Listeners) {
gBrowser.tabContainer.addEventListener("dragover", gBrowser.tabContainer._onDragOver, true);
gBrowser.tabContainer.addEventListener("drop", function(event){this.onDrop(event);}, true);
Listeners = true;
Expand Down
Loading

0 comments on commit 4cbe706

Please sign in to comment.