Merge pull request #121 from Hufe921/feature/macos

Feature/macos

src/editor/core/event/handlers/keydown.ts

@@ -2,6 +2,7 @@ import { ZERO } from '../../../dataset/constant/Common'
 import { ElementType } from '../../../dataset/enum/Element'
 import { KeyMap } from '../../../dataset/enum/KeyMap'
 import { IElement, IElementPosition } from '../../../interface/Element'
+import { isMod } from '../../../utils/hotkey'
 import { CanvasEvent } from '../CanvasEvent'
 
 export function keydown(evt: KeyboardEvent, host: CanvasEvent) {
@@ -230,24 +231,24 @@ export function keydown(evt: KeyboardEvent, host: CanvasEvent) {
         isComputeRowList: false
       })
     }
-  } else if (evt.ctrlKey && evt.key === KeyMap.Z) {
+  } else if (isMod(evt) && evt.key === KeyMap.Z) {
     if (isReadonly) return
     historyManager.undo()
     evt.preventDefault()
-  } else if (evt.ctrlKey && evt.key === KeyMap.Y) {
+  } else if (isMod(evt) && evt.key === KeyMap.Y) {
     if (isReadonly) return
     historyManager.redo()
     evt.preventDefault()
-  } else if (evt.ctrlKey && evt.key === KeyMap.C) {
+  } else if (isMod(evt) && evt.key === KeyMap.C) {
     host.copy()
     evt.preventDefault()
-  } else if (evt.ctrlKey && evt.key === KeyMap.X) {
+  } else if (isMod(evt) && evt.key === KeyMap.X) {
     host.cut()
     evt.preventDefault()
-  } else if (evt.ctrlKey && evt.key === KeyMap.A) {
+  } else if (isMod(evt) && evt.key === KeyMap.A) {
     host.selectAll()
     evt.preventDefault()
-  } else if (evt.ctrlKey && evt.key === KeyMap.S) {
+  } else if (isMod(evt) && evt.key === KeyMap.S) {
     if (isReadonly) return
     const listener = draw.getListener()
     if (listener.saved) {

src/editor/core/shortcut/Shortcut.ts

@@ -2,6 +2,7 @@ import { IRegisterShortcut } from '../../interface/shortcut/Shortcut'
 import { richtextKeys } from './keys/richtextKeys'
 import { Command } from '../command/Command'
 import { Draw } from '../draw/Draw'
+import { isMod } from '../../utils/hotkey'
 
 export class Shortcut {
 
@@ -61,7 +62,11 @@ export class Shortcut {
     for (let s = 0; s < shortCutList.length; s++) {
       const shortCut = shortCutList[s]
       if (
-        evt.ctrlKey === !!shortCut.ctrl &&
+        (
+          shortCut.mod
+            ? isMod(evt) === !!shortCut.mod
+            : evt.ctrlKey === !!shortCut.ctrl && evt.metaKey === !!shortCut.meta
+        ) &&
         evt.shiftKey === !!shortCut.shift &&
         evt.altKey === !!shortCut.alt &&
         evt.key === shortCut.key

src/editor/core/shortcut/keys/richtextKeys.ts

@@ -1,6 +1,7 @@
 import { Command } from '../../..'
 import { KeyMap } from '../../../dataset/enum/KeyMap'
 import { IRegisterShortcut } from '../../../interface/shortcut/Shortcut'
+import { isApple } from '../../../utils/ua'
 
 export const richtextKeys: IRegisterShortcut[] = [
   {
@@ -13,50 +14,50 @@ export const richtextKeys: IRegisterShortcut[] = [
   },
   {
     key: KeyMap.LEFT_BRACKET,
-    ctrl: true,
+    mod: true,
     callback: (command: Command) => {
       command.executeSizeAdd()
     }
   },
   {
     key: KeyMap.RIGHT_BRACKET,
-    ctrl: true,
+    mod: true,
     callback: (command: Command) => {
       command.executeSizeMinus()
     }
   },
   {
     key: KeyMap.B,
-    ctrl: true,
+    mod: true,
     callback: (command: Command) => {
       command.executeBold()
     }
   },
   {
     key: KeyMap.I,
-    ctrl: true,
+    mod: true,
     callback: (command: Command) => {
       command.executeItalic()
     }
   },
   {
     key: KeyMap.U,
-    ctrl: true,
+    mod: true,
     callback: (command: Command) => {
       command.executeUnderline()
     }
   },
   {
-    key: KeyMap.RIGHT_ANGLE_BRACKET,
-    ctrl: true,
+    key: isApple ? KeyMap.COMMA : KeyMap.RIGHT_ANGLE_BRACKET,
+    mod: true,
     shift: true,
     callback: (command: Command) => {
       command.executeSuperscript()
     }
   },
   {
-    key: KeyMap.LEFT_ANGLE_BRACKET,
-    ctrl: true,
+    key: isApple ? KeyMap.PERIOD : KeyMap.LEFT_ANGLE_BRACKET,
+    mod: true,
     shift: true,
     callback: (command: Command) => {
       command.executeSubscript()
@@ -64,28 +65,28 @@ export const richtextKeys: IRegisterShortcut[] = [
   },
   {
     key: KeyMap.L,
-    ctrl: true,
+    mod: true,
     callback: (command: Command) => {
       command.executeLeft()
     }
   },
   {
     key: KeyMap.E,
-    ctrl: true,
+    mod: true,
     callback: (command: Command) => {
       command.executeCenter()
     }
   },
   {
     key: KeyMap.R,
-    ctrl: true,
+    mod: true,
     callback: (command: Command) => {
       command.executeRight()
     }
   },
   {
     key: KeyMap.J,
-    ctrl: true,
+    mod: true,
     callback: (command: Command) => {
       command.executeAlignment()
     }

src/editor/dataset/enum/KeyMap.ts

@@ -8,6 +8,7 @@ export enum KeyMap {
   Down = 'ArrowDown',
   ESC = 'Escape',
   TAB = 'Tab',
+  META = 'Meta',
   LEFT_BRACKET = '[',
   RIGHT_BRACKET = ']',
   COMMA = ',',

src/editor/interface/shortcut/Shortcut.ts

@@ -4,8 +4,10 @@ import { KeyMap } from '../../dataset/enum/KeyMap'
 export interface IRegisterShortcut {
   key: KeyMap;
   ctrl?: boolean;
+  meta?: boolean;
+  mod?: boolean; // windows:ctrl || mac:command
   shift?: boolean;
-  alt?: boolean;
+  alt?: boolean; // windows:alt || mac:option
   isGlobal?: boolean;
   callback: (command: Command) => any;
 }

src/editor/utils/hotkey.ts

@@ -0,0 +1,5 @@
+import { isApple } from './ua'
+
+export function isMod(evt: KeyboardEvent) {
+  return isApple ? evt.metaKey : evt.ctrlKey
+}

src/editor/utils/ua.ts

@@ -0,0 +1 @@
+export const isApple = typeof navigator !== 'undefined' && /Mac OS X/.test(navigator.userAgent)