make the new userlist UI actually work
This commit is contained in:
parent
260e22186b
commit
61c94d63e7
5 changed files with 92 additions and 8 deletions
|
@ -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;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -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;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue