diff options
author | Corey Hulen <corey@hulen.com> | 2015-09-02 12:41:47 -0700 |
---|---|---|
committer | Corey Hulen <corey@hulen.com> | 2015-09-02 12:41:47 -0700 |
commit | c7cafb6ac7404b62f38b48d3ec5782863abf203a (patch) | |
tree | fcf0970fa47942ca3a2431f21919271e1305a925 /web/react/components/msg_typing.jsx | |
parent | b31be3afa70a015afab864677545aafa3af8e1eb (diff) | |
parent | 63bc243b179f2c1f7b51ad2252f698907d2cde59 (diff) | |
download | chat-c7cafb6ac7404b62f38b48d3ec5782863abf203a.tar.gz chat-c7cafb6ac7404b62f38b48d3ec5782863abf203a.tar.bz2 chat-c7cafb6ac7404b62f38b48d3ec5782863abf203a.zip |
Merge pull request #553 from mattermost/MM-2065
MM-2065 Cosmetic refactoring for ESLint
Diffstat (limited to 'web/react/components/msg_typing.jsx')
-rw-r--r-- | web/react/components/msg_typing.jsx | 85 |
1 files changed, 49 insertions, 36 deletions
diff --git a/web/react/components/msg_typing.jsx b/web/react/components/msg_typing.jsx index aacb315dd..d9823c3cf 100644 --- a/web/react/components/msg_typing.jsx +++ b/web/react/components/msg_typing.jsx @@ -1,57 +1,70 @@ // Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved. // See License.txt for license information. - var SocketStore = require('../stores/socket_store.jsx'); var UserStore = require('../stores/user_store.jsx'); -module.exports = React.createClass({ - timer: null, - lastTime: 0, - componentDidMount: function() { - SocketStore.addChangeListener(this._onChange); - }, - componentWillReceiveProps: function(newProps) { - if(this.props.channelId !== newProps.channelId) { - this.setState({text:""}); +export default class MsgTyping extends React.Component { + constructor(props) { + super(props); + + this.timer = null; + this.lastTime = 0; + + this.onChange = this.onChange.bind(this); + + this.state = { + text: '' + }; + } + + componentDidMount() { + SocketStore.addChangeListener(this.onChange); + } + + componentWillReceiveProps(newProps) { + if (this.props.channelId !== newProps.channelId) { + this.setState({text: ''}); } - }, - componentWillUnmount: function() { - SocketStore.removeChangeListener(this._onChange); - }, - _onChange: function(msg) { - if (msg.action == "typing" && - this.props.channelId == msg.channel_id && - this.props.parentId == msg.props.parent_id) { + } + + componentWillUnmount() { + SocketStore.removeChangeListener(this.onChange); + } + onChange(msg) { + if (msg.action === 'typing' && + this.props.channelId === msg.channel_id && + this.props.parentId === msg.props.parent_id) { this.lastTime = new Date().getTime(); - var username = "Someone"; + var username = 'Someone'; if (UserStore.hasProfile(msg.user_id)) { username = UserStore.getProfile(msg.user_id).username; } - this.setState({ text: username + " is typing..." }); + this.setState({text: username + ' is typing...'}); if (!this.timer) { - var outer = this; - outer.timer = setInterval(function() { - if ((new Date().getTime() - outer.lastTime) > 8000) { - outer.setState({ text: "" }); - } - }, 3000); + this.timer = setInterval(function myTimer() { + if ((new Date().getTime() - this.lastTime) > 8000) { + this.setState({text: ''}); + } + }.bind(this), 3000); } + } else if (msg.action === 'posted' && msg.channel_id === this.props.channelId) { + this.setState({text: ''}); } - else if (msg.action == "posted" && msg.channel_id === this.props.channelId) { - this.setState({text:""}) - } - }, - getInitialState: function() { - return { text: "" }; - }, - render: function() { + } + + render() { return ( - <span className="msg-typing">{ this.state.text }</span> + <span className='msg-typing'>{this.state.text}</span> ); } -}); +} + +MsgTyping.propTypes = { + channelId: React.PropTypes.string, + parentId: React.PropTypes.string +}; |