treehouse
/
mastodon
21
8
Fork 5
Code Issues 32 Pull Requests Projects 1 Releases Wiki Activity

Allow typing a toot while an image uploads (#1429) 

This patch stops disabling the toot text field when an image is uploading. Instead, you can type to your heart's content and when the image uploads it'll append the image URL, and restore the position of your cursor to wherever it was in the toot text just prior. Effectively, the image URL is appended to the toot, and typing is not interrupted at all! ✨
lolsob-rspec
Jessica Stokes 2017-04-11 05:30:58 +10:00 committed by Eugen
parent 37c9ee5a10
commit adee97cb6e
1 changed files with 17 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
app/assets/javascripts/components/features/compose/components/compose_form.jsx
View File

@ -83,11 +83,23 @@ const ComposeForm = React.createClass({
this.props.onChangeSpoilerText(e.target.value); this.props.onChangeSpoilerText(e.target.value);
}, },
componentWillReceiveProps (nextProps) {
// If this is the update where we've finished uploading,
// save the last caret position so we can restore it below!
if (!nextProps.is_uploading && this.props.is_uploading) {
this._restoreCaret = this.autosuggestTextarea.textarea.selectionStart;
}
},
componentDidUpdate (prevProps) { componentDidUpdate (prevProps) {
if (this.props.focusDate !== prevProps.focusDate) { // This statement does several things:
// If replying to zero or one users, places the cursor at the end of the textbox. // - If we're beginning a reply, and,
// If replying to more than one user, selects any usernames past the first; // - Replying to zero or one users, places the cursor at the end of the textbox.
// - Replying to more than one user, selects any usernames past the first;
// this provides a convenient shortcut to drop everyone else from the conversation. // this provides a convenient shortcut to drop everyone else from the conversation.
// - If we've just finished uploading an image, and have a saved caret position,
// restores the cursor to that position after the text changes!
if (this.props.focusDate !== prevProps.focusDate || (prevProps.is_uploading && !this.props.is_uploading && typeof this._restoreCaret === 'number')) {
let selectionEnd, selectionStart; let selectionEnd, selectionStart;
if (this.props.preselectDate !== prevProps.preselectDate) { if (this.props.preselectDate !== prevProps.preselectDate) {
@ -118,7 +130,7 @@ const ComposeForm = React.createClass({
render () { render () {
const { intl, needsPrivacyWarning, mentionedDomains, onPaste } = this.props; const { intl, needsPrivacyWarning, mentionedDomains, onPaste } = this.props;
const disabled = this.props.is_submitting || this.props.is_uploading; const disabled = this.props.is_submitting;
let publishText = ''; let publishText = '';
let privacyWarning = ''; let privacyWarning = '';