fix comment

microsoft · Feb 29, 2024 · f69dd4a · f69dd4a
1 parent 16634a5
commit f69dd4a
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 16 deletions.
diff --git a/packages-content-model/roosterjs-content-model-plugins/lib/shortcut/ShortcutCommand.ts b/packages-content-model/roosterjs-content-model-plugins/lib/shortcut/ShortcutCommand.ts
@@ -17,9 +17,12 @@ export interface ShortcutKeyDefinition {
     shiftKey: boolean;
 
     /**
-     * Key for this shortcut. The value should be the value of KeyboardEvent.key string
+     * Key code for this shortcut. The value should be the value of KeyboardEvent.which
+     * We are still using key code here rather than key name (event.key)  although event.which is deprecated because of globalization.
+     * For example, on US keyboard, Shift+Comma="<" but on Spanish keyboard it is ":"
+     * And we still want the shortcut key to be registered on  the same key, in that case key name is different but key code keeps the same.
      */
-    key: string;
+    which: number;
 }
 
 /**

diff --git a/packages-content-model/roosterjs-content-model-plugins/lib/shortcut/ShortcutPlugin.ts b/packages-content-model/roosterjs-content-model-plugins/lib/shortcut/ShortcutPlugin.ts
@@ -139,12 +139,12 @@ export class ShortcutPlugin implements EditorPlugin {
     }
 
     private matchShortcut(shortcutKey: ShortcutKeyDefinition, event: KeyboardEvent) {
-        const { ctrlKey, altKey, shiftKey, key, metaKey } = event;
+        const { ctrlKey, altKey, shiftKey, which, metaKey } = event;
         const ctrlOrMeta = this.isMac ? metaKey : ctrlKey;
         const matchModifier =
             (shortcutKey.modifierKey == 'ctrl' && ctrlOrMeta && !altKey) ||
             (shortcutKey.modifierKey == 'alt' && altKey && !ctrlOrMeta);
 
-        return matchModifier && shiftKey == shortcutKey.shiftKey && shortcutKey.key == key;
+        return matchModifier && shiftKey == shortcutKey.shiftKey && shortcutKey.which == which;
     }
 }
diff --git a/packages-content-model/roosterjs-content-model-plugins/lib/shortcut/shortcuts.ts b/packages-content-model/roosterjs-content-model-plugins/lib/shortcut/shortcuts.ts
@@ -10,6 +10,19 @@ import {
 } from 'roosterjs-content-model-api';
 import type { ShortcutCommand } from './ShortcutCommand';
 
+const enum Keys {
+    BACKSPACE = 8,
+    SPACE = 32,
+    B = 66,
+    I = 73,
+    U = 85,
+    Y = 89,
+    Z = 90,
+    COMMA = 188,
+    PERIOD = 190,
+    FORWARD_SLASH = 191,
+}
+
 /**
  * Shortcut command for Bold
  * Windows: Ctrl + B
@@ -19,7 +32,7 @@ export const ShortcutBold: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: false,
-        key: 'b',
+        which: Keys.B,
     },
     onClick: editor => toggleBold(editor),
 };
@@ -33,7 +46,7 @@ export const ShortcutItalic: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: false,
-        key: 'i',
+        which: Keys.I,
     },
     onClick: editor => toggleItalic(editor),
 };
@@ -47,7 +60,7 @@ export const ShortcutUnderline: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: false,
-        key: 'u',
+        which: Keys.U,
     },
     onClick: editor => toggleUnderline(editor),
 };
@@ -61,7 +74,7 @@ export const ShortcutClearFormat: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: false,
-        key: ' ',
+        which: Keys.SPACE,
     },
     onClick: editor => clearFormat(editor),
 };
@@ -75,7 +88,7 @@ export const ShortcutUndo: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: false,
-        key: 'z',
+        which: Keys.Z,
     },
     onClick: editor => undo(editor),
 };
@@ -89,7 +102,7 @@ export const ShortcutUndo2: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'alt',
         shiftKey: false,
-        key: 'Backspace',
+        which: Keys.BACKSPACE,
     },
     onClick: editor => undo(editor),
     environment: 'nonMac',
@@ -104,7 +117,7 @@ export const ShortcutRedo: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: false,
-        key: 'y',
+        which: Keys.Y,
     },
     onClick: editor => redo(editor),
     environment: 'nonMac',
@@ -119,7 +132,7 @@ export const ShortcutRedoMacOS: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: true,
-        key: 'z',
+        which: Keys.Z,
     },
     onClick: editor => redo(editor),
     environment: 'mac',
@@ -134,7 +147,7 @@ export const ShortcutBullet: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: false,
-        key: '.',
+        which: Keys.PERIOD,
     },
     onClick: editor => toggleBullet(editor),
 };
@@ -148,7 +161,7 @@ export const ShortcutNumbering: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: false,
-        key: '/',
+        which: Keys.FORWARD_SLASH,
     },
     onClick: editor => toggleNumbering(editor),
 };
@@ -162,7 +175,7 @@ export const ShortcutIncreaseFont: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: true,
-        key: '>',
+        which: Keys.PERIOD,
     },
     onClick: editor => changeFontSize(editor, 'increase'),
 };
@@ -176,7 +189,7 @@ export const ShortcutDecreaseFont: ShortcutCommand = {
     shortcutKey: {
         modifierKey: 'ctrl',
         shiftKey: true,
-        key: '<',
+        which: Keys.COMMA,
     },
     onClick: editor => changeFontSize(editor, 'decrease'),
 };