feat: add setting to disable hotkeys (#889)
This commit is contained in:
parent
4a6f7b74a4
commit
8f84ae5a51
|
@ -1,6 +1,4 @@
|
||||||
<div class="{inDialog ? 'in-dialog' : ''}">
|
<div class="{inDialog ? 'in-dialog' : ''}">
|
||||||
<h1>Hotkeys</h1>
|
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
<li><kbd>s</kbd> to search</li>
|
<li><kbd>s</kbd> to search</li>
|
||||||
<li><kbd>1</kbd> - <kbd>6</kbd> to switch columns</li>
|
<li><kbd>1</kbd> - <kbd>6</kbd> to switch columns</li>
|
||||||
|
@ -22,9 +20,6 @@
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<style>
|
<style>
|
||||||
.in-dialog h1 {
|
|
||||||
color: var(--muted-modal-text);
|
|
||||||
}
|
|
||||||
li {
|
li {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,11 +4,18 @@
|
||||||
background="var(--muted-modal-bg)"
|
background="var(--muted-modal-bg)"
|
||||||
muted="true"
|
muted="true"
|
||||||
className="shortcut-help-modal-dialog">
|
className="shortcut-help-modal-dialog">
|
||||||
|
|
||||||
|
<h1>Hotkeys</h1>
|
||||||
|
|
||||||
<ShortcutHelpInfo inDialog={true} />
|
<ShortcutHelpInfo inDialog={true} />
|
||||||
|
|
||||||
<Shortcut scope='modal' key='h|?' on:pressed='close()'/>
|
<Shortcut scope='modal' key='h|?' on:pressed='close()'/>
|
||||||
</ModalDialog>
|
</ModalDialog>
|
||||||
|
<style>
|
||||||
|
h1 {
|
||||||
|
color: var(--muted-modal-text);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
<script>
|
<script>
|
||||||
import ModalDialog from './ModalDialog.html'
|
import ModalDialog from './ModalDialog.html'
|
||||||
import ShortcutHelpInfo from '../../ShortcutHelpInfo.html'
|
import ShortcutHelpInfo from '../../ShortcutHelpInfo.html'
|
||||||
|
|
|
@ -1,11 +1,44 @@
|
||||||
<SettingsLayout page='settings/hotkeys' label="Hotkeys">
|
<SettingsLayout page='settings/hotkeys' label="Hotkeys">
|
||||||
|
<h1>Hotkeys</h1>
|
||||||
|
|
||||||
|
<h2 class="sr-only">Preferences</h2>
|
||||||
|
<form class="ui-settings" aria-label="Hotkey settings">
|
||||||
|
<div class="setting-group">
|
||||||
|
<input type="checkbox" id="choice-disable-hotkeys"
|
||||||
|
bind:checked="$disableHotkeys" on:change="onChange()">
|
||||||
|
<label for="choice-disable-hotkeys">Disable hotkeys</label>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<h2 class="sr-only">Guide</h2>
|
||||||
|
|
||||||
<ShortcutHelpInfo />
|
<ShortcutHelpInfo />
|
||||||
</SettingsLayout>
|
</SettingsLayout>
|
||||||
|
<style>
|
||||||
|
.ui-settings {
|
||||||
|
background: var(--form-bg);
|
||||||
|
border: 1px solid var(--main-border);
|
||||||
|
border-radius: 4px;
|
||||||
|
padding: 20px;
|
||||||
|
line-height: 2em;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.setting-group {
|
||||||
|
padding: 5px 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
<script>
|
<script>
|
||||||
import SettingsLayout from '../../_components/settings/SettingsLayout.html'
|
import SettingsLayout from '../../_components/settings/SettingsLayout.html'
|
||||||
import ShortcutHelpInfo from '../../_components/ShortcutHelpInfo.html'
|
import ShortcutHelpInfo from '../../_components/ShortcutHelpInfo.html'
|
||||||
|
import { store } from '../../_store/store'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
store: () => store,
|
||||||
|
methods: {
|
||||||
|
onChange () {
|
||||||
|
this.store.save()
|
||||||
|
}
|
||||||
|
},
|
||||||
components: {
|
components: {
|
||||||
SettingsLayout,
|
SettingsLayout,
|
||||||
ShortcutHelpInfo
|
ShortcutHelpInfo
|
||||||
|
|
|
@ -11,6 +11,7 @@ const persistedState = {
|
||||||
currentRegisteredInstanceName: undefined,
|
currentRegisteredInstanceName: undefined,
|
||||||
currentRegisteredInstance: undefined,
|
currentRegisteredInstance: undefined,
|
||||||
disableCustomScrollbars: false,
|
disableCustomScrollbars: false,
|
||||||
|
disableHotkeys: false,
|
||||||
disableLongAriaLabels: false,
|
disableLongAriaLabels: false,
|
||||||
disableTapOnStatus: false,
|
disableTapOnStatus: false,
|
||||||
largeInlineMedia: false,
|
largeInlineMedia: false,
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
import { store } from '../_store/store'
|
||||||
|
|
||||||
// A map of scopeKey to KeyMap
|
// A map of scopeKey to KeyMap
|
||||||
let scopeKeyMaps
|
let scopeKeyMaps
|
||||||
|
|
||||||
|
@ -119,6 +121,9 @@ function handleEvent (scopeKey, keyMap, key, event) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function onKeyDown (event) {
|
function onKeyDown (event) {
|
||||||
|
if (store.get().disableHotkeys) {
|
||||||
|
return
|
||||||
|
}
|
||||||
if (!acceptShortcutEvent(event)) {
|
if (!acceptShortcutEvent(event)) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue