From 262159cf7359242afbb5ed924e270009eb83e77f Mon Sep 17 00:00:00 2001 From: Caleb John Date: Thu, 2 Jul 2020 16:00:56 -0600 Subject: [PATCH] Desktop: Codemirror: Remove cancelled keys in favour of explicit keymaps (#3417) --- .../NoteBody/CodeMirror/CodeMirror.tsx | 12 --- .../NoteEditor/NoteBody/CodeMirror/Editor.tsx | 96 +++++++++++++------ 2 files changed, 67 insertions(+), 41 deletions(-) diff --git a/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/CodeMirror.tsx b/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/CodeMirror.tsx index 958791f4f..5dacf353c 100644 --- a/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/CodeMirror.tsx +++ b/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/CodeMirror.tsx @@ -52,17 +52,6 @@ function CodeMirror(props: NoteBodyEditorProps, ref: any) { const { resetScroll, editor_scroll, setEditorPercentScroll, setViewerPercentScroll } = useScrollHandler(editorRef, webviewRef, props.onScroll); - const cancelledKeys: {mac: string[], default: string[]} = { mac: [], default: [] }; - // Remove Joplin reserved key bindings from the editor - const letters = ['F', 'T', 'P', 'Q', 'L', ',', 'G', 'K']; - for (let i = 0; i < letters.length; i++) { - const l = letters[i]; - cancelledKeys.default.push(`Ctrl-${l}`); - cancelledKeys.mac.push(`Cmd-${l}`); - } - cancelledKeys.default.push('Alt-E'); - cancelledKeys.mac.push('Alt-E'); - const codeMirror_change = useCallback((newBody: string) => { props_onChangeRef.current({ changeId: null, content: newBody }); }, []); @@ -397,7 +386,6 @@ function CodeMirror(props: NoteBodyEditorProps, ref: any) { readOnly={props.visiblePanes.indexOf('editor') < 0} autoMatchBraces={Setting.value('editor.autoMatchingBraces')} keyMap={props.keyboardMode} - cancelledKeys={cancelledKeys} onChange={codeMirror_change} onScroll={editor_scroll} onEditorContextMenu={onEditorContextMenu} diff --git a/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/Editor.tsx b/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/Editor.tsx index ff3c2b0b6..822c0c23e 100644 --- a/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/Editor.tsx +++ b/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/Editor.tsx @@ -28,11 +28,6 @@ import 'codemirror/mode/clike/clike'; import 'codemirror/mode/diff/diff'; import 'codemirror/mode/sql/sql'; -export interface CancelledKeys { - mac: string[], - default: string[], -} - export interface EditorProps { value: string, mode: string, @@ -41,7 +36,6 @@ export interface EditorProps { readOnly: boolean, autoMatchBraces: boolean, keyMap: string, - cancelledKeys: CancelledKeys, onChange: any, onScroll: any, onEditorContextMenu: any, @@ -59,18 +53,73 @@ function Editor(props: EditorProps, ref: any) { useCursorUtils(CodeMirror); useLineSorting(CodeMirror); - useEffect(() => { - if (props.cancelledKeys) { - for (let i = 0; i < props.cancelledKeys.mac.length; i++) { - const k = props.cancelledKeys.mac[i]; - CodeMirror.keyMap.macDefault[k] = null; - } - for (let i = 0; i < props.cancelledKeys.default.length; i++) { - const k = props.cancelledKeys.default[i]; - CodeMirror.keyMap.default[k] = null; - } - } - }, [props.cancelledKeys]); + CodeMirror.keyMap.basic = { + 'Left': 'goCharLeft', + 'Right': 'goCharRight', + 'Up': 'goLineUp', + 'Down': 'goLineDown', + 'End': 'goLineEnd', + 'Home': 'goLineStartSmart', + 'PageUp': 'goPageUp', + 'PageDown': 'goPageDown', + 'Delete': 'delCharAfter', + 'Backspace': 'delCharBefore', + 'Shift-Backspace': 'delCharBefore', + 'Tab': 'smartListIndent', + 'Shift-Tab': 'smartListUnindent', + 'Enter': 'insertListElement', + 'Insert': 'toggleOverwrite', + 'Esc': 'singleSelection', + }; + CodeMirror.keyMap.default = { + 'Ctrl-A': 'selectAll', + 'Ctrl-D': 'deleteLine', + 'Ctrl-Z': 'undo', + 'Shift-Ctrl-Z': 'redo', + 'Ctrl-Y': 'redo', + 'Ctrl-Home': 'goDocStart', + 'Ctrl-End': 'goDocEnd', + 'Ctrl-Up': 'goLineUp', + 'Ctrl-Down': 'goLineDown', + 'Ctrl-Left': 'goGroupLeft', + 'Ctrl-Right': 'goGroupRight', + 'Alt-Left': 'goLineStart', + 'Alt-Right': 'goLineEnd', + 'Ctrl-Backspace': 'delGroupBefore', + 'Ctrl-Delete': 'delGroupAfter', + 'Ctrl-[': 'indentLess', + 'Ctrl-]': 'indentMore', + 'Ctrl-/': 'toggleComment', + 'Ctrl-Alt-S': 'sortSelectedLines', + 'Alt-Up': 'swapLineUp', + 'Alt-Down': 'swapLineDown', + 'fallthrough': 'basic', + }; + CodeMirror.keyMap.pcDefault = CodeMirror.keyMap.default; + CodeMirror.keyMap.macDefault = { + 'Cmd-A': 'selectAll', + 'Cmd-D': 'deleteLine', + 'Cmd-Z': 'undo', + 'Shift-Cmd-Z': 'redo', + 'Cmd-Y': 'redo', + 'Cmd-Home': 'goDocStart', + 'Cmd-Up': 'goDocStart', + 'Cmd-End': 'goDocEnd', + 'Cmd-Down': 'goDocEnd', + 'Alt-Left': 'goGroupLeft', + 'Alt-Right': 'goGroupRight', + 'Cmd-Left': 'goLineLeft', + 'Cmd-Right': 'goLineRight', + 'Alt-Backspace': 'delGroupBefore', + 'Alt-Delete': 'delGroupAfter', + 'Cmd-[': 'indentLess', + 'Cmd-]': 'indentMore', + 'Cmd-/': 'toggleComment', + 'Cmd-Opt-S': 'sortSelectedLines', + 'Opt-Up': 'swapLineUp', + 'Opt-Down': 'swapLineDown', + 'fallthrough': 'basic', + }; useImperativeHandle(ref, () => { return editor; @@ -133,17 +182,6 @@ function Editor(props: EditorProps, ref: any) { spellcheck: true, allowDropFileTypes: [''], // disable codemirror drop handling keyMap: props.keyMap ? props.keyMap : 'default', - extraKeys: { 'Enter': 'insertListElement', - 'Ctrl-/': 'toggleComment', - 'Ctrl-Alt-S': 'sortSelectedLines', - 'Alt-Up': 'swapLineUp', - 'Alt-Down': 'swapLineDown', - 'Cmd-/': 'toggleComment', - 'Cmd-Opt-S': 'sortSelectedLines', - 'Opt-Up': 'swapLineUp', - 'Opt-Down': 'swapLineDown', - 'Tab': 'smartListIndent', - 'Shift-Tab': 'smartListUnindent' }, }; const cm = CodeMirror(editorParent.current, cmOptions); setEditor(cm);