From f37e80535ab931b81448b0de5bc92eebe0cb4900 Mon Sep 17 00:00:00 2001 From: jso8910 Date: Tue, 11 Feb 2025 12:26:00 +0800 Subject: [PATCH] Added preference to disable tab renaming, refactored inline styles to css files, changed listener to blur, refactored code --- src/browser/app/profile/zen-browser.js | 1 + src/browser/base/content/ZenUIManager.mjs | 54 ++++++------------- .../zen-styles/zen-tabs/vertical-tabs.css | 11 ++++ .../tabbrowser/content/tabbrowser-js.patch | 11 +++- 4 files changed, 39 insertions(+), 38 deletions(-) diff --git a/src/browser/app/profile/zen-browser.js b/src/browser/app/profile/zen-browser.js index c4a5b7c59..442d59e72 100644 --- a/src/browser/app/profile/zen-browser.js +++ b/src/browser/app/profile/zen-browser.js @@ -80,6 +80,7 @@ pref('zen.welcome-screen.seen', false); pref('zen.tabs.vertical', true); pref('zen.tabs.vertical.right-side', false); +pref('zen.tabs.rename-tabs', true); pref('zen.theme.accent-color', "#ffb787"); pref('zen.theme.content-element-separation', 6); // In pixels pref('zen.theme.pill-button', false); diff --git a/src/browser/base/content/ZenUIManager.mjs b/src/browser/base/content/ZenUIManager.mjs index dd2ed94f6..4c0fa5adc 100644 --- a/src/browser/base/content/ZenUIManager.mjs +++ b/src/browser/base/content/ZenUIManager.mjs @@ -186,7 +186,6 @@ var gZenUIManager = { }; var gZenVerticalTabsManager = { - _tabEdited: null, init() { this._multiWindowFeature = new ZenMultiWindowFeature(); this._initWaitPromise(); @@ -224,7 +223,8 @@ var gZenVerticalTabsManager = { document.documentElement.setAttribute('zen-window-buttons-reversed', true); } - //this._insertDoubleClickListenerPinnedTabs(); + this._tabEdited = null; + this._renameTabHalt = this.renameTabHalt.bind(this); gBrowser.tabContainer.addEventListener('dblclick', this.renameTabStart.bind(this)); }, @@ -586,13 +586,6 @@ var gZenVerticalTabsManager = { target.appendChild(child); }, - //_insertDoubleClickListenerPinnedTabs() { - // const tabs = gBrowser.tabs; - // for (const tab of tabs) { - // tab.addEventListener('dblclick', this.renameTabStart.bind(this)); - // } - //}, - renameTabKeydown(event) { if (event.key === 'Enter') { let label = this._tabEdited.querySelector('.tab-label-container-editing'); @@ -604,41 +597,37 @@ var gZenVerticalTabsManager = { this._tabEdited.label = newName; this._tabEdited.setAttribute('zen-has-static-label', 'true'); } else { - // If the page is loaded, get the title of the page. Otherwise, keep name as is - this._tabEdited.label = gBrowser.getBrowserForTab(this._tabEdited).contentTitle || this._tabEdited.label; - // If the page had a title, reset the zen-has-static-label attribute - if (gBrowser.getBrowserForTab(this._tabEdited).contentTitle) { - this._tabEdited.removeAttribute('zen-has-static-label'); - } + this._tabEdited.removeAttribute('zen-has-static-label'); + gBrowser.setTabTitle(this._tabEdited); } this._tabEdited.querySelector('.tab-editor-container').remove(); - label.style.display = ''; - label.className = label.className.replace(' tab-label-container-editing', ''); - document.removeEventListener('click', this.renameTabHalt.bind(this)); + label.classList.remove('tab-label-container-editing'); this._tabEdited = null; } else if (event.key === 'Escape') { let label = this._tabEdited.querySelector('.tab-label-container-editing'); this._tabEdited.querySelector('.tab-editor-container').remove(); - label.style.display = ''; - label.className = label.className.replace(' tab-label-container-editing', ''); - document.removeEventListener('click', this.renameTabHalt.bind(this)); + label.classList.remove('tab-label-container-editing'); this._tabEdited = null; } }, renameTabStart(event) { - if (this._tabEdited) return; + if ( + this._tabEdited || + !Services.prefs.getBoolPref('zen.tabs.rename-tabs') || + Services.prefs.getBoolPref('browser.tabs.closeTabByDblclick') + ) + return; this._tabEdited = event.target.closest('.tabbrowser-tab'); - if (!this._tabEdited || !this._tabEdited.pinned) { + if (!this._tabEdited || !this._tabEdited.pinned || this._tabEdited.hasAttribute('zen-essential')) { this._tabEdited = null; return; } const label = this._tabEdited.querySelector('.tab-label-container'); - label.style.display = 'none'; - label.className += ' tab-label-container-editing'; + label.classList.add('tab-label-container-editing'); const container = window.MozXULElement.parseXULToFragment(` @@ -649,31 +638,22 @@ var gZenVerticalTabsManager = { input.id = 'tab-label-input'; input.value = this._tabEdited.label; input.addEventListener('keydown', this.renameTabKeydown.bind(this)); - input.style['white-space'] = 'nowrap'; - input.style['overflow-x'] = 'scroll'; - input.style['margin'] = '0'; containerHtml.appendChild(input); input.focus(); input.select(); - document.addEventListener('click', this.renameTabHalt.bind(this)); + input.addEventListener('blur', this._renameTabHalt); }, renameTabHalt(event) { - // Ignore click event if it's clicking the input - if (event.target.closest('#tab-label-input')) { - return; - } - if (!this._tabEdited) { + if (document.activeElement === event.target || !this._tabEdited) { return; } this._tabEdited.querySelector('.tab-editor-container').remove(); const label = this._tabEdited.querySelector('.tab-label-container-editing'); - label.style.display = ''; - label.className = label.className.replace(' tab-label-container-editing', ''); + label.classList.remove('tab-label-container-editing'); - document.removeEventListener('click', this.renameTabHalt.bind(this)); this._tabEdited = null; }, }; diff --git a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css index e08650a78..03344faa4 100644 --- a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css +++ b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css @@ -1143,3 +1143,14 @@ #zen-essentials-container .tabbrowser-tab.drag-over-after { box-shadow: -3px 0 6px -2px var(--toolbarbutton-active-background, rgba(0, 255, 0, 0.2)); } + +/* Renaming tab */ +.tab-label-container-editing { + display: none !important; +} + +#tab-label-input { + white-space: nowrap; + overflow-x: scroll; + margin: 0; +} diff --git a/src/browser/components/tabbrowser/content/tabbrowser-js.patch b/src/browser/components/tabbrowser/content/tabbrowser-js.patch index a78d75c7e..778fd492f 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 ff90a70bdad6c94ec4b90027ff102972d0eb28e5..4faba37097f376b57c7376e320f46e9cd3aacffe 100644 +index ff90a70bdad6c94ec4b90027ff102972d0eb28e5..c29a3620f85219074b2eeef8d75b4ca7232414e2 100644 --- a/browser/components/tabbrowser/content/tabbrowser.js +++ b/browser/components/tabbrowser/content/tabbrowser.js @@ -406,11 +406,39 @@ @@ -90,6 +90,15 @@ index ff90a70bdad6c94ec4b90027ff102972d0eb28e5..4faba37097f376b57c7376e320f46e9c if (!keepFocusOnUrlBar) { // Clear focus so that _adjustFocusAfterTabSwitch can detect if // some element has been focused and respect that. +@@ -1785,7 +1822,7 @@ + } + + _setTabLabel(aTab, aLabel, { beforeTabOpen, isContentTitle, isURL } = {}) { +- if (!aLabel || aLabel.includes("about:reader?")) { ++ if (!aLabel || aLabel.includes("about:reader?") || aTab.hasAttribute("zen-has-static-label")) { + return false; + } + @@ -2387,7 +2424,7 @@ let panel = this.getPanel(browser);