diff --git a/src/lib/assets/layouts/m4g.yml b/src/lib/assets/layouts/m4g.yml index d2fe782c..066cc933 100644 --- a/src/lib/assets/layouts/m4g.yml +++ b/src/lib/assets/layouts/m4g.yml @@ -3,35 +3,22 @@ col: # Ring / Middle - offset: [2, 0] row: - - switch: { d: 25, e: 26, n: 27, w: 28, s: 29 } - - switch: { d: 20, e: 21, n: 22, w: 23, s: 24 } - - offset: [4, 0] - switch: { d: 65, w: 66, n: 67, e: 68, s: 69 } - - switch: { d: 70, w: 71, n: 72, e: 73, s: 74 } + - switch: { e: 26, n: 27, w: 28, s: 29 } + - switch: { e: 21, n: 22, w: 23, s: 24 } - offset: [2, 0] row: - - switch: { d: 40, e: 41, n: 42, w: 43, s: 44 } - - switch: { d: 35, e: 36, n: 37, w: 38, s: 39 } - - offset: [4, 0] - switch: { d: 80, w: 81, n: 82, e: 83, s: 84 } - - switch: { d: 85, w: 86, n: 87, e: 88, s: 89 } + - switch: { e: 41, n: 42, w: 43, s: 44 } + - switch: { e: 36, n: 37, w: 38, s: 39 } # Pinkie / Index - offset: [0, -3] row: - - switch: { d: 30, e: 31, n: 32, w: 33, s: 34 } + - switch: { e: 31, n: 32, w: 33, s: 34 } - offset: [4, 0] - switch: { d: 15, e: 16, n: 17, w: 18, s: 19 } - - switch: { d: 60, w: 61, n: 62, e: 63, s: 64 } - - offset: [4, 0] - switch: { d: 75, w: 76, n: 77, e: 78, s: 79 } + switch: { e: 16, n: 17, w: 18, s: 19 } # Thumbs - row: - offset: [5.5, 0.5] - switch: { d: 10, e: 11, n: 12, w: 13, s: 14 } - - offset: [1, 0.5] - switch: { d: 55, w: 56, n: 57, e: 58, s: 59 } + switch: { e: 11, n: 12, w: 13, s: 14 } - row: - offset: [4.5, -0.25] - switch: { d: 5, e: 6, n: 7, w: 8, s: 9 } - - offset: [3, -0.25] - switch: { d: 50, w: 51, n: 52, e: 53, s: 54 } + switch: { e: 6, n: 7, w: 8, s: 9 } diff --git a/src/lib/assets/layouts/m4g_right_hand.yml b/src/lib/assets/layouts/m4g_right_hand.yml new file mode 100644 index 00000000..26a85e19 --- /dev/null +++ b/src/lib/assets/layouts/m4g_right_hand.yml @@ -0,0 +1,24 @@ +name: M4G +col: + # Ring / Middle + - offset: [2, 0] + row: + - switch: { e: 21, n: 22, w: 23, s: 24 } + - switch: { e: 26, n: 27, w: 28, s: 29 } + - offset: [2, 0] + row: + - switch: { e: 36, n: 37, w: 38, s: 39 } + - switch: { e: 41, n: 42, w: 43, s: 44 } + # Pinkie / Index + - offset: [0, -3] + row: + - switch: { e: 16, n: 17, w: 18, s: 19 } + - offset: [4, 0] + switch: { e: 31, n: 32, w: 33, s: 34 } + # Thumbs + - row: + - offset: [0.5, 0.5] + switch: { e: 11, n: 12, w: 13, s: 14 } + - row: + - offset: [1.5, -0.25] + switch: { e: 6, n: 7, w: 8, s: 9 } diff --git a/src/lib/components/layout/Layout.svelte b/src/lib/components/layout/Layout.svelte index bf12f4c6..cdcc335a 100644 --- a/src/lib/components/layout/Layout.svelte +++ b/src/lib/components/layout/Layout.svelte @@ -37,6 +37,10 @@ import("$lib/assets/layouts/m4g.yml").then( (it) => it.default as VisualLayout, ), + M4G_RIGHT_HAND: () => + import("$lib/assets/layouts/m4g_right_hand.yml").then( + (it) => it.default as VisualLayout, + ), }; @@ -70,6 +74,7 @@ width: 100%; height: 100%; + max-height: 20cm; } fieldset { diff --git a/src/lib/serial/device.ts b/src/lib/serial/device.ts index 4f2fd147..adb875f0 100644 --- a/src/lib/serial/device.ts +++ b/src/lib/serial/device.ts @@ -25,7 +25,8 @@ const KEY_COUNTS = { TWO: 90, LITE: 67, X: 256, - M4G: 90, + M4G: 64, + M4G_RIGHT_HAND: 64, } as const; if ( diff --git a/src/routes/(app)/config/settings/confirm-challenge.ts b/src/routes/(app)/config/settings/confirm-challenge.ts index 6f7ab9de..0555d5fc 100644 --- a/src/routes/(app)/config/settings/confirm-challenge.ts +++ b/src/routes/(app)/config/settings/confirm-challenge.ts @@ -1,12 +1,13 @@ import type { Action } from "svelte/action"; import ConfirmChallenge from "./ConfirmChallenge.svelte"; import tippy from "tippy.js"; +import { mount, unmount } from "svelte"; export const confirmChallenge: Action< HTMLElement, { onConfirm: () => void; challenge: string } > = (node, { onConfirm, challenge }) => { - let component: ConfirmChallenge | undefined; + let component: {} | undefined; let target: HTMLElement | undefined; const edit = tippy(node, { interactive: true, @@ -15,15 +16,22 @@ export const confirmChallenge: Action< target = instance.popper.querySelector(".tippy-content") as HTMLElement; target.classList.add("active"); if (component === undefined) { - component = new ConfirmChallenge({ target, props: { challenge } }); - component.$on("confirm", () => { - edit.hide(); - onConfirm(); + component = mount(ConfirmChallenge, { + target, + props: { + challenge, + onconfirm() { + edit.hide(); + onConfirm(); + }, + }, }); } }, onHidden() { - component?.$destroy(); + if (component) { + unmount(component); + } target?.classList.remove("active"); component = undefined; },