Implement unread message status when scrolled up.

pull/2/head
Kegan Dougal 2015-07-22 14:49:32 +01:00
parent 8b0db49b8b
commit fbb6775523
2 changed files with 43 additions and 2 deletions

View File

@ -64,6 +64,13 @@ module.exports = React.createClass({
); );
}, },
getUnreadMessagesString: function() {
if (!this.state.numUnreadMessages) {
return "";
}
return this.state.numUnreadMessages + " unread messages";
},
render: function() { render: function() {
if (!this.state.room) { if (!this.state.room) {
return ( return (
@ -120,7 +127,18 @@ module.exports = React.createClass({
); );
} else { } else {
var typingString = this.getWhoIsTypingString(); var typingString = this.getWhoIsTypingString();
if (typingString) { var unreadMsgs = this.getUnreadMessagesString();
// unread count trumps who is typing since the unread count is only
// set when you've scrolled up
if (unreadMsgs) {
statusBar = (
<div className="mx_RoomView_typingBar">
<img src="img/typing.png" width="40" height="40" alt=""/>
{unreadMsgs}
</div>
);
}
else if (typingString) {
statusBar = ( statusBar = (
<div className="mx_RoomView_typingBar"> <div className="mx_RoomView_typingBar">
<img src="img/typing.png" width="40" height="40" alt=""/> <img src="img/typing.png" width="40" height="40" alt=""/>

View File

@ -52,6 +52,7 @@ module.exports = {
messageCap: INITIAL_SIZE, messageCap: INITIAL_SIZE,
editingRoomSettings: false, editingRoomSettings: false,
uploadingRoomSettings: false, uploadingRoomSettings: false,
numUnreadMessages: 0
} }
}, },
@ -130,8 +131,23 @@ module.exports = {
(messageWrapper.clientHeight + 150) (messageWrapper.clientHeight + 150)
); );
} }
var currentUnread = this.state.numUnreadMessages;
if (!toStartOfTimeline &&
(ev.getSender() !== MatrixClientPeg.get().credentials.userId)) {
// update unread count when scrolled up
if (this.atBottom) {
currentUnread = 0;
}
else {
currentUnread += 1;
}
}
this.setState({ this.setState({
room: MatrixClientPeg.get().getRoom(this.props.roomId) room: MatrixClientPeg.get().getRoom(this.props.roomId),
numUnreadMessages: currentUnread
}); });
if (toStartOfTimeline && !this.state.paginating) { if (toStartOfTimeline && !this.state.paginating) {
@ -178,6 +194,9 @@ module.exports = {
} }
} else if (this.atBottom) { } else if (this.atBottom) {
messageWrapper.scrollTop = messageWrapper.scrollHeight; messageWrapper.scrollTop = messageWrapper.scrollHeight;
if (this.state.numUnreadMessages !== 0) {
this.setState({numUnreadMessages: 0});
}
} }
}, },
@ -234,7 +253,11 @@ module.exports = {
onMessageListScroll: function(ev) { onMessageListScroll: function(ev) {
if (this.refs.messageWrapper) { if (this.refs.messageWrapper) {
var messageWrapper = this.refs.messageWrapper.getDOMNode(); var messageWrapper = this.refs.messageWrapper.getDOMNode();
var wasAtBottom = this.atBottom;
this.atBottom = messageWrapper.scrollHeight - messageWrapper.scrollTop <= messageWrapper.clientHeight; this.atBottom = messageWrapper.scrollHeight - messageWrapper.scrollTop <= messageWrapper.clientHeight;
if (this.atBottom && !wasAtBottom) {
this.forceUpdate(); // remove unread msg count
}
} }
if (!this.state.paginating) this.fillSpace(); if (!this.state.paginating) this.fillSpace();
}, },