ES2015 for users

This commit is contained in:
Chris Blanchard 2015-08-11 01:31:03 +01:00
parent 667a167e79
commit 6ecdba9232
2 changed files with 20 additions and 28 deletions

View file

@ -1,17 +1,17 @@
"use strict"; "use strict";
var Chatroom = React.createClass({ var Chatroom = React.createClass({
getDefaultProps: function () { getDefaultProps() {
return { return {
history: [] history: []
}; };
}, },
componentDidMount: function () {
var self = this;
var TIMER_INTERVAL = 5000; // Every minute
socket.on("message:new", function (data) { componentDidMount() {
var history = self.props.history; let self = this;
socket.on("message:new", data => {
let history = self.props.history;
history.push(data); history.push(data);
self.setProps({ self.setProps({
history: history history: history
@ -20,7 +20,7 @@ var Chatroom = React.createClass({
}); });
// Message History Retrieved // Message History Retrieved
socket.on("message:refresh", function (data) { socket.on("message:refresh", data => {
self.setProps({ self.setProps({
history: data.chatHistory history: data.chatHistory
}); });
@ -28,30 +28,22 @@ var Chatroom = React.createClass({
}); });
socket.emit("message:refresh", {}); socket.emit("message:refresh", {});
self.timer = setInterval(function () {
self.forceUpdate();
}, TIMER_INTERVAL);
}, },
componentDidUnmount: function () { sendMessage(message) {
clearInterval(this.timer);
},
sendMessage: function (message) {
socket.emit("newMessage", {message: message}); socket.emit("newMessage", {message: message});
}, }
scrollToBottom: function () {
scrollToBottom() {
var node = React.findDOMNode(this.refs.messageContainer); var node = React.findDOMNode(this.refs.messageContainer);
node.scrollTop = node.scrollHeight; node.scrollTop = node.scrollHeight;
}, },
render: function () {
var messages = this.props.history.map(function (message) { render() {
return ( var messages = this.props.history.map(message => {
<ChatMessage return (<ChatMessage message={message} key={message.id} />);
message={message}
key={message.id} />
);
}); });
}
return ( return (
<div className="panel panel-default"> <div className="panel panel-default">
<div className="panel-heading">Gather Chat</div> <div className="panel-heading">Gather Chat</div>

View file

@ -12,7 +12,7 @@ var UserLogin = React.createClass({
handleSubmit(e) { handleSubmit(e) {
e.preventDefault(); e.preventDefault();
var id = React.findDOMNode(this.refs.authorize_id).value.trim(); let id = React.findDOMNode(this.refs.authorize_id).value.trim();
if (!id) return; if (!id) return;
React.findDOMNode(this.refs.authorize_id).value = ''; React.findDOMNode(this.refs.authorize_id).value = '';
this.authorizeId(id); this.authorizeId(id);
@ -52,12 +52,12 @@ var UserMenu = React.createClass({
}, },
componentDidMount() { componentDidMount() {
var self = this; let self = this;
socket.on('users:update', data => self.setProps({users: data.users})); socket.on('users:update', data => self.setProps({users: data.users}));
}, },
render() { render() {
var users = this.props.users.map(user => { let users = this.props.users.map(user => {
return ( return (
<li key={user.id}><a href="#">{user.username}</a></li> <li key={user.id}><a href="#">{user.username}</a></li>
); );
@ -102,7 +102,7 @@ var AdminPanel = React.createClass({
var CurrentUser = React.createClass({ var CurrentUser = React.createClass({
componentDidMount() { componentDidMount() {
var self = this; let self = this;
socket.on("users:update", data => self.setProps({user: data.currentUser})); socket.on("users:update", data => self.setProps({user: data.currentUser}));
socket.emit("users:refresh"); socket.emit("users:refresh");
}, },