1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-14 10:16:26 +00:00

revamp handling of multi-key presses

- use keyCodes instead of strings to detect keys
- delete key from keyPressed array on key up
- fix #540
This commit is contained in:
Leo Lam
2017-05-03 00:29:18 -04:00
parent 7269750264
commit b34d72f21a

View File

@@ -9,14 +9,16 @@ class MarkdownEditor extends React.Component {
constructor (props) { constructor (props) {
super(props) super(props)
this.escapeFromEditor = ['Control', 'w'] //char codes for ctrl + w
this.escapeFromEditor = [17, 87]
this.supportMdSelectionBold = ['Control', ':'] //ctrl + shift + ;
this.supportMdSelectionBold = [16, 17, 186]
this.state = { this.state = {
status: 'PREVIEW', status: 'PREVIEW',
renderValue: props.value, renderValue: props.value,
keyPressed: {}, keyPressed: new Set(),
isLocked: false isLocked: false
} }
@@ -87,7 +89,7 @@ class MarkdownEditor extends React.Component {
handleBlur (e) { handleBlur (e) {
if (this.state.isLocked) return if (this.state.isLocked) return
this.setState({ keyPressed: [] }) this.setState({ keyPressed: new Set()})
let { config } = this.props let { config } = this.props
if (config.editor.switchPreview === 'BLUR') { if (config.editor.switchPreview === 'BLUR') {
let cursorPosition = this.refs.code.editor.getCursor() let cursorPosition = this.refs.code.editor.getCursor()
@@ -161,11 +163,10 @@ class MarkdownEditor extends React.Component {
handleKeyDown (e) { handleKeyDown (e) {
if (this.state.status !== 'CODE') return false if (this.state.status !== 'CODE') return false
const keyPressed = Object.assign(this.state.keyPressed, { const keyPressed = this.state.keyPressed
[e.key]: true keyPressed.add(e.keyCode)
})
this.setState({ keyPressed }) this.setState({ keyPressed })
let isNoteHandlerKey = (el) => { return this.state.keyPressed[el] } let isNoteHandlerKey = (el) => { return keyPressed.has(el) }
if (!this.state.isLocked && this.state.status === 'CODE' && this.escapeFromEditor.every(isNoteHandlerKey)) { if (!this.state.isLocked && this.state.status === 'CODE' && this.escapeFromEditor.every(isNoteHandlerKey)) {
document.activeElement.blur() document.activeElement.blur()
} }
@@ -190,9 +191,8 @@ class MarkdownEditor extends React.Component {
} }
handleKeyUp (e) { handleKeyUp (e) {
const keyPressed = Object.assign(this.state.keyPressed, { const keyPressed = this.state.keyPressed
[e.key]: false keyPressed.delete(e.keyCode)
})
this.setState({ keyPressed }) this.setState({ keyPressed })
} }