PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Badge dohickey shown on name hover and badge hover

Browse source
This commit is contained in:
wmwragg 2016-07-21 18:20:12 +01:00
parent 775fc97102
commit 762873350a
1 changed files with 10 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -97,6 +97,11 @@ module.exports = React.createClass({
var badge; var badge;
var badgeContent; var badgeContent;
var badgeClasses = classNames({
'mx_RoomTile_badge': true,
'mx_RoomTile_badgeButton': this.state.badgeHover,
});
if (this.state.badgeHover) { if (this.state.badgeHover) {
badgeContent = "\u00B7\u00B7\u00B7"; badgeContent = "\u00B7\u00B7\u00B7";
} else if (this.props.highlight || notificationCount > 0) { } else if (this.props.highlight || notificationCount > 0) {
@ -105,7 +110,7 @@ module.exports = React.createClass({
badgeContent = '\u200B'; badgeContent = '\u200B';
} }
badge = <div className="mx_RoomTile_badge" onMouseEnter={this.badgeOnMouseEnter} onMouseLeave={this.badgeOnMouseLeave}>{ badgeContent }</div>; badge = <div className={ badgeClasses } onMouseEnter={this.badgeOnMouseEnter} onMouseLeave={this.badgeOnMouseLeave}>{ badgeContent }</div>;
var label; var label;
if (!this.props.collapsed) { if (!this.props.collapsed) {
@ -113,9 +118,9 @@ module.exports = React.createClass({
let nameHTML = emojifyText(name); let nameHTML = emojifyText(name);
if (this.props.selected) { if (this.props.selected) {
name = <span dangerouslySetInnerHTML={nameHTML}></span>; name = <span dangerouslySetInnerHTML={nameHTML}></span>;
label = <div className={ className }>{ name }</div>; label = <div onMouseEnter={this.badgeOnMouseEnter} onMouseLeave={this.badgeOnMouseLeave} className={ className }>{ name }</div>;
} else { } else {
label = <div className={ className } dangerouslySetInnerHTML={nameHTML}></div>; label = <div onMouseEnter={this.badgeOnMouseEnter} onMouseLeave={this.badgeOnMouseLeave} className={ className } dangerouslySetInnerHTML={nameHTML}></div>;
} }
} }
else if (this.state.hover) { else if (this.state.hover) {
@ -138,9 +143,9 @@ module.exports = React.createClass({
var connectDropTarget = this.props.connectDropTarget; var connectDropTarget = this.props.connectDropTarget;
return connectDragSource(connectDropTarget( return connectDragSource(connectDropTarget(
<div className={classes} onClick={this.onClick} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}> <div className={classes} onClick={this.onClick}>
<div className="mx_RoomTile_avatar"> <div className="mx_RoomTile_avatar">
<RoomAvatar room={this.props.room} width={24} height={24} /> <RoomAvatar room={this.props.room} width={24} height={24} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}/>
</div> </div>
{ label } { label }
{ badge } { badge }