Skip to content

Commit

Permalink
Add clipboard image paste feature opensupports#168
Browse files Browse the repository at this point in the history
  • Loading branch information
ivandiazwm committed Oct 5, 2018
1 parent 621c44e commit 7740952
Show file tree
Hide file tree
Showing 2 changed files with 25 additions and 1 deletion.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
.idea
.jshintrc
client/package-lock.json
tests/Gemfile.lock
server/composer.lock
server/vendor
Expand Down
25 changes: 24 additions & 1 deletion client/src/core-components/text-editor.js
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ class TextEditor extends React.Component {

render() {
return (
<div className={this.getClass()}>
<div className={this.getClass()} onPaste={this.onPaste.bind(this)}>
{isIE() ? this.renderTextArea() : this.renderQuill()}
</div>
);
Expand Down Expand Up @@ -141,6 +141,29 @@ class TextEditor extends React.Component {
}
}

onPaste(event) {
let items = event.nativeEvent && event.nativeEvent.clipboardData.items;

for (let index in items) {
let item = items[index];
if (item.kind === 'file') {
let blob = item.getAsFile();
let reader = new FileReader();
reader.onload = (event) => {
this.props.onChange({
target: {
value: (
this.props.value
+ `<img src="${event.target.result}" />`
)
}
});
};
reader.readAsDataURL(blob);
}
}
}

focus() {
if (this.refs.editor) {
this.refs.editor.focus();
Expand Down

0 comments on commit 7740952

Please sign in to comment.