Skip to content

Commit bb67a43

Browse files
committed
update the vertical tabs scripts.
avoid drag behavior if you try to drag a row by a secondary button. at the same time, avoid activating secondary buttons if they're clicked while shift/ctrl is pressed.
1 parent a5e9350 commit bb67a43

2 files changed

Lines changed: 83 additions & 27 deletions

File tree

JS/allTabsMenuExpansionPack.uc.js

Lines changed: 35 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// ==UserScript==
22
// @name All Tabs Menu Expansion Pack
3-
// @version 2.0.8
3+
// @version 2.0.9
44
// @author aminomancer
55
// @homepage https://github.com/aminomancer
66
// @description Next to the "new tab" button in Firefox there's a V-shaped button that opens a
@@ -502,11 +502,13 @@
502502
});
503503
if (this.className) row.classList.add(this.className);
504504
row.tab = tab;
505+
row.mOverSecondaryButton = false;
505506
row.addEventListener("command", this);
506507
row.addEventListener("mousedown", this);
507508
row.addEventListener("mouseup", this);
508509
row.addEventListener("click", this);
509510
row.addEventListener("mouseover", this);
511+
row.addEventListener("mouseout", this);
510512
this.tabToElement.set(tab, row);
511513

512514
let button = row.appendChild(
@@ -607,7 +609,10 @@
607609
this._onCommand(e, tab);
608610
break;
609611
case "mouseover":
610-
this._warmupRowTab(e, tab);
612+
this._onMouseOver(e, tab);
613+
break;
614+
case "mouseout":
615+
this._onMouseOut(e);
611616
break;
612617
case "TabPinned":
613618
case "TabUnpinned":
@@ -674,14 +679,12 @@
674679
this.gBrowser.clearMultiSelectedTabs();
675680
}
676681
this.gBrowser.addRangeToMultiSelectedTabs(lastSelectedTab, tab);
677-
e.preventDefault();
678682
} else if (accelKey) {
679683
if (tab.multiselected) this.gBrowser.removeFromMultiSelectedTabs(tab);
680684
else if (tab != this.gBrowser.selectedTab) {
681685
this.gBrowser.addToMultiSelectedTabs(tab);
682686
this.gBrowser.lastMultiSelectedTab = tab;
683687
}
684-
e.preventDefault();
685688
} else {
686689
if (!tab.selected && tab.multiselected) this.gBrowser.lockClearMultiSelectionOnce();
687690
if (
@@ -696,6 +699,10 @@
696699
else this.gBrowser.tabContainer._handleTabSelect();
697700
}
698701
}
702+
if (e.target.closest(".all-tabs-item")?.mOverSecondaryButton) {
703+
e.stopPropagation();
704+
e.preventDefault();
705+
}
699706
};
700707
tabsPanel._onMouseUp = function (e, tab) {
701708
if (e.button === 2) return;
@@ -708,16 +715,24 @@
708715
}
709716
if (e.target.classList.contains("all-tabs-secondary-button")) return;
710717
if (tab.hidden) return this._onCommand(e, tab);
711-
let accelKey = AppConstants.platform == "macosx" ? e.metaKey : e.ctrlKey;
712-
if (e.shiftKey || accelKey) return;
718+
if (e.shiftKey || (AppConstants.platform == "macosx" ? e.metaKey : e.ctrlKey)) {
719+
return;
720+
}
713721
delete tab.noCanvas;
714722
this.gBrowser.unlockClearMultiSelection();
715723
this.gBrowser.clearMultiSelectedTabs();
716724
PanelMultiView.hidePopup(PanelMultiView.forNode(this.view.panelMultiView)._panel);
717725
};
718726
tabsPanel._onClick = function (e, tab) {
719-
if (e.button !== 0 || e.target.classList.contains("all-tabs-secondary-button")) return;
720-
e.preventDefault();
727+
if (e.button === 0) {
728+
if (
729+
e.target.classList.contains("all-tabs-secondary-button") &&
730+
!e.shiftKey &&
731+
!(AppConstants.platform == "macosx" ? e.metaKey : e.ctrlKey)
732+
)
733+
return;
734+
e.preventDefault();
735+
}
721736
};
722737
tabsPanel._onCommand = function (e, tab) {
723738
if (e.target.hasAttribute("toggle-mute")) {
@@ -885,13 +900,23 @@
885900
tabsPanel._onTabMultiSelect = function () {
886901
for (let item of this.rows) item.toggleAttribute("multiselected", !!item.tab.multiselected);
887902
};
888-
tabsPanel._warmupRowTab = function (e, tab) {
903+
tabsPanel._onMouseOver = function (e, tab) {
889904
let row = e.target.closest(".all-tabs-item");
890905
SessionStore.speculativeConnectOnTabHover(tab);
891-
if (row.querySelector("[close-button]").matches(":hover"))
906+
if (e.target.classList.contains("all-tabs-secondary-button")) {
907+
row.mOverSecondaryButton = true;
908+
}
909+
if (e.target.hasAttribute("close-button")) {
892910
tab = gBrowser._findTabToBlurTo(tab);
911+
}
893912
gBrowser.warmupTab(tab);
894913
};
914+
tabsPanel._onMouseOut = function (e) {
915+
let row = e.target.closest(".all-tabs-item");
916+
if (e.target.classList.contains("all-tabs-secondary-button")) {
917+
row.mOverSecondaryButton = false;
918+
}
919+
};
895920
tabsPanel.view.addEventListener("ViewShowing", l10nIfNeeded, { once: true });
896921
["dragstart", "dragleave", "dragover", "drop", "dragend"].forEach(ev =>
897922
tabsPanel.containerNode.addEventListener(ev, tabsPanel)

JS/verticalTabsPane.uc.js

Lines changed: 48 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// ==UserScript==
22
// @name Vertical Tabs Pane
3-
// @version 1.6.3
3+
// @version 1.6.4
44
// @author aminomancer
55
// @homepage https://github.com/aminomancer/uc.css.js
66
// @description Create a vertical pane across from the sidebar that functions
@@ -567,7 +567,10 @@
567567
this._onCommand(e, tab);
568568
break;
569569
case "mouseover":
570-
this._warmupRowTab(e, tab);
570+
this._onMouseOver(e, tab);
571+
break;
572+
case "mouseout":
573+
this._onMouseOut(e);
571574
break;
572575
case "mouseenter":
573576
this._onMouseEnter(e);
@@ -898,11 +901,13 @@
898901
});
899902
if (this.className) row.classList.add(this.className);
900903
row.tab = tab;
904+
row.mOverSecondaryButton = false;
901905
row.addEventListener("command", this);
902906
row.addEventListener("mousedown", this);
903907
row.addEventListener("mouseup", this);
904908
row.addEventListener("click", this);
905909
row.addEventListener("mouseover", this);
910+
row.addEventListener("mouseout", this);
906911
this.tabToElement.set(tab, row);
907912

908913
// main button
@@ -1189,14 +1194,12 @@
11891194
gBrowser.clearMultiSelectedTabs();
11901195
}
11911196
gBrowser.addRangeToMultiSelectedTabs(lastSelectedTab, tab);
1192-
e.preventDefault();
11931197
} else if (accelKey) {
11941198
if (tab.multiselected) gBrowser.removeFromMultiSelectedTabs(tab);
11951199
else if (tab != gBrowser.selectedTab) {
11961200
gBrowser.addToMultiSelectedTabs(tab);
11971201
gBrowser.lastMultiSelectedTab = tab;
11981202
}
1199-
e.preventDefault();
12001203
} else {
12011204
if (!tab.selected && tab.multiselected) gBrowser.lockClearMultiSelectionOnce();
12021205
if (
@@ -1211,6 +1214,10 @@
12111214
else gBrowser.tabContainer._handleTabSelect();
12121215
}
12131216
}
1217+
if (e.target.closest(".all-tabs-item")?.mOverSecondaryButton) {
1218+
e.stopPropagation();
1219+
e.preventDefault();
1220+
}
12141221
}
12151222
// when the mouse is released, clear the multiselection and perform some
12161223
// drag/drop cleanup. if middle mouse button was clicked, then close the
@@ -1225,9 +1232,13 @@
12251232
});
12261233
return;
12271234
}
1228-
let accelKey = AppConstants.platform == "macosx" ? e.metaKey : e.ctrlKey;
1229-
if (e.shiftKey || accelKey || e.target.classList.contains("all-tabs-secondary-button"))
1235+
if (
1236+
e.shiftKey ||
1237+
(AppConstants.platform == "macosx" ? e.metaKey : e.ctrlKey) ||
1238+
e.target.classList.contains("all-tabs-secondary-button")
1239+
) {
12301240
return;
1241+
}
12311242
delete tab.noCanvas;
12321243
gBrowser.unlockClearMultiSelection();
12331244
gBrowser.clearMultiSelectedTabs();
@@ -1294,8 +1305,15 @@
12941305
// "click" events work kind of like "mouseup" events, but in this case we're
12951306
// only using this to prevent the click event yielding a command event.
12961307
_onClick(e) {
1297-
if (e.button !== 0 || e.target.classList.contains("all-tabs-secondary-button")) return;
1298-
e.preventDefault();
1308+
if (e.button === 0) {
1309+
if (
1310+
e.target.classList.contains("all-tabs-secondary-button") &&
1311+
!e.shiftKey &&
1312+
!(AppConstants.platform == "macosx" ? e.metaKey : e.ctrlKey)
1313+
)
1314+
return;
1315+
e.preventDefault();
1316+
}
12991317
}
13001318
// "command" events happen on click or on spacebar/enter. we want the
13011319
// buttons to be keyboard accessible too. so this is how the mute button and
@@ -1492,19 +1510,32 @@
14921510
? item.setAttribute("multiselected", true)
14931511
: item.removeAttribute("multiselected");
14941512
}
1495-
// invoked when mousing over a row. we want to speculatively warm up a tab
1496-
// when the user hovers it since it's possible they will click it. there's a
1497-
// cache for this with a maximum limit, so if the user mouses over 3 tabs
1498-
// without clicking them, then a 4th, it will clear the 1st to make room.
1499-
// this is the same thing the built-in tab bar does so we're just mimicking
1500-
// vanilla behavior here. this can be disabled with
1501-
// browser.tabs.remote.warmup.enabled
1502-
_warmupRowTab(e, tab) {
1513+
// invoked when mousing over a row. we use this to set a flag
1514+
// mOverSecondaryButton on the row, which our drag handlers reference. we
1515+
// want to speculatively warm up a tab when the user hovers it since it's
1516+
// possible they will click it. there's a cache for this with a maximum
1517+
// limit, so if the user mouses over 3 tabs without clicking them, then a
1518+
// 4th, it will clear the 1st to make room. this is the same thing the
1519+
// built-in tab bar does so we're just mimicking vanilla behavior here. this
1520+
// can be disabled with browser.tabs.remote.warmup.enabled
1521+
_onMouseOver(e, tab) {
15031522
let row = this._findRow(e.target);
15041523
SessionStore.speculativeConnectOnTabHover(tab);
1505-
if (row.closeButton.matches(":hover")) tab = gBrowser._findTabToBlurTo(tab);
1524+
if (e.target.classList.contains("all-tabs-secondary-button")) {
1525+
row.mOverSecondaryButton = true;
1526+
}
1527+
if (e.target.hasAttribute("close-button")) {
1528+
tab = gBrowser._findTabToBlurTo(tab);
1529+
}
15061530
gBrowser.warmupTab(tab);
15071531
}
1532+
// invoked when mousing out of an element.
1533+
_onMouseOut (e) {
1534+
let row = e.target.closest(".all-tabs-item");
1535+
if (e.target.classList.contains("all-tabs-secondary-button")) {
1536+
row.mOverSecondaryButton = false;
1537+
}
1538+
}
15081539
// generate tooltip labels and decide where to anchor the tooltip. invoked
15091540
// when the vertical-tabs-tooltip is about to be shown.
15101541
createTabTooltip(e) {

0 commit comments

Comments
 (0)