forked from ZenBrowserMirrors/zen-desktop
feat: Added new private window looks, b=(no-bug), c=common, tabs, workspaces
This commit is contained in:
parent
be55a26a94
commit
40d38b3961
6 changed files with 93 additions and 33 deletions
|
@ -199,6 +199,16 @@
|
||||||
--zen-themed-toolbar-bg-transparent: transparent;
|
--zen-themed-toolbar-bg-transparent: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&[zen-private-window='true'] {
|
||||||
|
--zen-main-browser-background: linear-gradient(
|
||||||
|
130deg,
|
||||||
|
light-dark(rgb(247, 217, 255), rgb(10, 6, 11)) 0%,
|
||||||
|
light-dark(rgb(242, 198, 255), rgb(19, 7, 22)) 100%
|
||||||
|
);
|
||||||
|
--zen-main-browser-background-toolbar: var(--zen-main-browser-background);
|
||||||
|
--zen-primary-color: light-dark(rgb(93, 42, 107), rgb(110, 48, 125)) !important;
|
||||||
|
}
|
||||||
|
|
||||||
--toolbar-field-background-color: var(--zen-colors-input-bg) !important;
|
--toolbar-field-background-color: var(--zen-colors-input-bg) !important;
|
||||||
--arrowpanel-background: var(--zen-dialog-background) !important;
|
--arrowpanel-background: var(--zen-dialog-background) !important;
|
||||||
|
|
||||||
|
|
|
@ -151,7 +151,7 @@
|
||||||
document.documentElement.getAttribute('chromehidden')?.includes('menubar')
|
document.documentElement.getAttribute('chromehidden')?.includes('menubar')
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
return this._enabled;
|
return this._enabled && !gZenWorkspaces.privateWindowOrDisabled;
|
||||||
}
|
}
|
||||||
|
|
||||||
async _refreshPinnedTabs({ init = false } = {}) {
|
async _refreshPinnedTabs({ init = false } = {}) {
|
||||||
|
@ -752,6 +752,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
_insertItemsIntoTabContextMenu() {
|
_insertItemsIntoTabContextMenu() {
|
||||||
|
if (!this.enabled) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
const elements = window.MozXULElement.parseXULToFragment(`
|
const elements = window.MozXULElement.parseXULToFragment(`
|
||||||
<menuseparator id="context_zen-pinned-tab-separator" hidden="true"/>
|
<menuseparator id="context_zen-pinned-tab-separator" hidden="true"/>
|
||||||
<menuitem id="context_zen-replace-pinned-url-with-current"
|
<menuitem id="context_zen-replace-pinned-url-with-current"
|
||||||
|
@ -794,6 +797,7 @@
|
||||||
|
|
||||||
updatePinnedTabContextMenu(contextTab) {
|
updatePinnedTabContextMenu(contextTab) {
|
||||||
if (!this.enabled) {
|
if (!this.enabled) {
|
||||||
|
document.getElementById('context_pinTab').hidden = true;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const isVisible = contextTab.pinned && !contextTab.multiselected;
|
const isVisible = contextTab.pinned && !contextTab.multiselected;
|
||||||
|
@ -816,6 +820,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
moveToAnotherTabContainerIfNecessary(event, movingTabs) {
|
moveToAnotherTabContainerIfNecessary(event, movingTabs) {
|
||||||
|
if (!this.enabled) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
try {
|
try {
|
||||||
const pinnedTabsTarget =
|
const pinnedTabsTarget =
|
||||||
event.target.closest('.zen-workspace-pinned-tabs-section') ||
|
event.target.closest('.zen-workspace-pinned-tabs-section') ||
|
||||||
|
@ -1014,6 +1021,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
applyDragoverClass(event, draggedTab) {
|
applyDragoverClass(event, draggedTab) {
|
||||||
|
if (!this.enabled) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
const pinnedTabsTarget = event.target.closest('.zen-workspace-pinned-tabs-section');
|
const pinnedTabsTarget = event.target.closest('.zen-workspace-pinned-tabs-section');
|
||||||
const essentialTabsTarget = event.target.closest('.zen-essentials-container');
|
const essentialTabsTarget = event.target.closest('.zen-essentials-container');
|
||||||
const tabsTarget = event.target.closest('.zen-workspace-normal-tabs-section');
|
const tabsTarget = event.target.closest('.zen-workspace-normal-tabs-section');
|
||||||
|
|
|
@ -1479,12 +1479,3 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ==========================================================================
|
|
||||||
Section: Workspaces disabled, due to private browsing mode
|
|
||||||
========================================================================== */
|
|
||||||
|
|
||||||
:root:not([zen-workspace-id]) #tabbrowser-arrowscrollbox {
|
|
||||||
width: 100%;
|
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
|
|
|
@ -18,7 +18,8 @@
|
||||||
super();
|
super();
|
||||||
if (
|
if (
|
||||||
!Services.prefs.getBoolPref('zen.theme.gradient', true) ||
|
!Services.prefs.getBoolPref('zen.theme.gradient', true) ||
|
||||||
!gZenWorkspaces.shouldHaveWorkspaces
|
!gZenWorkspaces.shouldHaveWorkspaces ||
|
||||||
|
gZenWorkspaces.privateWindowOrDisabled
|
||||||
) {
|
) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -427,7 +428,7 @@
|
||||||
dot.classList.add('zen-theme-picker-dot', 'hidden', 'custom');
|
dot.classList.add('zen-theme-picker-dot', 'hidden', 'custom');
|
||||||
dot.style.opacity = 0;
|
dot.style.opacity = 0;
|
||||||
dot.style.setProperty('--zen-theme-picker-dot-color', color);
|
dot.style.setProperty('--zen-theme-picker-dot-color', color);
|
||||||
this.panel.querySelector('.zen-theme-picker-gradient').appendChild(dot);
|
this.panel.querySelector('#PanelUI-zen-gradient-generator-custom-list').prepend(dot);
|
||||||
this.customColorInput.value = '';
|
this.customColorInput.value = '';
|
||||||
await this.updateCurrentWorkspace();
|
await this.updateCurrentWorkspace();
|
||||||
}
|
}
|
||||||
|
@ -1088,7 +1089,7 @@
|
||||||
this.isDarkMode ? 0.2 : -0.5,
|
this.isDarkMode ? 0.2 : -0.5,
|
||||||
`rgb(${dominantColor[0]}, ${dominantColor[1]}, ${dominantColor[2]})`
|
`rgb(${dominantColor[0]}, ${dominantColor[1]}, ${dominantColor[2]})`
|
||||||
);
|
);
|
||||||
const color = result?.match(/\d+/g).map(Number);
|
const color = result?.match(/\d+/g)?.map(Number);
|
||||||
if (!color || color.length !== 3) {
|
if (!color || color.length !== 3) {
|
||||||
return this.getNativeAccentColor();
|
return this.getNativeAccentColor();
|
||||||
}
|
}
|
||||||
|
@ -1255,6 +1256,7 @@
|
||||||
);
|
);
|
||||||
browser.gZenThemePicker.updateNoise(workspaceTheme.texture);
|
browser.gZenThemePicker.updateNoise(workspaceTheme.texture);
|
||||||
|
|
||||||
|
browser.gZenThemePicker.customColorList.innerHTML = '';
|
||||||
for (const dot of workspaceTheme.gradientColors) {
|
for (const dot of workspaceTheme.gradientColors) {
|
||||||
if (dot.isCustom) {
|
if (dot.isCustom) {
|
||||||
browser.gZenThemePicker.addColorToCustomList(dot.c);
|
browser.gZenThemePicker.addColorToCustomList(dot.c);
|
||||||
|
|
|
@ -48,6 +48,9 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
`;
|
`;
|
||||||
|
|
||||||
async waitForPromises() {
|
async waitForPromises() {
|
||||||
|
if (this.privateWindowOrDisabled) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
await Promise.all([
|
await Promise.all([
|
||||||
this.promiseDBInitialized,
|
this.promiseDBInitialized,
|
||||||
this.promisePinnedInitialized,
|
this.promisePinnedInitialized,
|
||||||
|
@ -115,6 +118,10 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
);
|
);
|
||||||
this._activeWorkspace = Services.prefs.getStringPref('zen.workspaces.active', '');
|
this._activeWorkspace = Services.prefs.getStringPref('zen.workspaces.active', '');
|
||||||
|
|
||||||
|
if (this.isPrivateWindow) {
|
||||||
|
document.documentElement.setAttribute('zen-private-window', 'true');
|
||||||
|
}
|
||||||
|
|
||||||
window.addEventListener('resize', this.onWindowResize.bind(this));
|
window.addEventListener('resize', this.onWindowResize.bind(this));
|
||||||
this.addPopupListeners();
|
this.addPopupListeners();
|
||||||
}
|
}
|
||||||
|
@ -136,21 +143,24 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
await this.initializeWorkspaces();
|
await this.initializeWorkspaces();
|
||||||
if (
|
if (
|
||||||
Services.prefs.getBoolPref('zen.workspaces.swipe-actions', false) &&
|
Services.prefs.getBoolPref('zen.workspaces.swipe-actions', false) &&
|
||||||
this.workspaceEnabled
|
this.workspaceEnabled &&
|
||||||
|
!this.isPrivateWindow
|
||||||
) {
|
) {
|
||||||
this.initializeGestureHandlers();
|
this.initializeGestureHandlers();
|
||||||
this.initializeWorkspaceNavigation();
|
this.initializeWorkspaceNavigation();
|
||||||
}
|
}
|
||||||
|
|
||||||
Services.obs.addObserver(this, 'weave:engine:sync:finish');
|
if (!this.privateWindowOrDisabled) {
|
||||||
Services.obs.addObserver(
|
Services.obs.addObserver(this, 'weave:engine:sync:finish');
|
||||||
async function observe(subject) {
|
Services.obs.addObserver(
|
||||||
this._workspaceBookmarksCache = null;
|
async function observe(subject) {
|
||||||
await this.workspaceBookmarks();
|
this._workspaceBookmarksCache = null;
|
||||||
this._invalidateBookmarkContainers();
|
await this.workspaceBookmarks();
|
||||||
}.bind(this),
|
this._invalidateBookmarkContainers();
|
||||||
'workspace-bookmarks-updated'
|
}.bind(this),
|
||||||
);
|
'workspace-bookmarks-updated'
|
||||||
|
);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Validate browser state before tab operations
|
// Validate browser state before tab operations
|
||||||
|
@ -548,7 +558,7 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
toolbox.addEventListener(
|
toolbox.addEventListener(
|
||||||
'wheel',
|
'wheel',
|
||||||
async (event) => {
|
async (event) => {
|
||||||
if (!this.workspaceEnabled) return;
|
if (this.privateWindowOrDisabled) return;
|
||||||
|
|
||||||
// Only process non-gesture scrolls
|
// Only process non-gesture scrolls
|
||||||
if (event.deltaMode !== 1) return;
|
if (event.deltaMode !== 1) return;
|
||||||
|
@ -627,7 +637,7 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
}
|
}
|
||||||
|
|
||||||
_handleSwipeMayStart(event) {
|
_handleSwipeMayStart(event) {
|
||||||
if (!this.workspaceEnabled || this._inChangingWorkspace) return;
|
if (this.privateWindowOrDisabled || this._inChangingWorkspace) return;
|
||||||
if (event.target.closest('#zen-sidebar-bottom-buttons')) return;
|
if (event.target.closest('#zen-sidebar-bottom-buttons')) return;
|
||||||
|
|
||||||
// Only handle horizontal swipes
|
// Only handle horizontal swipes
|
||||||
|
@ -706,6 +716,9 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
|
|
||||||
set activeWorkspace(value) {
|
set activeWorkspace(value) {
|
||||||
this._activeWorkspace = value;
|
this._activeWorkspace = value;
|
||||||
|
if (this.privateWindowOrDisabled) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
Services.prefs.setStringPref('zen.workspaces.active', value);
|
Services.prefs.setStringPref('zen.workspaces.active', value);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -734,7 +747,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
if (typeof this._shouldHaveWorkspaces === 'undefined') {
|
if (typeof this._shouldHaveWorkspaces === 'undefined') {
|
||||||
let docElement = document.documentElement;
|
let docElement = document.documentElement;
|
||||||
this._shouldHaveWorkspaces = !(
|
this._shouldHaveWorkspaces = !(
|
||||||
PrivateBrowsingUtils.isWindowPrivate(window) ||
|
|
||||||
docElement.getAttribute('chromehidden').includes('toolbar') ||
|
docElement.getAttribute('chromehidden').includes('toolbar') ||
|
||||||
docElement.getAttribute('chromehidden').includes('menubar')
|
docElement.getAttribute('chromehidden').includes('menubar')
|
||||||
);
|
);
|
||||||
|
@ -743,6 +755,14 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
return this._shouldHaveWorkspaces;
|
return this._shouldHaveWorkspaces;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get isPrivateWindow() {
|
||||||
|
return PrivateBrowsingUtils.isWindowPrivate(window);
|
||||||
|
}
|
||||||
|
|
||||||
|
get privateWindowOrDisabled() {
|
||||||
|
return this.isPrivateWindow || !this.shouldHaveWorkspaces;
|
||||||
|
}
|
||||||
|
|
||||||
get workspaceEnabled() {
|
get workspaceEnabled() {
|
||||||
if (typeof this._workspaceEnabled === 'undefined') {
|
if (typeof this._workspaceEnabled === 'undefined') {
|
||||||
this._workspaceEnabled =
|
this._workspaceEnabled =
|
||||||
|
@ -769,6 +789,15 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
return this._workspaceCache;
|
return this._workspaceCache;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (this.isPrivateWindow) {
|
||||||
|
this._workspaceCache = {
|
||||||
|
workspaces: this._privateWorkspace ? [this._privateWorkspace] : [],
|
||||||
|
lastChangeTimestamp: 0,
|
||||||
|
};
|
||||||
|
this._activeWorkspace = this._privateWorkspace?.uuid;
|
||||||
|
return this._workspaceCache;
|
||||||
|
}
|
||||||
|
|
||||||
const [workspaces, lastChangeTimestamp] = await Promise.all([
|
const [workspaces, lastChangeTimestamp] = await Promise.all([
|
||||||
ZenWorkspacesStorage.getWorkspaces(),
|
ZenWorkspacesStorage.getWorkspaces(),
|
||||||
ZenWorkspacesStorage.getLastChangeTimestamp(),
|
ZenWorkspacesStorage.getLastChangeTimestamp(),
|
||||||
|
@ -1242,6 +1271,9 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
}
|
}
|
||||||
|
|
||||||
async saveWorkspace(workspaceData, preventPropagation = false) {
|
async saveWorkspace(workspaceData, preventPropagation = false) {
|
||||||
|
if (this.privateWindowOrDisabled) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
await ZenWorkspacesStorage.saveWorkspace(workspaceData);
|
await ZenWorkspacesStorage.saveWorkspace(workspaceData);
|
||||||
if (!preventPropagation) {
|
if (!preventPropagation) {
|
||||||
await this._propagateWorkspaceData();
|
await this._propagateWorkspaceData();
|
||||||
|
@ -1383,10 +1415,14 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
}
|
}
|
||||||
|
|
||||||
async _propagateWorkspaceData({ ignoreStrip = false, clearCache = true } = {}) {
|
async _propagateWorkspaceData({ ignoreStrip = false, clearCache = true } = {}) {
|
||||||
|
const currentWindowIsPrivate = this.isPrivateWindow;
|
||||||
await this.foreachWindowAsActive(async (browser) => {
|
await this.foreachWindowAsActive(async (browser) => {
|
||||||
// Do not update the window if workspaces are not enabled in it.
|
// Do not update the window if workspaces are not enabled in it.
|
||||||
// For example, when the window is in private browsing mode.
|
// For example, when the window is in private browsing mode.
|
||||||
if (!browser.gZenWorkspaces.workspaceEnabled) {
|
if (
|
||||||
|
!browser.gZenWorkspaces.workspaceEnabled ||
|
||||||
|
browser.gZenWorkspaces.isPrivateWindow !== currentWindowIsPrivate
|
||||||
|
) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1710,7 +1746,7 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
}
|
}
|
||||||
|
|
||||||
async openWorkspacesDialog(event) {
|
async openWorkspacesDialog(event) {
|
||||||
if (!this.workspaceEnabled) {
|
if (!this.workspaceEnabled || this.isPrivateWindow) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let target = event.target.closest('.zen-current-workspace-indicator');
|
let target = event.target.closest('.zen-current-workspace-indicator');
|
||||||
|
@ -2526,6 +2562,7 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
}
|
}
|
||||||
|
|
||||||
async _updateWorkspacesChangeContextMenu() {
|
async _updateWorkspacesChangeContextMenu() {
|
||||||
|
if (gZenWorkspaces.privateWindowOrDisabled) return;
|
||||||
const workspaces = await this._workspaces();
|
const workspaces = await this._workspaces();
|
||||||
|
|
||||||
const menuPopup = document.getElementById('context-zen-change-workspace-tab-menu-popup');
|
const menuPopup = document.getElementById('context-zen-change-workspace-tab-menu-popup');
|
||||||
|
@ -2575,6 +2612,10 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
if (!this.workspaceEnabled) {
|
if (!this.workspaceEnabled) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
if (this.isPrivateWindow) {
|
||||||
|
name = 'Private ' + name;
|
||||||
|
icon = '🥸';
|
||||||
|
}
|
||||||
// get extra tabs remaning (e.g. on new profiles) and just move them to the new workspace
|
// get extra tabs remaning (e.g. on new profiles) and just move them to the new workspace
|
||||||
const extraTabs = Array.from(gBrowser.tabContainer.arrowScrollbox.children).filter(
|
const extraTabs = Array.from(gBrowser.tabContainer.arrowScrollbox.children).filter(
|
||||||
(child) =>
|
(child) =>
|
||||||
|
@ -2590,7 +2631,11 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
||||||
!dontChange,
|
!dontChange,
|
||||||
containerTabId
|
containerTabId
|
||||||
);
|
);
|
||||||
await this.saveWorkspace(workspaceData, dontChange);
|
if (this.isPrivateWindow) {
|
||||||
|
this._privateWorkspace = workspaceData;
|
||||||
|
} else {
|
||||||
|
await this.saveWorkspace(workspaceData, dontChange);
|
||||||
|
}
|
||||||
if (!dontChange) {
|
if (!dontChange) {
|
||||||
this.registerPinnedResizeObserver();
|
this.registerPinnedResizeObserver();
|
||||||
let changed = extraTabs.length > 0;
|
let changed = extraTabs.length > 0;
|
||||||
|
|
|
@ -466,10 +466,12 @@
|
||||||
height: calc(100% - var(--zen-toolbox-padding) * 2);
|
height: calc(100% - var(--zen-toolbox-padding) * 2);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover,
|
:root:not([zen-private-window]) & {
|
||||||
&[open='true'] {
|
&:hover,
|
||||||
&::before {
|
&[open='true'] {
|
||||||
background: var(--tab-hover-background-color);
|
&::before {
|
||||||
|
background: var(--tab-hover-background-color);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue