summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--webapp/components/create_comment.jsx13
-rw-r--r--webapp/components/create_post.jsx11
-rw-r--r--webapp/components/edit_post_modal.jsx14
-rw-r--r--webapp/components/suggestion/suggestion_box.jsx5
-rw-r--r--webapp/components/textbox.jsx10
5 files changed, 35 insertions, 18 deletions
diff --git a/webapp/components/create_comment.jsx b/webapp/components/create_comment.jsx
index 8c80ad993..a9cf68833 100644
--- a/webapp/components/create_comment.jsx
+++ b/webapp/components/create_comment.jsx
@@ -78,7 +78,8 @@ class CreateComment extends React.Component {
previews: draft.previews,
submitting: false,
ctrlSend: PreferenceStore.getBool(Constants.Preferences.CATEGORY_ADVANCED_SETTINGS, 'send_on_ctrl_enter'),
- showPostDeletedModal: false
+ showPostDeletedModal: false,
+ typing: false
};
}
@@ -184,7 +185,8 @@ class CreateComment extends React.Component {
submitting: false,
postError: null,
previews: [],
- serverError: null
+ serverError: null,
+ typing: false
});
}
@@ -206,7 +208,9 @@ class CreateComment extends React.Component {
PostStore.storeCommentDraft(this.props.rootId, draft);
$('.post-right__scroll').parent().scrollTop($('.post-right__scroll')[0].scrollHeight);
- this.setState({messageText: messageText});
+
+ const typing = messageText !== '';
+ this.setState({messageText, typing});
}
handleKeyDown(e) {
@@ -325,7 +329,7 @@ class CreateComment extends React.Component {
componentWillReceiveProps(newProps) {
if (newProps.rootId !== this.props.rootId) {
const draft = PostStore.getCommentDraft(newProps.rootId);
- this.setState({messageText: draft.message, uploadsInProgress: draft.uploadsInProgress, previews: draft.previews});
+ this.setState({messageText: draft.message, uploadsInProgress: draft.uploadsInProgress, previews: draft.previews, typing: false});
}
}
@@ -415,6 +419,7 @@ class CreateComment extends React.Component {
onKeyPress={this.commentMsgKeyPress}
onKeyDown={this.handleKeyDown}
messageText={this.state.messageText}
+ typing={this.state.typing}
createMessage={formatMessage(holders.addComment)}
initialText=''
supportsCommands={false}
diff --git a/webapp/components/create_post.jsx b/webapp/components/create_post.jsx
index ea4459d7d..7aa0a586b 100644
--- a/webapp/components/create_post.jsx
+++ b/webapp/components/create_post.jsx
@@ -87,7 +87,8 @@ class CreatePost extends React.Component {
ctrlSend: PreferenceStore.getBool(Constants.Preferences.CATEGORY_ADVANCED_SETTINGS, 'send_on_ctrl_enter'),
centerTextbox: PreferenceStore.get(Preferences.CATEGORY_DISPLAY_SETTINGS, Preferences.CHANNEL_DISPLAY_MODE, Preferences.CHANNEL_DISPLAY_MODE_DEFAULT) === Preferences.CHANNEL_DISPLAY_MODE_CENTERED,
showTutorialTip: false,
- showPostDeletedModal: false
+ showPostDeletedModal: false,
+ typing: false
};
}
@@ -132,7 +133,7 @@ class CreatePost extends React.Component {
MessageHistoryStore.storeMessageInHistory(this.state.messageText);
- this.setState({submitting: true, serverError: null});
+ this.setState({submitting: true, serverError: null, typing: false});
if (post.message.indexOf('/') === 0) {
ChannelActions.executeCommand(
@@ -218,7 +219,8 @@ class CreatePost extends React.Component {
}
handleUserInput(messageText) {
- this.setState({messageText});
+ const typing = messageText !== '';
+ this.setState({messageText, typing});
const draft = PostStore.getCurrentDraft();
draft.message = messageText;
@@ -365,7 +367,7 @@ class CreatePost extends React.Component {
if (this.state.channelId !== channelId) {
const draft = this.getCurrentDraft();
- this.setState({channelId, messageText: draft.messageText, initialText: draft.messageText, submitting: false, serverError: null, postError: null, previews: draft.previews, uploadsInProgress: draft.uploadsInProgress});
+ this.setState({channelId, messageText: draft.messageText, initialText: draft.messageText, submitting: false, typing: false, serverError: null, postError: null, previews: draft.previews, uploadsInProgress: draft.uploadsInProgress});
}
}
@@ -516,6 +518,7 @@ class CreatePost extends React.Component {
onKeyPress={this.postMsgKeyPress}
onKeyDown={this.handleKeyDown}
messageText={this.state.messageText}
+ typing={this.state.typing}
createMessage={this.props.intl.formatMessage(holders.write)}
channelId={this.state.channelId}
id='post_textbox'
diff --git a/webapp/components/edit_post_modal.jsx b/webapp/components/edit_post_modal.jsx
index 0c7b8d672..4bd23a26d 100644
--- a/webapp/components/edit_post_modal.jsx
+++ b/webapp/components/edit_post_modal.jsx
@@ -38,7 +38,7 @@ class EditPostModal extends React.Component {
this.handleKeyDown = this.handleKeyDown.bind(this);
this.onPreferenceChange = this.onPreferenceChange.bind(this);
- this.state = {editText: '', originalText: '', title: '', post_id: '', channel_id: '', comments: 0, refocusId: ''};
+ this.state = {editText: '', originalText: '', title: '', post_id: '', channel_id: '', comments: 0, refocusId: '', typing: false};
}
handleEdit() {
var updatedPost = {};
@@ -78,7 +78,8 @@ class EditPostModal extends React.Component {
$('#edit_post').modal('hide');
}
handleEditInput(editMessage) {
- this.setState({editText: editMessage});
+ const typing = editMessage !== '';
+ this.setState({editText: editMessage, typing});
}
handleEditKeyPress(e) {
if (!this.state.ctrlSend && e.which === KeyCodes.ENTER && !e.shiftKey && !e.altKey) {
@@ -99,7 +100,8 @@ class EditPostModal extends React.Component {
post_id: options.postId || '',
channel_id: options.channelId || '',
comments: options.comments || 0,
- refocusId: options.refocusId || ''
+ refocusId: options.refocusId || '',
+ typing: false
});
$(ReactDOM.findDOMNode(this.refs.modal)).modal('show');
@@ -118,7 +120,7 @@ class EditPostModal extends React.Component {
var self = this;
$(ReactDOM.findDOMNode(this.refs.modal)).on('hidden.bs.modal', () => {
- self.setState({editText: '', originalText: '', title: '', channel_id: '', post_id: '', comments: 0, refocusId: '', error: ''});
+ self.setState({editText: '', originalText: '', title: '', channel_id: '', post_id: '', comments: 0, refocusId: '', error: '', typing: false});
});
$(ReactDOM.findDOMNode(this.refs.modal)).on('show.bs.modal', (e) => {
@@ -133,7 +135,8 @@ class EditPostModal extends React.Component {
channel_id: $(button).attr('data-channelid'),
post_id: $(button).attr('data-postid'),
comments: $(button).attr('data-comments'),
- refocusId: $(button).attr('data-refocusid')
+ refocusId: $(button).attr('data-refocusid'),
+ typing: false
});
});
@@ -199,6 +202,7 @@ class EditPostModal extends React.Component {
onKeyPress={this.handleEditKeyPress}
onKeyDown={this.handleKeyDown}
messageText={this.state.editText}
+ typing={this.state.typing}
createMessage={this.props.intl.formatMessage(holders.editPost)}
supportsCommands={false}
id='edit_textbox'
diff --git a/webapp/components/suggestion/suggestion_box.jsx b/webapp/components/suggestion/suggestion_box.jsx
index 0ed9449ed..6260e179c 100644
--- a/webapp/components/suggestion/suggestion_box.jsx
+++ b/webapp/components/suggestion/suggestion_box.jsx
@@ -84,10 +84,8 @@ export default class SuggestionBox extends React.Component {
handleCompleteWord(term, matchedPretext) {
const textbox = ReactDOM.findDOMNode(this.refs.textbox);
const caret = Utils.getCaretPosition(textbox);
-
- const text = this.props.value;
+ const text = textbox.value;
const pretext = text.substring(0, caret);
-
let prefix;
if (pretext.endsWith(matchedPretext)) {
prefix = pretext.substring(0, pretext.length - matchedPretext.length);
@@ -104,6 +102,7 @@ export default class SuggestionBox extends React.Component {
if (this.props.onUserInput) {
this.props.onUserInput(prefix + term + ' ' + suffix);
}
+ this.refs.textbox.value = (prefix + term + ' ' + suffix);
// set the caret position after the next rendering
window.requestAnimationFrame(() => {
diff --git a/webapp/components/textbox.jsx b/webapp/components/textbox.jsx
index 7f5ecea09..41db38837 100644
--- a/webapp/components/textbox.jsx
+++ b/webapp/components/textbox.jsx
@@ -176,6 +176,11 @@ export default class Textbox extends React.Component {
</div>
);
+ const otherProps = {};
+ if (!this.props.typing) {
+ otherProps.value = this.props.messageText;
+ }
+
return (
<div
ref='wrapper'
@@ -189,7 +194,6 @@ export default class Textbox extends React.Component {
spellCheck='true'
maxLength={Constants.MAX_POST_LEN}
placeholder={this.props.createMessage}
- value={this.props.messageText}
onUserInput={this.props.onUserInput}
onKeyPress={this.handleKeyPress}
onKeyDown={this.handleKeyDown}
@@ -198,6 +202,7 @@ export default class Textbox extends React.Component {
listComponent={SuggestionList}
providers={this.suggestionProviders}
channelId={this.props.channelId}
+ {...otherProps}
/>
<div
ref='preview'
@@ -238,5 +243,6 @@ Textbox.propTypes = {
onKeyPress: React.PropTypes.func.isRequired,
createMessage: React.PropTypes.string.isRequired,
onKeyDown: React.PropTypes.func,
- supportsCommands: React.PropTypes.bool.isRequired
+ supportsCommands: React.PropTypes.bool.isRequired,
+ typing: React.PropTypes.bool.isRequired
};