1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-16 03:06:27 +00:00

Merge pull request #298 from asmsuechan/fix-drop-an-image-on-CodeEditor-and-MarkdownPreview

Disable dragging an image to MarkdownPreview and fix the behavior of an image dropped on CodeEditor.
This commit is contained in:
SuenagaRyota
2017-03-08 15:38:27 +09:00
committed by GitHub
2 changed files with 14 additions and 5 deletions

View File

@@ -166,15 +166,15 @@ export default class CodeEditor extends React.Component {
handleDropImage (e) { handleDropImage (e) {
e.preventDefault() e.preventDefault()
let imagePath = e.dataTransfer.files[0].path const imagePath = e.dataTransfer.files[0].path
let filename = path.basename(imagePath) const filename = path.basename(imagePath)
let imageMd = `![${encodeURI(filename)}](${encodeURI(imagePath)})` const imageMd = `![${encodeURI(filename)}](${encodeURI(imagePath)})`
this.insertImage(imageMd) this.insertImage(imageMd)
} }
insertImage (imageMd) { insertImage (imageMd) {
const cm = this.editor const textarea = this.editor.getInputField()
cm.setValue(cm.getValue() + imageMd) textarea.value = textarea.value.substr(0, textarea.selectionStart) + imageMd + textarea.value.substr(textarea.selectionEnd)
} }
render () { render () {

View File

@@ -181,6 +181,8 @@ export default class MarkdownPreview extends React.Component {
this.refs.root.contentWindow.document.addEventListener('mousedown', this.mouseDownHandler) this.refs.root.contentWindow.document.addEventListener('mousedown', this.mouseDownHandler)
this.refs.root.contentWindow.document.addEventListener('mouseup', this.mouseUpHandler) this.refs.root.contentWindow.document.addEventListener('mouseup', this.mouseUpHandler)
this.refs.root.contentWindow.document.addEventListener('drop', this.preventImageDroppedHandler)
this.refs.root.contentWindow.document.addEventListener('dragover', this.preventImageDroppedHandler)
eventEmitter.on('export:save-text', this.saveAsTextHandler) eventEmitter.on('export:save-text', this.saveAsTextHandler)
eventEmitter.on('export:save-md', this.saveAsMdHandler) eventEmitter.on('export:save-md', this.saveAsMdHandler)
} }
@@ -189,6 +191,8 @@ export default class MarkdownPreview extends React.Component {
this.refs.root.contentWindow.document.body.removeEventListener('contextmenu', this.contextMenuHandler) this.refs.root.contentWindow.document.body.removeEventListener('contextmenu', this.contextMenuHandler)
this.refs.root.contentWindow.document.removeEventListener('mousedown', this.mouseDownHandler) this.refs.root.contentWindow.document.removeEventListener('mousedown', this.mouseDownHandler)
this.refs.root.contentWindow.document.removeEventListener('mouseup', this.mouseUpHandler) this.refs.root.contentWindow.document.removeEventListener('mouseup', this.mouseUpHandler)
this.refs.root.contentWindow.document.removeEventListener('drop', this.preventImageDroppedHandler)
this.refs.root.contentWindow.document.removeEventListener('dragover', this.preventImageDroppedHandler)
eventEmitter.off('export:save-text', this.saveAsTextHandler) eventEmitter.off('export:save-text', this.saveAsTextHandler)
eventEmitter.off('export:save-md', this.saveAsMdHandler) eventEmitter.off('export:save-md', this.saveAsMdHandler)
} }
@@ -325,6 +329,11 @@ export default class MarkdownPreview extends React.Component {
} }
} }
preventImageDroppedHandler(e) {
e.preventDefault()
e.stopPropagation()
}
render () { render () {
let { className, style, tabIndex } = this.props let { className, style, tabIndex } = this.props
return ( return (