imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

hover state elements for the room tag menu, allong with CSS class updates

Browse source
This commit is contained in:
wmwragg 2016-08-10 14:46:05 +01:00
parent 75e1277961
commit 667264420c
1 changed files with 15 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/components/views/rooms/RoomTile.js
View file

@ -144,7 +144,7 @@ module.exports = React.createClass({
onAvatarClicked: function(e) { onAvatarClicked: function(e) {
// Only allow none guests to access the context menu // Only allow none guests to access the context menu
if (!MatrixClientPeg.get().isGuest()) { if (!MatrixClientPeg.get().isGuest() && !this.props.collapsed) {
// If the badge is clicked, then no longer show tooltip // If the badge is clicked, then no longer show tooltip
if (this.props.collapsed) { if (this.props.collapsed) {
@ -163,13 +163,13 @@ module.exports = React.createClass({
top: y, top: y,
room: this.props.room, room: this.props.room,
onFinished: function() { onFinished: function() {
//self.setState({ roomTagMenu: false }); self.setState({ roomTagMenu: false });
} }
}); });
//this.setState({ roomTagMenu: true }); this.setState({ roomTagMenu: true });
// Prevent the RoomTile onClick event firing as well
e.stopPropagation();
} }
// Prevent the RoomTile onClick event firing as well
e.stopPropagation();
}, },
render: function() { render: function() {
@ -194,6 +194,11 @@ module.exports = React.createClass({
'mx_RoomTile_avatar': true, 'mx_RoomTile_avatar': true,
}); });
var avatarContainerClasses = classNames({
'mx_RoomTile_avatar_container': true,
'mx_RoomTile_avatar_roomTagMenu': this.state.roomTagMenu,
})
var badgeClasses = classNames({ var badgeClasses = classNames({
'mx_RoomTile_badge': true, 'mx_RoomTile_badge': true,
'mx_RoomTile_badgeButton': this.state.badgeHover || this.state.notificationTagMenu, 'mx_RoomTile_badgeButton': this.state.badgeHover || this.state.notificationTagMenu,
@ -258,7 +263,11 @@ module.exports = React.createClass({
return connectDragSource(connectDropTarget( return connectDragSource(connectDropTarget(
<div className={classes} onClick={this.onClick} 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 room={this.props.room} onClick={this.onAvatarClicked} width={24} height={24} /> <div className="mx_RoomTile_avatar_menu" onClick={this.onAvatarClicked}>
<div className={avatarContainerClasses}>
<RoomAvatar room={this.props.room} width={24} height={24} />
</div>
</div>
</div> </div>
<div className="mx_RoomTile_nameContainer"> <div className="mx_RoomTile_nameContainer">
{ label } { label }