mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-09-29 14:38:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

Working on the macos-keybindings

Browse Source
This commit is contained in:
HarryHeres
2024-09-21 10:44:23 +02:00
parent 413c2819fb
commit 76512840e3
5 changed files with 138 additions and 175 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/browser/app/profile/zen-browser.js
View File

@@ -96,7 +96,6 @@ pref('zen.view.sidebar-collapsed.hide-mute-button', true);
pref('zen.keyboard.shortcuts.enabled', true); pref('zen.keyboard.shortcuts.enabled', true);
pref('zen.keyboard.shortcuts', ""); // Empty string means default shortcuts pref('zen.keyboard.shortcuts', ""); // Empty string means default shortcuts
pref('zen.keyboard.shortcuts.disable-firefox', false);
pref('zen.tabs.dim-pending', true); pref('zen.tabs.dim-pending', true);
pref('zen.themes.updated-value-observer', false); pref('zen.themes.updated-value-observer', false);

65
src/browser/base/content/ZenStartup.mjs
View File

@@ -1,12 +1,6 @@
{ {
const lazy = {}; const lazy = {};
XPCOMUtils.defineLazyPreferenceGetter( XPCOMUtils.defineLazyPreferenceGetter(lazy, 'sidebarHeightThrottle', 'zen.view.sidebar-height-throttle', 500);
lazy,
"sidebarHeightThrottle",
"zen.view.sidebar-height-throttle",
500
);
var ZenStartup = { var ZenStartup = {
init() { init() {
this.openWatermark(); this.openWatermark();
@@ -43,7 +37,7 @@
ZenWorkspaces.init(); ZenWorkspaces.init();
gZenVerticalTabsManager.init(); gZenVerticalTabsManager.init();
gZenCompactModeManager.init(); gZenCompactModeManager.init();
gZenKeyboardShortcuts.init(); gZenKeyboardShortcutsManager.init();
function throttle(f, delay) { function throttle(f, delay) {
let timer = 0; let timer = 0;
@@ -53,7 +47,9 @@
}; };
} }
new ResizeObserver(throttle(this._updateTabsToolbar.bind(this), lazy.sidebarHeightThrottle)).observe(document.getElementById('tabbrowser-tabs')); new ResizeObserver(throttle(this._updateTabsToolbar.bind(this), lazy.sidebarHeightThrottle)).observe(
document.getElementById('tabbrowser-tabs')
);
} catch (e) { } catch (e) {
console.error('ZenThemeModifier: Error initializing browser layout', e); console.error('ZenThemeModifier: Error initializing browser layout', e);
} }
@@ -135,15 +131,13 @@
_moveWindowButtons() { _moveWindowButtons() {
const windowControls = document.getElementById('titlebar-buttonbox-container'); const windowControls = document.getElementById('titlebar-buttonbox-container');
const toolboxIcons = document.getElementById('zen-sidebar-top-buttons'); const toolboxIcons = document.getElementById('zen-sidebar-top-buttons');
if (AppConstants.platform == "macosx") { if (AppConstants.platform == 'macosx') {
toolboxIcons.prepend(windowControls); toolboxIcons.prepend(windowControls);
} }
}, },
_hideToolbarButtons() { _hideToolbarButtons() {
const elementsToHide = [ const elementsToHide = ['alltabs-button'];
'alltabs-button',
];
for (let id of elementsToHide) { for (let id of elementsToHide) {
const elem = document.getElementById(id); const elem = document.getElementById(id);
if (elem) { if (elem) {
@@ -172,26 +166,20 @@
</toolbar> </toolbar>
`); `);
document.getElementById('navigator-toolbox').prepend(sidebarBox); document.getElementById('navigator-toolbox').prepend(sidebarBox);
const sideBarTopButtons = document.getElementById('zen-sidebar-top-buttons') const sideBarTopButtons = document
.getElementById('zen-sidebar-top-buttons')
.querySelector('#zen-sidebar-top-buttons-customization-target'); .querySelector('#zen-sidebar-top-buttons-customization-target');
const newTab = document.getElementById('vertical-tabs-newtab-button'); const newTab = document.getElementById('vertical-tabs-newtab-button');
newTab.classList.add('zen-sidebar-action-button'); newTab.classList.add('zen-sidebar-action-button');
setTimeout(() => { setTimeout(() => {
CustomizableUI.registerArea( CustomizableUI.registerArea('zen-sidebar-top-buttons', {
"zen-sidebar-top-buttons", type: CustomizableUI.TYPE_TOOLBAR,
{ defaultPlacements: ['PanelUI-menu-button', 'zen-expand-sidebar-button', 'zen-profile-button'],
type: CustomizableUI.TYPE_TOOLBAR, defaultCollapsed: null,
defaultPlacements: [ });
"PanelUI-menu-button", "zen-expand-sidebar-button", "zen-profile-button" CustomizableUI.registerToolbarNode(document.getElementById('zen-sidebar-top-buttons'));
],
defaultCollapsed: null,
}
);
CustomizableUI.registerToolbarNode(
document.getElementById('zen-sidebar-top-buttons')
);
const panelMenu = document.getElementById('PanelUI-menu-button'); const panelMenu = document.getElementById('PanelUI-menu-button');
panelMenu.classList.add('zen-sidebar-action-button'); panelMenu.classList.add('zen-sidebar-action-button');
@@ -199,27 +187,18 @@
sideBarTopButtons.prepend(panelMenu); sideBarTopButtons.prepend(panelMenu);
const defaultSidebarIcons = [ const defaultSidebarIcons = ['zen-sidepanel-button', 'zen-workspaces-button', 'new-tab-button'];
'zen-sidepanel-button',
'zen-workspaces-button',
'new-tab-button'
];
for (let id of defaultSidebarIcons) { for (let id of defaultSidebarIcons) {
const elem = document.getElementById(id); const elem = document.getElementById(id);
if (id === 'zen-workspaces-button' || !elem) continue; if (id === 'zen-workspaces-button' || !elem) continue;
elem.setAttribute('removable', 'true'); elem.setAttribute('removable', 'true');
} }
CustomizableUI.registerArea( CustomizableUI.registerArea('zen-sidebar-icons-wrapper', {
"zen-sidebar-icons-wrapper", type: CustomizableUI.TYPE_TOOLBAR,
{ defaultPlacements: defaultSidebarIcons,
type: CustomizableUI.TYPE_TOOLBAR, defaultCollapsed: null,
defaultPlacements: defaultSidebarIcons, });
defaultCollapsed: null, CustomizableUI.registerToolbarNode(document.getElementById('zen-sidebar-icons-wrapper'));
}
);
CustomizableUI.registerToolbarNode(
document.getElementById('zen-sidebar-icons-wrapper')
);
}, 100); }, 100);
}, },

238
src/browser/components/preferences/zen-settings.js
View File

@@ -1,7 +1,6 @@
// This Source Code Form is subject to the terms of the Mozilla Public // This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this // License, v. 2.0. If a copy of the MPL was not distributed with this
// file, You can obtain one at http://mozilla.org/MPL/2.0/. // file, You can obtain one at http://mozilla.org/MPL/2.0/.
var gZenMarketplaceManager = { var gZenMarketplaceManager = {
init() { init() {
const checkForUpdates = document.getElementById('zenThemeMarketplaceCheckForUpdates'); const checkForUpdates = document.getElementById('zenThemeMarketplaceCheckForUpdates');
@@ -574,150 +573,146 @@ var gZenWorkspacesSettings = {
}, },
}; };
const ZEN_CKS_CLASS_BASE = 'zenCKSOption';
const ZEN_CKS_INPUT_FIELD_CLASS = `${ZEN_CKS_CLASS_BASE}-input`;
const ZEN_CKS_LABEL_CLASS = `${ZEN_CKS_CLASS_BASE}-label`;
const ZEN_CKS_WRAPPER_ID = `${ZEN_CKS_CLASS_BASE}-wrapper`;
const ZEN_CKS_GROUP_PREFIX = `${ZEN_CKS_CLASS_BASE}-group`;
const KEYBIND_ATTRIBUTE_KEY = 'key';
var gZenCKSSettings = { var gZenCKSSettings = {
init() { init() {
this._currentAction = null; this._currentAction = null;
this._initializeEvents(); this._initializeEvents();
this._initializeCKS(); this._initializeCKS();
this._addPrefObservers();
window.addEventListener('unload', () => {
Services.prefs.removeObserver('zen.keyboard.shortcuts.disable-firefox', this);
});
},
_addPrefObservers() {
Services.prefs.addObserver('zen.keyboard.shortcuts.disable-firefox', this);
},
observe(subject, topic, data) {
this.onDisableFirefoxShortcutsChange();
},
async onDisableFirefoxShortcutsChange(event) {
let checked = Services.prefs.getBoolPref('zen.keyboard.shortcuts.disable-firefox');
if (checked) return;
let buttonIndex = await confirmRestartPrompt(true, 1, true, false);
if (buttonIndex == CONFIRM_RESTART_PROMPT_RESTART_NOW) {
Services.startup.quit(Ci.nsIAppStartup.eAttemptQuit | Ci.nsIAppStartup.eRestart);
return;
}
},
_initializeCKS() {
let wrapepr = document.getElementById('zenCKSOptions-wrapper');
// Create the groups first.
for (let key in kZKSActions) {
const data = kZKSActions[key];
const group = data[2];
if (!wrapepr.querySelector(`[data-group="${group}"]`)) {
let groupElem = document.createElement('h2');
groupElem.setAttribute('data-group', group);
document.l10n.setAttributes(groupElem, `zen-cks-group-${group}`);
wrapepr.appendChild(groupElem);
}
}
const keys = Object.keys(kZKSActions);
for (let i = keys.length - 1; i >= 0; i--) {
const key = keys[i];
const data = kZKSActions[key];
const l10nId = data[1];
const group = data[2];
let fragment = window.MozXULElement.parseXULToFragment(`
<hbox class="zenCKSOption">
<label class="zenCKSOption-label" for="zenCKSOption-${key}"></label>
<html:input readonly="1" class="zenCKSOption-input" id="zenCKSOption-${key}" />
</hbox>
`);
document.l10n.setAttributes(fragment.querySelector('.zenCKSOption-label'), l10nId);
let input = fragment.querySelector('.zenCKSOption-input');
let shortcut = gZenKeyboardShortcuts.getShortcut(key);
if (shortcut) {
input.value = gZenKeyboardShortcuts.shortCutToString(shortcut);
} else {
this._resetCKS(input, key);
}
input.setAttribute('data-key', key);
input.addEventListener('focus', (event) => {
const key = event.target.getAttribute('data-key');
this._currentAction = key;
event.target.classList.add('zenCKSOption-input-editing');
});
input.addEventListener('blur', (event) => {
this._currentAction = null;
event.target.classList.remove('zenCKSOption-input-editing');
});
const groupElem = wrapepr.querySelector(`[data-group="${group}"]`);
groupElem.after(fragment);
}
},
_resetCKS(input, key) {
input.value = 'Not set';
input.classList.add('zenCKSOption-input-not-set');
input.classList.remove('zenCKSOption-input-invalid');
gZenKeyboardShortcuts.setShortcut(key, null);
}, },
_initializeEvents() { _initializeEvents() {
window.addEventListener('keydown', this._handleKeyDown.bind(this)); window.addEventListener('keydown', this._handleKeyDown.bind(this));
}, },
_initializeCKS() {
let wrapper = document.getElementById(ZEN_CKS_WRAPPER_ID);
let shortcuts = gZenKeyboardShortcutsManager.getModifiableShortcuts();
if (!shortcuts) {
throw Error('No shortcuts defined!');
}
// Generate section per each group
for (let group of VALID_SHORTCUT_GROUPS) {
let groupClass = `${ZEN_CKS_GROUP_PREFIX}-${group}`;
if (!wrapper.querySelector(`[data-group="${groupClass}"]`)) {
let groupElem = document.createElement('h2');
groupElem.setAttribute('data-group', groupClass);
document.l10n.setAttributes(groupElem, `groupClass`);
wrapper.appendChild(groupElem);
}
}
for (let shortcut of shortcuts) {
const keyInString = shortcut.toUserString();
const keyID = shortcut.getID();
const action = shortcut.getAction();
const l10nID = shortcut.getL10NID();
const group = shortcut.getGroup();
const labelValue = l10nID == null ? keyID : l10nID;
let fragment = window.MozXULElement.parseXULToFragment(`
<hbox class="${ZEN_CKS_CLASS_BASE}">
<label class="${ZEN_CKS_LABEL_CLASS}" for="${ZEN_CKS_CLASS_BASE}-${action}">${labelValue}</label>
<html:input readonly="1" class="${ZEN_CKS_INPUT_FIELD_CLASS}" id="${ZEN_CKS_INPUT_FIELD_CLASS}-${action}" />
</hbox>
`);
document.l10n.setAttributes(fragment.querySelector(`.${ZEN_CKS_LABEL_CLASS}`), labelValue);
let input = fragment.querySelector(`.${ZEN_CKS_INPUT_FIELD_CLASS}`);
if (keyInString) {
input.value = keyInString;
} else {
this._resetShortcut(input);
}
input.setAttribute(KEYBIND_ATTRIBUTE_KEY, action);
input.addEventListener('focus', (event) => {
const value = event.target.getAttribute(KEYBIND_ATTRIBUTE_KEY);
this._currentAction = value;
event.target.classList.add(`${ZEN_CKS_INPUT_FIELD_CLASS}-editing`);
});
input.addEventListener('editDone', (event) => {
const target = event.target;
target.classList.add(`${ZEN_CKS_INPUT_FIELD_CLASS}-editing`);
this._editDone(target);
});
const groupElem = wrapper.querySelector(`[data-group="${ZEN_CKS_GROUP_PREFIX}-${group}"]`);
groupElem.after(fragment);
}
},
_resetShortcut(input) {
input.value = 'Not set';
input.classList.remove(`${ZEN_CKS_INPUT_FIELD_CLASS}-invalid`);
input.classList.remove(`${ZEN_CKS_INPUT_FIELD_CLASS}-editing`);
input.classList.add(`${ZEN_CKS_INPUT_FIELD_CLASS}-not-set`);
if (this._currentAction) {
gZenKeyboardShortcutsManager.setShortcut(this._currentAction, null, null);
}
},
_editDone(input) {
if (input.classList.contains(`${ZEN_CKS_INPUT_FIELD_CLASS}-invalid`)) {
this._resetShortcut(input);
return;
}
input.classList.remove(`${ZEN_CKS_INPUT_FIELD_CLASS}-editing`);
this._currentAction = null;
},
//TODO Check for duplicates
_handleKeyDown(event) { _handleKeyDown(event) {
event.preventDefault();
if (!this._currentAction) { if (!this._currentAction) {
return; return;
} }
let input = document.querySelector(`.zenCKSOption-input[data-key="${this._currentAction}"]`); let input = document.querySelector(`.${ZEN_CKS_INPUT_FIELD_CLASS}[${KEYBIND_ATTRIBUTE_KEY}="${this._currentAction}"]`);
let shortcut = { const modifiers = new KeyShortcutModifiers(event.ctrlKey, event.altKey, event.shiftKey, event.metaKey);
ctrl: event.ctrlKey, const modifiersActive = modifiers.areAnyActive();
alt: event.altKey,
shift: event.shiftKey,
meta: event.metaKey,
};
const shortcutWithoutModifiers = !shortcut.ctrl && !shortcut.alt && !shortcut.shift && !shortcut.meta; let shortcut = event.key;
if (event.key === 'Tab' && shortcutWithoutModifiers) { shortcut = shortcut.replace(/Ctrl|Control|Shift|Alt|Option|Cmd|Meta/, ''); // Remove all modifiers
if (shortcut == 'Tab' && !modifiersActive) {
return; return;
} else if (event.key === 'Escape' && shortcutWithoutModifiers) { } else if (shortcut == 'Escape' && !modifiersActive) {
this._currentAction = null; this._editDone(input);
input.blur();
return; return;
} else if (event.key === 'Backspace' && shortcutWithoutModifiers) { } else if (shortcut == 'Backspace' && !modifiersActive) {
this._resetCKS(input, this._currentAction); this._resetShortcut(input);
return; return;
} }
if (!shortcut.ctrl && !shortcut.alt && !shortcut.shift && !shortcut.meta) { input.value = modifiers.toUserString() + shortcut;
this._resetCKS(input, this._currentAction);
return; // No modifiers, ignore.
}
if (!['Control', 'Alt', 'Meta', 'Shift'].includes(event.key)) { if (!shortcut || shortcut === '') {
if (event.keycode) {
shortcut.keycode = event.keycode;
} else {
shortcut.key = event.key;
}
}
event.preventDefault();
gZenKeyboardShortcuts.setShortcut(this._currentAction, shortcut);
input.value = gZenKeyboardShortcuts.shortCutToString(shortcut);
input.classList.remove('zenCKSOption-input-not-set');
if (gZenKeyboardShortcuts.isValidShortcut(shortcut)) {
input.classList.remove('zenCKSOption-input-invalid');
} else {
input.classList.add('zenCKSOption-input-invalid'); input.classList.add('zenCKSOption-input-invalid');
return;
} }
input.classList.remove('zenCKSOption-input-not-set');
input.classList.remove('zenCKSOption-input-invalid');
gZenKeyboardShortcutsManager.setShortcut(this._currentAction, shortcut, modifiers);
}, },
}; };
@@ -772,11 +767,6 @@ Preferences.addAll([
type: 'bool', type: 'bool',
default: true, default: true,
}, },
{
id: 'zen.keyboard.shortcuts.disable-firefox',
type: 'bool',
default: false,
},
{ {
id: 'zen.workspaces.hide-default-container-indicator', id: 'zen.workspaces.hide-default-container-indicator',
type: 'bool', type: 'bool',

7
src/browser/components/preferences/zenKeyboardShortcuts.inc.xhtml
View File

@@ -10,12 +10,7 @@
<groupbox id="zenCKSGroup" data-category="paneZenCKS" hidden="true" class="highlighting-group"> <groupbox id="zenCKSGroup" data-category="paneZenCKS" hidden="true" class="highlighting-group">
<label><html:h2 data-l10n-id="zen-settings-CKS-header"/></label> <label><html:h2 data-l10n-id="zen-settings-CKS-header"/></label>
<description class="description-deemphasized" data-l10n-id="zen-settings-CKS-description" /> <description class="description-deemphasized" data-l10n-id="zen-settings-CKS-description" />
<vbox class="indent"> <vbox id="zenCKSOption-wrapper"></vbox>
<checkbox id="zenKSCDisableFirefoxShortcuts"
data-l10n-id="zen-settings-CKS-disable-firefox"
preference="zen.keyboard.shortcuts.disable-firefox" />
</vbox>
<vbox id="zenCKSOptions-wrapper"></vbox>
</groupbox> </groupbox>
</html:template> </html:template>

2
src/browser/themes/shared/preferences/zen-preferences.css
View File

@@ -315,7 +315,7 @@ groupbox h2 {
border-color: red; border-color: red;
} }
#zenCKSOptions-wrapper > [data-group]:not(:first-of-type) { #zenCKSOption-wrapper > [data-group]:not(:first-of-type) {
border-top: 1px solid light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1)); border-top: 1px solid light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
padding-top: 10px; padding-top: 10px;
} }