mirrors/zotero
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Merge pull request #2062 from jryans/hide-tab-title-on-close

Browse source 
Hide tab title tooltips whenever the tab bar changes
This commit is contained in:
Dan Stillman 2021-05-19 01:52:01 -04:00 • committed by GitHub
commit c5757afeca
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 28 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
chrome/content/zotero/components/tabBar.jsx
View file

@ -36,15 +36,15 @@ const TabBar = forwardRef(function (props, ref) {
const mouseMoveWaitUntil = useRef(0);
useEffect(() => {
window.addEventListener('mouseup', handleMouseUp);
window.addEventListener('mouseup', handleWindowMouseUp);
return () => {
window.removeEventListener('mouseup', handleMouseUp);
window.removeEventListener('mouseup', handleWindowMouseUp);
};
}, []);
useImperativeHandle(ref, () => ({ setTabs }));
function handleMouseDown(event, id, index) {
function handleTabMouseDown(event, id, index) {
if (event.target.closest('.tab-close')) {
return;
}
@ -55,7 +55,7 @@ const TabBar = forwardRef(function (props, ref) {
event.stopPropagation();
}
function handleMouseMove(event) {
function handleTabBarMouseMove(event) {
if (!draggingID.current || mouseMoveWaitUntil.current > Date.now()) {
return;
}
@ -91,7 +91,7 @@ const TabBar = forwardRef(function (props, ref) {
mouseMoveWaitUntil.current = Date.now() + 100;
}
function handleMouseUp(event) {
function handleWindowMouseUp(event) {
draggingID.current = null;
event.stopPropagation();
}
@ -100,16 +100,27 @@ const TabBar = forwardRef(function (props, ref) {
props.onTabClose(id);
event.stopPropagation();
}
function handleTabMouseMove(title) {
// Fix `title` not working for HTML-in-XUL. Using `mousemove` ensures we restart the tooltip
// after just a small movement even when the active tab has changed under the cursor, which
// matches behavior in Firefox.
window.Zotero_Tooltip.start(title);
}
function handleTabBarMouseOut() {
// Hide any possibly open `title` tooltips when mousing out of any tab or the tab bar as a
// whole. `mouseout` bubbles up from element you moved out of, so it covers both cases.
window.Zotero_Tooltip.stop();
}
function renderTab({ id, title, selected }, index) {
return (
<div
key={id}
className={cx('tab', { selected })}
/* Fix 'title' not working for HTML-in-XUL */
onMouseOver={() => window.Zotero_Tooltip.start(title)}
onMouseOut={() => window.Zotero_Tooltip.stop()}
onMouseDown={(event) => handleMouseDown(event, id, index)}
onMouseMove={() => handleTabMouseMove(title)}
onMouseDown={(event) => handleTabMouseDown(event, id, index)}
>
<div className="tab-name">{title}</div>
<div
@ -123,7 +134,12 @@ const TabBar = forwardRef(function (props, ref) {
}
return (
<div className="tabs" ref={tabsRef} onMouseMove={handleMouseMove}>
<div
ref={tabsRef}
className="tabs"
onMouseMove={handleTabBarMouseMove}
onMouseOut={handleTabBarMouseOut}
>
{tabs.map((tab, index) => renderTab(tab, index))}
</div>
);

2
chrome/content/zotero/tabs.js
View file

@ -66,6 +66,8 @@ var Zotero_Tabs = new function () {
var { tab } = this._getTab(this._selectedID);
document.title = (tab.title.length ? tab.title + ' - ' : '') + 'Zotero';
this._updateTabBar();
// Hide any tab `title` tooltips that might be open
window.Zotero_Tooltip.stop();
};
this.init = function () {