Use event.code instead of event.keyCode. Add key codes to default settings
This commit is contained in:
parent
cd4e3768e2
commit
261f9a6b8d
@ -191,6 +191,7 @@ var ExtensionConf = {
|
|||||||
label: 'Automatic', // example override, takes precedence over default label
|
label: 'Automatic', // example override, takes precedence over default label
|
||||||
shortcut: [{
|
shortcut: [{
|
||||||
key: 'a',
|
key: 'a',
|
||||||
|
code: 'KeyA',
|
||||||
ctrlKey: false,
|
ctrlKey: false,
|
||||||
metaKey: false,
|
metaKey: false,
|
||||||
altKey: false,
|
altKey: false,
|
||||||
@ -204,7 +205,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'crop',
|
path: 'crop',
|
||||||
},
|
},
|
||||||
},{
|
}, {
|
||||||
name: 'Reset to default',
|
name: 'Reset to default',
|
||||||
label: 'Reset',
|
label: 'Reset',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -216,6 +217,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
shortcut: [{
|
shortcut: [{
|
||||||
key: 'r',
|
key: 'r',
|
||||||
|
code: 'KeyR',
|
||||||
ctrlKey: false,
|
ctrlKey: false,
|
||||||
metaKey: false,
|
metaKey: false,
|
||||||
altKey: false,
|
altKey: false,
|
||||||
@ -229,7 +231,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'crop'
|
path: 'crop'
|
||||||
},
|
},
|
||||||
},{
|
}, {
|
||||||
name: 'Fit to width',
|
name: 'Fit to width',
|
||||||
label: 'Fit width',
|
label: 'Fit width',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -241,6 +243,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
shortcut: [{
|
shortcut: [{
|
||||||
key: 'w',
|
key: 'w',
|
||||||
|
code: 'KeyW',
|
||||||
ctrlKey: false,
|
ctrlKey: false,
|
||||||
metaKey: false,
|
metaKey: false,
|
||||||
altKey: false,
|
altKey: false,
|
||||||
@ -254,7 +257,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'crop'
|
path: 'crop'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Fit to height',
|
name: 'Fit to height',
|
||||||
label: 'Fit height',
|
label: 'Fit height',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -266,6 +269,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
shortcut: [{
|
shortcut: [{
|
||||||
key: 'e',
|
key: 'e',
|
||||||
|
code: 'KeyE',
|
||||||
ctrlKey: false,
|
ctrlKey: false,
|
||||||
metaKey: false,
|
metaKey: false,
|
||||||
altKey: false,
|
altKey: false,
|
||||||
@ -279,7 +283,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'crop'
|
path: 'crop'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Set aspect ratio to 16:9',
|
name: 'Set aspect ratio to 16:9',
|
||||||
label: '16:9',
|
label: '16:9',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -292,6 +296,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
shortcut: [{
|
shortcut: [{
|
||||||
key: 's',
|
key: 's',
|
||||||
|
code: 'KeyS',
|
||||||
ctrlKey: false,
|
ctrlKey: false,
|
||||||
metaKey: false,
|
metaKey: false,
|
||||||
altKey: false,
|
altKey: false,
|
||||||
@ -305,7 +310,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'crop'
|
path: 'crop'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Set aspect ratio to 21:9 (2.39:1)',
|
name: 'Set aspect ratio to 21:9 (2.39:1)',
|
||||||
label: '21:9',
|
label: '21:9',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -318,6 +323,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
shortcut: [{
|
shortcut: [{
|
||||||
key: 'd',
|
key: 'd',
|
||||||
|
code: 'KeyD',
|
||||||
ctrlKey: false,
|
ctrlKey: false,
|
||||||
metaKey: false,
|
metaKey: false,
|
||||||
altKey: false,
|
altKey: false,
|
||||||
@ -331,7 +337,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'crop'
|
path: 'crop'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Set aspect ratio to 18:9',
|
name: 'Set aspect ratio to 18:9',
|
||||||
label: '18:9',
|
label: '18:9',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -344,6 +350,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
shortcut: [{
|
shortcut: [{
|
||||||
key: 'x',
|
key: 'x',
|
||||||
|
code: 'KeyX',
|
||||||
ctrlKey: false,
|
ctrlKey: false,
|
||||||
metaKey: false,
|
metaKey: false,
|
||||||
altKey: false,
|
altKey: false,
|
||||||
@ -357,7 +364,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'crop',
|
path: 'crop',
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Zoom in',
|
name: 'Zoom in',
|
||||||
label: 'Zoom',
|
label: 'Zoom',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -369,6 +376,7 @@ var ExtensionConf = {
|
|||||||
show: false,
|
show: false,
|
||||||
shortcut: [{
|
shortcut: [{
|
||||||
key: 'z',
|
key: 'z',
|
||||||
|
code: 'KeyY',
|
||||||
ctrlKey: false,
|
ctrlKey: false,
|
||||||
metaKey: false,
|
metaKey: false,
|
||||||
altKey: false,
|
altKey: false,
|
||||||
@ -381,7 +389,7 @@ var ExtensionConf = {
|
|||||||
playerUi: {
|
playerUi: {
|
||||||
show: false,
|
show: false,
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Zoom out',
|
name: 'Zoom out',
|
||||||
label: 'Unzoom',
|
label: 'Unzoom',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -393,6 +401,7 @@ var ExtensionConf = {
|
|||||||
show: false,
|
show: false,
|
||||||
shortcut: [{
|
shortcut: [{
|
||||||
key: 'u',
|
key: 'u',
|
||||||
|
code: 'KeyU',
|
||||||
ctrlKey: false,
|
ctrlKey: false,
|
||||||
metaKey: false,
|
metaKey: false,
|
||||||
altKey: false,
|
altKey: false,
|
||||||
@ -405,32 +414,18 @@ var ExtensionConf = {
|
|||||||
playerUi: {
|
playerUi: {
|
||||||
show: false
|
show: false
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Toggle panning mode',
|
name: 'Toggle panning mode',
|
||||||
label: 'Toggle pan',
|
label: 'Toggle pan',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
action: 'toggle-pan',
|
action: 'toggle-pan',
|
||||||
arg: 'toggle'
|
arg: 'toggle'
|
||||||
}],
|
}],
|
||||||
scopes: {
|
|
||||||
page: {
|
|
||||||
show: true,
|
|
||||||
shortcut: [{
|
|
||||||
key: 'p',
|
|
||||||
ctrlKey: false,
|
|
||||||
metaKey: false,
|
|
||||||
altKey: false,
|
|
||||||
shiftKey: false,
|
|
||||||
onKeyUp: true,
|
|
||||||
onKeyDown: false,
|
|
||||||
}]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
playerUi: {
|
playerUi: {
|
||||||
show: true,
|
show: true,
|
||||||
path: 'zoom'
|
path: 'zoom'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Hold to pan',
|
name: 'Hold to pan',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
action: 'pan',
|
action: 'pan',
|
||||||
@ -479,7 +474,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'stretch'
|
path: 'stretch'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Set stretch to "basic"',
|
name: 'Set stretch to "basic"',
|
||||||
label: 'Basic stretch',
|
label: 'Basic stretch',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -504,7 +499,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'stretch'
|
path: 'stretch'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Set stretch to "hybrid"',
|
name: 'Set stretch to "hybrid"',
|
||||||
label: 'Hybrid stretch',
|
label: 'Hybrid stretch',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -529,7 +524,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'stretch'
|
path: 'stretch'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Stretch only to hide thin borders',
|
name: 'Stretch only to hide thin borders',
|
||||||
label: 'Thin borders only',
|
label: 'Thin borders only',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -554,7 +549,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'stretch'
|
path: 'stretch'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Set stretch to default value',
|
name: 'Set stretch to default value',
|
||||||
label: 'Default',
|
label: 'Default',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -592,7 +587,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'align'
|
path: 'align'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Align video to center',
|
name: 'Align video to center',
|
||||||
label: 'Center',
|
label: 'Center',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -614,7 +609,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'align'
|
path: 'align'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Align video to the right',
|
name: 'Align video to the right',
|
||||||
label: 'Right',
|
label: 'Right',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -636,7 +631,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
path: 'align'
|
path: 'align'
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Use default alignment',
|
name: 'Use default alignment',
|
||||||
label: 'Default',
|
label: 'Default',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -669,7 +664,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Enable extension on whitelisted sites only',
|
name: 'Enable extension on whitelisted sites only',
|
||||||
label: 'On whitelist only',
|
label: 'On whitelist only',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -682,7 +677,7 @@ var ExtensionConf = {
|
|||||||
show: true
|
show: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Extension mode: use default settings',
|
name: 'Extension mode: use default settings',
|
||||||
label: 'Default',
|
label: 'Default',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -695,7 +690,7 @@ var ExtensionConf = {
|
|||||||
show: true
|
show: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Disable extension',
|
name: 'Disable extension',
|
||||||
label: 'Disable',
|
label: 'Disable',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -711,7 +706,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Enable automatic aspect ratio detection',
|
name: 'Enable automatic aspect ratio detection',
|
||||||
label: 'Enable',
|
label: 'Enable',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -727,7 +722,7 @@ var ExtensionConf = {
|
|||||||
show: true
|
show: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Enable automatic aspect ratio detection on whitelisted sites only',
|
name: 'Enable automatic aspect ratio detection on whitelisted sites only',
|
||||||
label: 'On whitelist only',
|
label: 'On whitelist only',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -740,7 +735,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Use default settings for automatic aspect ratio detection',
|
name: 'Use default settings for automatic aspect ratio detection',
|
||||||
label: 'Default',
|
label: 'Default',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -753,7 +748,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Disable automatic aspect ratio detection',
|
name: 'Disable automatic aspect ratio detection',
|
||||||
label: 'Disable',
|
label: 'Disable',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -792,7 +787,7 @@ var ExtensionConf = {
|
|||||||
show: true,
|
show: true,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Enable keyboard shortcuts on whitelisted sites only',
|
name: 'Enable keyboard shortcuts on whitelisted sites only',
|
||||||
label: 'On whitelist only',
|
label: 'On whitelist only',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -804,7 +799,7 @@ var ExtensionConf = {
|
|||||||
show: true
|
show: true
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Keyboard shortcuts mode: use default settings',
|
name: 'Keyboard shortcuts mode: use default settings',
|
||||||
label: 'Default',
|
label: 'Default',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
@ -816,7 +811,7 @@ var ExtensionConf = {
|
|||||||
show: true
|
show: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},{
|
}, {
|
||||||
name: 'Disable keyboard shortcuts',
|
name: 'Disable keyboard shortcuts',
|
||||||
label: 'Disable',
|
label: 'Disable',
|
||||||
cmd: [{
|
cmd: [{
|
||||||
|
@ -192,8 +192,8 @@ class ActionHandler {
|
|||||||
shortcut.altKey === event.altKey &&
|
shortcut.altKey === event.altKey &&
|
||||||
shortcut.shiftKey === event.shiftKey
|
shortcut.shiftKey === event.shiftKey
|
||||||
}
|
}
|
||||||
isActionMatchKeycode(shortcut, event) {
|
isActionMatchKeyCode(shortcut, event) {
|
||||||
return shortcut.keyCode === event.key &&
|
return shortcut.code === event.code &&
|
||||||
shortcut.ctrlKey === event.ctrlKey &&
|
shortcut.ctrlKey === event.ctrlKey &&
|
||||||
shortcut.metaKey === event.metaKey &&
|
shortcut.metaKey === event.metaKey &&
|
||||||
shortcut.altKey === event.altKey &&
|
shortcut.altKey === event.altKey &&
|
||||||
@ -201,11 +201,11 @@ class ActionHandler {
|
|||||||
}
|
}
|
||||||
|
|
||||||
isActionMatch(shortcut, event, isLatin = true) {
|
isActionMatch(shortcut, event, isLatin = true) {
|
||||||
// ASCII and symbols fall back to keycode matching, because we don't know for sure that
|
// ASCII and symbols fall back to key code matching, because we don't know for sure that
|
||||||
// regular matching by key is going to work
|
// regular matching by key is going to work
|
||||||
return isLatin ?
|
return isLatin ?
|
||||||
this.isActionMatchStandard(shortcut, event) :
|
this.isActionMatchStandard(shortcut, event) :
|
||||||
this.isActionMatchStandard(shortcut, event) || this.isActionMatchKeycode(shortcut, event);
|
this.isActionMatchStandard(shortcut, event) || this.isActionMatchKeyCode(shortcut, event);
|
||||||
}
|
}
|
||||||
|
|
||||||
execAction(actions, event, videoData) {
|
execAction(actions, event, videoData) {
|
||||||
|
@ -109,6 +109,8 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import ControlsSettings from './controls-settings/ControlsSettings';
|
||||||
|
import GeneralSettings from './GeneralSettings';
|
||||||
import Donate from '../common/misc/Donate.vue';
|
import Donate from '../common/misc/Donate.vue';
|
||||||
import SuperAdvancedSettings from './SuperAdvancedSettings.vue';
|
import SuperAdvancedSettings from './SuperAdvancedSettings.vue';
|
||||||
import Debug from '../ext/conf/Debug.js';
|
import Debug from '../ext/conf/Debug.js';
|
||||||
|
@ -39,12 +39,11 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import SetShortcutButton from './SetShortcutButton.vue';
|
import SetShortcutButton from './SetShortcutButton';
|
||||||
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
SetShortcutButton
|
SetShortcutButton,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
scopeOptions: Object,
|
scopeOptions: Object,
|
||||||
|
@ -38,7 +38,7 @@ export default {
|
|||||||
if (this.waitingForPress) {
|
if (this.waitingForPress) {
|
||||||
const shortcut = {
|
const shortcut = {
|
||||||
key: event.key,
|
key: event.key,
|
||||||
keyCode: event.keyCode,
|
code: event.code,
|
||||||
ctrlKey: event.ctrlKey,
|
ctrlKey: event.ctrlKey,
|
||||||
metaKey: event.metaKey,
|
metaKey: event.metaKey,
|
||||||
altKey: event.altKey,
|
altKey: event.altKey,
|
||||||
|
Loading…
Reference in New Issue
Block a user