diff --git a/ext/bg/js/settings/keyboard-mouse-input-field.js b/ext/bg/js/settings/keyboard-mouse-input-field.js index d1dc76e0..b1530c1b 100644 --- a/ext/bg/js/settings/keyboard-mouse-input-field.js +++ b/ext/bg/js/settings/keyboard-mouse-input-field.js @@ -20,18 +20,18 @@ */ class KeyboardMouseInputField extends EventDispatcher { - constructor(inputNode, mouseButton, inputNameMap, keySeparator) { + constructor(inputNode, mouseButton, os) { super(); this._inputNode = inputNode; - this._keySeparator = keySeparator; + this._mouseButton = mouseButton; + this._keySeparator = ' + '; + this._inputNameMap = new Map(DocumentUtil.getModifierKeys(os)); this._keyPriorities = new Map([ ['meta', -4], ['ctrl', -3], ['alt', -2], ['shift', -1] ]); - this._mouseButton = mouseButton; - this._inputNameMap = inputNameMap; this._mouseInputNamePattern = /^mouse(\d+)$/; this._eventListeners = new EventListenerCollection(); this._value = ''; diff --git a/ext/bg/js/settings/main.js b/ext/bg/js/settings/main.js index b29744ac..f775cd57 100644 --- a/ext/bg/js/settings/main.js +++ b/ext/bg/js/settings/main.js @@ -22,6 +22,7 @@ * ClipboardPopupsController * DictionaryController * DictionaryImportController + * DocumentUtil * GenericSettingController * PopupPreviewController * ProfileController @@ -43,12 +44,12 @@ async function settingsPopulateModifierKeys() { const scanModifierKeySelect = document.querySelector('#scan-modifier-key'); scanModifierKeySelect.textContent = ''; - const environment = await api.getEnvironmentInfo(); + const {platform: {os}} = await api.getEnvironmentInfo(); const modifierKeys = [ - {value: 'none', name: 'None'}, - ...environment.modifiers.keys + ['none', 'None'], + DocumentUtil.getModifierKeys(os) ]; - for (const {value, name} of modifierKeys) { + for (const [value, name] of modifierKeys) { const option = document.createElement('option'); option.value = value; option.textContent = name; diff --git a/ext/bg/js/settings/profile-conditions-ui.js b/ext/bg/js/settings/profile-conditions-ui.js index 4fb181cf..d88f932b 100644 --- a/ext/bg/js/settings/profile-conditions-ui.js +++ b/ext/bg/js/settings/profile-conditions-ui.js @@ -22,8 +22,7 @@ class ProfileConditionsUI { constructor(settingsController) { this._settingsController = settingsController; - this._keySeparator = ''; - this._keyNames = new Map(); + this._os = null; this._conditionGroupsContainer = null; this._addConditionGroupButton = null; this._children = []; @@ -80,12 +79,12 @@ class ProfileConditionsUI { return this._settingsController.profileIndex; } - setKeyInfo(separator, keyNames) { - this._keySeparator = separator; - this._keyNames.clear(); - for (const {value, name} of keyNames) { - this._keyNames.set(value, name); - } + get os() { + return this._os; + } + + set os(value) { + this._os = value; } prepare(conditionGroups) { @@ -209,7 +208,7 @@ class ProfileConditionsUI { } createKeyboardMouseInputField(inputNode, mouseButton) { - return new KeyboardMouseInputField(inputNode, mouseButton, this._keyNames, this._keySeparator); + return new KeyboardMouseInputField(inputNode, mouseButton, this._os); } // Private diff --git a/ext/bg/js/settings/profiles.js b/ext/bg/js/settings/profiles.js index c1961e20..6cd95d9c 100644 --- a/ext/bg/js/settings/profiles.js +++ b/ext/bg/js/settings/profiles.js @@ -47,8 +47,8 @@ class ProfileController { // Private async _onOptionsChanged() { - const {modifiers} = await api.getEnvironmentInfo(); - this._profileConditionsUI.setKeyInfo(modifiers.separator, modifiers.keys); + const {platform: {os}} = await api.getEnvironmentInfo(); + this._profileConditionsUI.os = os; const optionsFull = await this._settingsController.getOptionsFullMutable(); this._formWrite(optionsFull); diff --git a/ext/mixed/js/document-util.js b/ext/mixed/js/document-util.js index ba39942d..0b72ff9a 100644 --- a/ext/mixed/js/document-util.js +++ b/ext/mixed/js/document-util.js @@ -259,6 +259,46 @@ class DocumentUtil { return false; } + static getModifierKeys(os) { + switch (os) { + case 'win': + return [ + ['alt', 'Alt'], + ['ctrl', 'Ctrl'], + ['shift', 'Shift'], + ['meta', 'Windows'] + ]; + case 'mac': + return [ + ['alt', 'Opt'], + ['ctrl', 'Ctrl'], + ['shift', 'Shift'], + ['meta', 'Cmd'] + ]; + case 'linux': + case 'openbsd': + case 'cros': + case 'android': + return [ + ['alt', 'Alt'], + ['ctrl', 'Ctrl'], + ['shift', 'Shift'], + ['meta', 'Super'] + ]; + default: // 'unknown', etc + return [ + ['alt', 'Alt'], + ['ctrl', 'Ctrl'], + ['shift', 'Shift'], + ['meta', 'Meta'] + ]; + } + } + + static isMetaKeySupported(os, browser) { + return !(browser === 'firefox' || browser === 'firefox-mobile') || os === 'mac'; + } + // Private _setImposterStyle(style, propertyName, value) { diff --git a/ext/mixed/js/environment.js b/ext/mixed/js/environment.js index 1f4038d2..3ed9f5cf 100644 --- a/ext/mixed/js/environment.js +++ b/ext/mixed/js/environment.js @@ -33,11 +33,9 @@ class Environment { async _loadEnvironmentInfo() { const browser = await this._getBrowser(); const os = await this._getOperatingSystem(); - const modifierInfo = this._getModifierInfo(browser, os); return { browser, - platform: {os}, - modifiers: modifierInfo + platform: {os} }; } @@ -91,61 +89,4 @@ class Environment { return 'chrome'; } } - - _getModifierInfo(browser, os) { - let osKeys; - let separator; - switch (os) { - case 'win': - separator = ' + '; - osKeys = [ - ['alt', 'Alt'], - ['ctrl', 'Ctrl'], - ['shift', 'Shift'], - ['meta', 'Windows'] - ]; - break; - case 'mac': - separator = ''; - osKeys = [ - ['alt', '⌥'], - ['ctrl', '⌃'], - ['shift', '⇧'], - ['meta', '⌘'] - ]; - break; - case 'linux': - case 'openbsd': - case 'cros': - case 'android': - separator = ' + '; - osKeys = [ - ['alt', 'Alt'], - ['ctrl', 'Ctrl'], - ['shift', 'Shift'], - ['meta', 'Super'] - ]; - break; - default: // 'unknown', etc - separator = ' + '; - osKeys = [ - ['alt', 'Alt'], - ['ctrl', 'Ctrl'], - ['shift', 'Shift'], - ['meta', 'Meta'] - ]; - break; - } - - const isFirefox = (browser === 'firefox' || browser === 'firefox-mobile'); - const keys = []; - - for (const [value, name] of osKeys) { - // Firefox doesn't support event.metaKey on platforms other than macOS - if (value === 'meta' && isFirefox && os !== 'mac') { continue; } - keys.push({value, name}); - } - - return {keys, separator}; - } }