Highlight rooms with unread messages

This commit is contained in:
David Baker 2015-06-18 14:35:17 +01:00
parent 5c56b201fc
commit 7c405f673a
3 changed files with 46 additions and 7 deletions

View file

@ -13,10 +13,6 @@
border: 2px inset #eee;
}
.mx_RoomTile:hover {
background-color: #aad;
}
.mx_RoomTile_name {
font-size: 80%;
font-weight: bold;
@ -26,3 +22,11 @@
overflow: hidden;
text-overflow: ellipsis;
}
.mx_RoomTile.unread {
background-color: #66e;
}
.mx_RoomTile:hover {
background-color: #ff8;
}

View file

@ -14,7 +14,8 @@ module.exports = React.createClass({
render: function() {
var classes = classNames({
'mx_RoomTile': true,
'selected': this.props.selected
'selected': this.props.selected,
'unread': this.props.unread
});
return (
<div className={classes} onClick={this.onClick}>

View file

@ -5,11 +5,40 @@ var ComponentBroker = require('../ComponentBroker');
var RoomTile = ComponentBroker.get("molecules/RoomTile");
module.exports = React.createClass({
componentWillMount: function() {
var cli = MatrixClientPeg.get();
cli.on("Room.timeline", this.onRoomTimeline);
this.setState({roomList: cli.getRooms()});
this.setState({
roomList: cli.getRooms(),
activityMap: {}
});
},
componentWillUnmount: function() {
if (MatrixClientPeg.get()) {
MatrixClientPeg.get().removeListener("Room.timeline", this.onRoomTimeline);
}
},
componentWillReceiveProps: function() {
this.state.activityMap[this.props.selectedRoom] = undefined;
this.setState({
activityMap: this.state.activityMap
});
},
onRoomTimeline: function(ev, room, toStartOfTimeline) {
if (room.roomId == this.props.selectedRoom) return;
// obviously this won't deep copy but we this shouldn't be necessary
var amap = this.state.activityMap;
amap[room.roomId] = 1;
this.setState({
roomMap: amap
});
},
makeRoomTiles: function() {
@ -17,7 +46,12 @@ module.exports = React.createClass({
return this.state.roomList.map(function(room) {
var selected = room.roomId == that.props.selectedRoom;
return (
<RoomTile room={room} key={room.roomId} selected={selected} />
<RoomTile
room={room}
key={room.roomId}
selected={selected}
unread={that.state.activityMap[room.roomId] === 1}
/>
);
});
},