Fix word wrapping and groundwork for loading previous messages

This commit is contained in:
Chris Blanchard 2015-09-20 17:42:34 +01:00
parent 84b2549cb5
commit 215cdc7a98
2 changed files with 21 additions and 1 deletions

View file

@ -38,6 +38,12 @@ var Chatroom = React.createClass({
socket.emit("message:refresh", {});
},
loadMoreMessages() {
socket.emit("message:refresh", {
// before:
});
},
sendMessage(message) {
socket.emit("newMessage", {message: message});
},
@ -58,6 +64,12 @@ var Chatroom = React.createClass({
<div className="panel-heading">Gather Chat</div>
<div className="panel-body">
<ul className="chat" id="chatmessages" ref="messageContainer">
<li className="text-center">
<a href="#"
className="btn btn-primary btn-xs">
Load more messages
</a>
</li>
{messages}
</ul>
</div>
@ -132,7 +144,7 @@ var ChatMessage = React.createClass({
{this.state.createdAt}
</small>
</div>
<p>{this.messageContent()}</p>
<p className="wordwrap">{this.messageContent()}</p>
</div>
</li>
);

View file

@ -8,6 +8,14 @@ html, body {
/*Chat*/
.wordwrap {
white-space: pre-wrap; /* CSS3 */
white-space: -moz-pre-wrap; /* Firefox */
white-space: -pre-wrap; /* Opera <7 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* IE */
}
#chatroom {
margin-top: 1em;
}