make the new userlist UI actually work

This commit is contained in:
Matthew Hodgson 2015-09-22 01:16:45 +02:00
parent 260e22186b
commit 61c94d63e7
5 changed files with 92 additions and 8 deletions

View file

@ -54,12 +54,12 @@ html {
}
.mx_ContextualMenu {
text-align: center;
border: 1px solid #a9dbf4;
border-radius: 8px;
background-color: #fff;
color: #747474;
position: fixed;
z-index: 1000;
z-index: 2001;
padding: 6px;
}
@ -71,7 +71,8 @@ html {
}
.mx_ContextualMenu_field {
padding: 6px;
padding: 3px 6px 3px 6px;
cursor: pointer;
}

View file

@ -28,7 +28,14 @@ module.exports = React.createClass({
mixins: [MemberInfoController],
render: function() {
var kickButton, banButton, muteButton, giveModButton;
var interactButton, kickButton, banButton, muteButton, giveModButton;
if (this.props.member.userId === MatrixClientPeg.get().credentials.userId) {
interactButton = <div className="mx_ContextualMenu_field" onClick={this.onLeaveClick}>Leave room</div>;
}
else {
interactButton = <div className="mx_ContextualMenu_field" onClick={this.onChatClick}>Start chat</div>;
}
if (this.state.can.kick) {
kickButton = <div className="mx_ContextualMenu_field" onClick={this.onKick}>
Kick
@ -54,7 +61,7 @@ module.exports = React.createClass({
return (
<div>
<div className="mx_ContextualMenu_field" onClick={this.onChatClick}>Start chat</div>
{interactButton}
{muteButton}
{kickButton}
{banButton}

View file

@ -44,10 +44,15 @@ module.exports = React.createClass({
},
onClick: function(e) {
var self = this;
self.setState({ 'menu': true });
ContextualMenu.createMenu(MemberInfo, {
member: this.props.member,
member: self.props.member,
right: window.innerWidth - e.pageX,
top: e.pageY,
onFinished: function() {
self.setState({ 'menu': false });
}
});
},
@ -109,7 +114,7 @@ module.exports = React.createClass({
}
}
mainClassName += presenceClass;
if (this.state.hover) {
if (this.state.hover || this.state.menu) {
mainClassName += " mx_MemberTile_hover";
}
@ -123,7 +128,7 @@ module.exports = React.createClass({
}
var nameEl;
if (this.state.hover) {
if (this.state.hover || this.state.menu) {
var presence;
// FIXME: make presence data update whenever User.presence changes...
var active = this.props.member.user ? (this.props.member.user.lastActiveAgo || -1) : -1;