Revamp key/code input processing which fixes Option key on Mac and other locales

Closes #742
Closes #746
This commit is contained in:
Keavon Chambers
2022-08-11 02:53:46 -07:00
parent 765b648704
commit cf6bbcfd30
32 changed files with 1143 additions and 548 deletions

View File

@@ -5,7 +5,7 @@
<Separator :type="'Section'" v-if="index !== 0" />
<template v-for="hint in hintGroup" :key="hint">
<LayoutRow v-if="hint.plus" class="plus">+</LayoutRow>
<UserInputLabel :inputMouse="hint.mouse" :inputKeys="inputKeysForPlatform(hint)">{{ hint.label }}</UserInputLabel>
<UserInputLabel :mouseMotion="hint.mouse" :keysWithLabelsGroups="inputKeysForPlatform(hint)">{{ hint.label }}</UserInputLabel>
</template>
</template>
</LayoutRow>
@@ -48,7 +48,7 @@
<script lang="ts">
import { defineComponent } from "vue";
import { operatingSystemIsMac } from "@/utility-functions/platform";
import { platformIsMac } from "@/utility-functions/platform";
import { HintData, HintInfo, KeysGroup, UpdateInputHints } from "@/wasm-communication/messages";
import LayoutRow from "@/components/layout/LayoutRow.vue";
@@ -64,7 +64,7 @@ export default defineComponent({
},
methods: {
inputKeysForPlatform(hint: HintInfo): KeysGroup[] {
if (operatingSystemIsMac() && hint.keyGroupsMac) return hint.keyGroupsMac;
if (platformIsMac() && hint.keyGroupsMac) return hint.keyGroupsMac;
return hint.keyGroups;
},
},

View File

@@ -34,7 +34,7 @@
<TextButton :label="'New Document:'" :icon="'File'" :action="() => newDocument()" />
</td>
<td>
<UserInputLabel :inputKeys="[[...platformModifiers(true), 'KeyN']]" />
<UserInputLabel :keysWithLabelsGroups="[[...platformModifiers(true), { key: 'KeyN', label: 'N' }]]" />
</td>
</tr>
<tr>
@@ -42,7 +42,7 @@
<TextButton :label="'Open Document:'" :icon="'Folder'" :action="() => openDocument()" />
</td>
<td>
<UserInputLabel :inputKeys="[[...platformModifiers(false), 'KeyO']]" />
<UserInputLabel :keysWithLabelsGroups="[[...platformModifiers(false), { key: 'KeyO', label: 'O' }]]" />
</td>
</tr>
</table>
@@ -211,7 +211,9 @@
<script lang="ts">
import { defineComponent, PropType } from "vue";
import { operatingSystemIsMac } from "@/utility-functions/platform";
import { platformIsMac } from "@/utility-functions/platform";
import { KeysGroup, Key } from "@/wasm-communication/messages";
import LayoutCol from "@/components/layout/LayoutCol.vue";
import LayoutRow from "@/components/layout/LayoutRow.vue";
@@ -255,14 +257,15 @@ export default defineComponent({
openDocument() {
this.editor.instance.document_open();
},
platformModifiers(reservedKey: boolean) {
platformModifiers(reservedKey: boolean): KeysGroup {
// TODO: Remove this by properly feeding these keys from a layout provided by the backend
if (operatingSystemIsMac()) {
return reservedKey ? ["KeyControl", "KeyCommand"] : ["KeyCommand"]; // TODO: Change Mac from Control+Command to Alt+Command when we can read Alt+letter modifiers
}
const ALT: Key = { key: "Alt", label: "Alt" };
const COMMAND: Key = { key: "Command", label: "Command" };
const CONTROL: Key = { key: "Control", label: "Control" };
return reservedKey ? ["KeyControl", "KeyAlt"] : ["KeyControl"];
if (platformIsMac()) return reservedKey ? [ALT, COMMAND] : [COMMAND];
return reservedKey ? [CONTROL, ALT] : [CONTROL];
},
},
components: {