Merge branch 'develop' into wmwragg/room-tag-menu

This commit is contained in:
wmwragg 2016-08-05 15:27:14 +01:00
commit 80e4a99477
2 changed files with 13 additions and 18 deletions

View file

@ -587,7 +587,7 @@ module.exports = React.createClass({
<input type="checkbox" disabled={ cli.isGuest() } <input type="checkbox" disabled={ cli.isGuest() }
onChange={this._onToggle.bind(this, "areNotifsMuted", true, false)} onChange={this._onToggle.bind(this, "areNotifsMuted", true, false)}
defaultChecked={this.state.areNotifsMuted}/> defaultChecked={this.state.areNotifsMuted}/>
Mute notifications for this room 'Mention only' notifications for this room
</label> </label>
<div className="mx_RoomSettings_settings"> <div className="mx_RoomSettings_settings">
<h3>Who can access this room?</h3> <h3>Who can access this room?</h3>

View file

@ -68,7 +68,7 @@ module.exports = React.createClass({
case 'notification_change': case 'notification_change':
// Is the notification about this room? // Is the notification about this room?
if (payload.roomId === this.props.room.roomId) { if (payload.roomId === this.props.room.roomId) {
this.setState( { areNotifsMuted : payload.isMuted }); this.setState( { areNotifsMuted : payload.areNotifsMuted });
} }
break; break;
} }
@ -137,6 +137,8 @@ module.exports = React.createClass({
}); });
this.setState({ menu: true }); this.setState({ menu: true });
} }
// Prevent the RoomTile onClick event firing as well
e.stopPropagation();
}, },
onAvatarClicked: function(e) { onAvatarClicked: function(e) {
@ -178,22 +180,20 @@ module.exports = React.createClass({
'mx_RoomTile': true, 'mx_RoomTile': true,
'mx_RoomTile_selected': this.props.selected, 'mx_RoomTile_selected': this.props.selected,
'mx_RoomTile_unread': this.props.unread, 'mx_RoomTile_unread': this.props.unread,
'mx_RoomTile_unreadNotify': notificationCount > 0, 'mx_RoomTile_unreadNotify': notificationCount > 0 && !this.state.areNotifsMuted,
'mx_RoomTile_read': !(this.props.highlight || notificationCount > 0),
'mx_RoomTile_highlight': this.props.highlight, 'mx_RoomTile_highlight': this.props.highlight,
'mx_RoomTile_invited': (me && me.membership == 'invite'), 'mx_RoomTile_invited': (me && me.membership == 'invite'),
'mx_RoomTile_menu': this.state.menu, 'mx_RoomTile_menu': this.state.menu,
'mx_RoomTile_noBadges': !(this.props.highlight || (notificationCount > 0 && !this.state.areNotifsMuted))
}); });
var avatarClasses = classNames({ var avatarClasses = classNames({
'mx_RoomTile_avatar': true, 'mx_RoomTile_avatar': true,
'mx_RoomTile_mute': this.state.areNotifsMuted,
}); });
var badgeClasses = classNames({ var badgeClasses = classNames({
'mx_RoomTile_badge': true, 'mx_RoomTile_badge': true,
'mx_RoomTile_badgeButton': this.state.badgeHover || this.state.menu, 'mx_RoomTile_badgeButton': this.state.badgeHover || this.state.menu,
'mx_RoomTile_badgeMute': this.state.areNotifsMuted,
}); });
// XXX: We should never display raw room IDs, but sometimes the // XXX: We should never display raw room IDs, but sometimes the
@ -206,18 +206,14 @@ module.exports = React.createClass({
if (this.state.badgeHover || this.state.menu) { if (this.state.badgeHover || this.state.menu) {
badgeContent = "\u00B7\u00B7\u00B7"; badgeContent = "\u00B7\u00B7\u00B7";
} else if (this.props.highlight || notificationCount > 0) { } else if (this.props.highlight || (notificationCount > 0 && !this.state.areNotifsMuted)) {
var limitedCount = (notificationCount > 99) ? '99+' : notificationCount; var limitedCount = (notificationCount > 99) ? '99+' : notificationCount;
badgeContent = notificationCount ? limitedCount : '!'; badgeContent = notificationCount ? limitedCount : '!';
} else { } else {
badgeContent = '\u200B'; badgeContent = '\u200B';
} }
if (this.state.areNotifsMuted && !(this.state.badgeHover || this.state.menu)) {
badge = <div className={ badgeClasses } onClick={this.onBadgeClicked} onMouseEnter={this.badgeOnMouseEnter} onMouseLeave={this.badgeOnMouseLeave}><img className="mx_RoomTile_badgeIcon" src="img/icon-context-mute.svg" width="16" height="12" /></div>;
} else {
badge = <div className={ badgeClasses } onClick={this.onBadgeClicked} onMouseEnter={this.badgeOnMouseEnter} onMouseLeave={this.badgeOnMouseLeave}>{ badgeContent }</div>; badge = <div className={ badgeClasses } onClick={this.onBadgeClicked} onMouseEnter={this.badgeOnMouseEnter} onMouseLeave={this.badgeOnMouseLeave}>{ badgeContent }</div>;
}
var label; var label;
var tooltip; var tooltip;
@ -225,17 +221,16 @@ module.exports = React.createClass({
var nameClasses = classNames({ var nameClasses = classNames({
'mx_RoomTile_name': true, 'mx_RoomTile_name': true,
'mx_RoomTile_invite': this.props.isInvite, 'mx_RoomTile_invite': this.props.isInvite,
'mx_RoomTile_mute': this.state.areNotifsMuted, 'mx_RoomTile_badgeShown': this.props.highlight || (notificationCount > 0 && !this.state.areNotifsMuted) || this.state.badgeHover || this.state.menu,
'mx_RoomTile_badgeShown': this.props.highlight || notificationCount > 0 || this.state.badgeHover || this.state.menu || this.state.areNotifsMuted,
}); });
let nameHTML = emojifyText(name); let nameHTML = emojifyText(name);
if (this.props.selected) { if (this.props.selected) {
let nameSelected = <span dangerouslySetInnerHTML={nameHTML}></span>; let nameSelected = <span dangerouslySetInnerHTML={nameHTML}></span>;
label = <div title={ name } onClick={this.onClick} className={ nameClasses }>{ nameSelected }</div>; label = <div title={ name } className={ nameClasses }>{ nameSelected }</div>;
} else { } else {
label = <div title={ name } onClick={this.onClick} className={ nameClasses } dangerouslySetInnerHTML={nameHTML}></div>; label = <div title={ name } className={ nameClasses } dangerouslySetInnerHTML={nameHTML}></div>;
} }
} }
else if (this.state.hover) { else if (this.state.hover) {
@ -258,9 +253,9 @@ module.exports = React.createClass({
var connectDropTarget = this.props.connectDropTarget; var connectDropTarget = this.props.connectDropTarget;
return connectDragSource(connectDropTarget( return connectDragSource(connectDropTarget(
<div className={classes} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}> <div className={classes} onClick={this.onClick} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}>
<div className={avatarClasses}> <div className={avatarClasses}>
<RoomAvatar onClick={this.onClick} room={this.props.room} width={24} height={24} /> <RoomAvatar room={this.props.room} width={24} height={24} />
</div> </div>
<div className="mx_RoomTile_nameContainer"> <div className="mx_RoomTile_nameContainer">
{ label } { label }