diff --git a/src/components/views/rooms/BasicMessageComposer.js b/src/components/views/rooms/BasicMessageComposer.js index 49815c6f23..48ce81e895 100644 --- a/src/components/views/rooms/BasicMessageComposer.js +++ b/src/components/views/rooms/BasicMessageComposer.js @@ -309,6 +309,10 @@ export default class BasicMessageEditor extends React.Component { } } + getEditableRootNode() { + return this._editorRef; + } + isModified() { return this._modifiedFlag; } diff --git a/src/components/views/rooms/SendMessageComposer.js b/src/components/views/rooms/SendMessageComposer.js index 698356a175..0e03d83467 100644 --- a/src/components/views/rooms/SendMessageComposer.js +++ b/src/components/views/rooms/SendMessageComposer.js @@ -32,6 +32,7 @@ import {processCommandInput} from '../../../SlashCommands'; import sdk from '../../../index'; import Modal from '../../../Modal'; import { _t } from '../../../languageHandler'; +import ContentMessages from '../../../ContentMessages'; function addReplyToMessageContent(content, repliedToEvent, permalinkCreator) { const replyContent = ReplyThread.makeReplyMixIn(repliedToEvent); @@ -226,8 +227,13 @@ export default class SendMessageComposer extends React.Component { this._clearStoredEditorState(); } + componentDidMount() { + this._editorRef.getEditableRootNode().addEventListener("paste", this._onPaste, true); + } + componentWillUnmount() { dis.unregister(this.dispatcherRef); + this._editorRef.getEditableRootNode().removeEventListener("paste", this._onPaste, true); } componentWillMount() { @@ -310,6 +316,19 @@ export default class SendMessageComposer extends React.Component { this._editorRef && this._editorRef.focus(); } + _onPaste = (event) => { + const {clipboardData} = event; + if (clipboardData.files.length) { + // This actually not so much for 'files' as such (at time of writing + // neither chrome nor firefox let you paste a plain file copied + // from Finder) but more images copied from a different website + // / word processor etc. + ContentMessages.sharedInstance().sendContentListToRoom( + Array.from(clipboardData.files), this.props.room.roomId, this.context.matrixClient, + ); + } + } + render() { return (