ZenBrowserMirrors/components
1
0
Fork 0
mirror of https://github.com/zen-browser/components.git synced 2025-07-08 01:39:59 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Refactor ZenCompactMode to add context menu for compact mode options

Browse source
This commit is contained in:
mauro-balades 2024-09-22 13:06:00 +02:00
parent 6fc85d1c09
commit 5c62458dcb
1 changed files with 71 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

85
src/ZenCompactMode.mjs
View file

@ -1,15 +1,25 @@
const lazyCompactMode = {};
XPCOMUtils.defineLazyPreferenceGetter(
lazyCompactMode,
"COMPACT_MODE_FLASH_DURATION",
"zen.view.compact.toolbar-flash-popup.duration",
800
);
var gZenCompactModeManager = {
_flashSidebarTimeout: {},
_evenListeners: [],
init() {
Services.prefs.addObserver('zen.view.compact', this._updateEvent.bind(this));
Services.prefs.addObserver('zen.view.compact.toolbar-flash-popup.duration', this._updatedSidebarFlashDuration.bind(this));
gZenUIManager.addPopupTrackingAttribute(this.sidebar);
gZenUIManager.addPopupTrackingAttribute(document.getElementById('zen-appcontent-navbar-container'));
this.addMouseActions();
this.addContextMenu();
},
get prefefence() {
@ -18,6 +28,7 @@ var gZenCompactModeManager = {
set preference(value) {
Services.prefs.setBoolPref('zen.view.compact', value);
return value;
},
get sidebar() {
@ -27,6 +38,63 @@ var gZenCompactModeManager = {
return this._sidebar;
},
addContextMenu() {
const compactModeActive = Services.prefs.getBoolPref('zen.view.compact');
const compactModeSidebar = Services.prefs.getBoolPref('zen.view.compact.hide-tabbar');
const compactModeToolbar = Services.prefs.getBoolPref('zen.view.compact.hide-toolbar');
const compactModeBoth = compactModeSidebar && compactModeToolbar;
const fragment = window.MozXULElement.parseXULToFragment(`
<menu id="zen-context-menu-compact-mode" data-l10n-id="zen-toolbar-context-compact-mode">
<menupopup>
<menuitem checked="${compactModeActive}" id="zen-context-menu-compact-mode-toggle" data-l10n-id="zen-toolbar-context-compact-mode-enable" type="checkbox" oncommand="gZenCompactModeManager.contextMenuToggle();"/>
<menuseparator/>
<menuitem checked="${!compactModeBoth && compactModeSidebar}" id="zen-context-menu-compact-mode-hide-sidebar" data-l10n-id="zen-toolbar-context-compact-mode-just-tabs" type="radio" oncommand="gZenCompactModeManager.contextMenuHideSidebar();"/>
<menuitem checked="${!compactModeBoth && compactModeToolbar}" id="zen-context-menu-compact-mode-hide-toolbar" data-l10n-id="zen-toolbar-context-compact-mode-just-toolbar" type="radio" oncommand="gZenCompactModeManager.contextMenuHideToolbar();"/>
<menuitem checked="${compactModeBoth}" id="zen-context-menu-compact-mode-hide-both" data-l10n-id="zen-toolbar-context-compact-mode-hide-both" type="radio" oncommand="gZenCompactModeManager.contextMenuHideBoth();"/>
</menupopup>
</menu>
`);
document.getElementById('viewToolbarsMenuSeparator').before(fragment);
},
contextMenuToggle() {
document.getElementById('zen-context-menu-compact-mode-toggle')
.setAttribute('checked', this.toggle());
},
contextMenuHideSidebar() {
Services.prefs.setBoolPref('zen.view.compact.hide-tabbar', true);
Services.prefs.setBoolPref('zen.view.compact.hide-toolbar', false);
document.getElementById('zen-context-menu-compact-mode-hide-sidebar')
.setAttribute('checked', true);
document.getElementById('zen-context-menu-compact-mode-hide-toolbar')
.setAttribute('checked', false);
document.getElementById('zen-context-menu-compact-mode-hide-both')
.setAttribute('checked', false);
},
contextMenuHideToolbar() {
Services.prefs.setBoolPref('zen.view.compact.hide-toolbar', true);
Services.prefs.setBoolPref('zen.view.compact.hide-tabbar', false);
document.getElementById('zen-context-menu-compact-mode-hide-sidebar')
.setAttribute('checked', false);
document.getElementById('zen-context-menu-compact-mode-hide-toolbar')
.setAttribute('checked', true);
document.getElementById('zen-context-menu-compact-mode-hide-both')
.setAttribute('checked', false);
},
contextMenuHideBoth() {
Services.prefs.setBoolPref('zen.view.compact.hide-tabbar', true);
Services.prefs.setBoolPref('zen.view.compact.hide-toolbar', true);
document.getElementById('zen-context-menu-compact-mode-hide-sidebar')
.setAttribute('checked', false);
document.getElementById('zen-context-menu-compact-mode-hide-toolbar')
.setAttribute('checked', false);
document.getElementById('zen-context-menu-compact-mode-hide-both')
.setAttribute('checked', true);
},
addEventListener(callback) {
this._evenListeners.push(callback);
},
@ -37,24 +105,13 @@ var gZenCompactModeManager = {
},
toggle() {
this.preference = !this.prefefence;
},
_updatedSidebarFlashDuration() {
this._flashSidebarDuration = Services.prefs.getIntPref('zen.view.compact.toolbar-flash-popup.duration');
return this.preference = !this.prefefence;
},
toggleSidebar() {
this.sidebar.toggleAttribute('zen-user-show');
},
get flashSidebarDuration() {
if (this._flashSidebarDuration) {
return this._flashSidebarDuration;
}
return Services.prefs.getIntPref('zen.view.compact.toolbar-flash-popup.duration');
},
get hideAfterHoverDuration() {
if (this._hideAfterHoverDuration) {
return this._hideAfterHoverDuration;
@ -74,7 +131,7 @@ var gZenCompactModeManager = {
element = this.sidebar;
}
if (!duration) {
duration = this.flashSidebarDuration;
duration = lazyCompactMode.COMPACT_MODE_FLASH_DURATION;
}
if (!id) {
id = this.sidebar.id;