diff --git a/src/components/views/elements/TruncatedList.js b/src/components/views/elements/TruncatedList.js index c5a16e2ff3..8007b9a428 100644 --- a/src/components/views/elements/TruncatedList.js +++ b/src/components/views/elements/TruncatedList.js @@ -19,8 +19,12 @@ module.exports = React.createClass({ displayName: 'TruncatedList', propTypes: { + // The number of elements to show before truncating truncateAt: React.PropTypes.number, + // The className to apply to the wrapping div className: React.PropTypes.string, + // A function which will be invoked when an overflow element is required. + // This will be inserted after the children. createOverflowElement: React.PropTypes.func }, diff --git a/src/components/views/rooms/EntityTile.js b/src/components/views/rooms/EntityTile.js index ed0e5cbc41..6b320ce3ff 100644 --- a/src/components/views/rooms/EntityTile.js +++ b/src/components/views/rooms/EntityTile.js @@ -39,7 +39,8 @@ module.exports = React.createClass({ presenceActiveAgo: React.PropTypes.number, showInviteButton: React.PropTypes.bool, shouldComponentUpdate: React.PropTypes.func, - onClick: React.PropTypes.func + onClick: React.PropTypes.func, + suppressOnHover: React.PropTypes.bool }, getDefaultProps: function() { @@ -49,6 +50,7 @@ module.exports = React.createClass({ presenceState: "offline", presenceActiveAgo: -1, showInviteButton: false, + suppressOnHover: false }; }, @@ -75,12 +77,10 @@ module.exports = React.createClass({ var presenceClass = PRESENCE_CLASS[this.props.presenceState] || "mx_EntityTile_offline"; var mainClassName = "mx_EntityTile "; mainClassName += presenceClass; - if (this.state.hover) { - mainClassName += " mx_EntityTile_hover"; - } - var nameEl; - if (this.state.hover) { + + if (this.state.hover && !this.props.suppressOnHover) { + mainClassName += " mx_EntityTile_hover"; var PresenceLabel = sdk.getComponent("rooms.PresenceLabel"); nameEl = (
diff --git a/src/components/views/rooms/MemberList.js b/src/components/views/rooms/MemberList.js index c32cfc868d..57dcfa96d4 100644 --- a/src/components/views/rooms/MemberList.js +++ b/src/components/views/rooms/MemberList.js @@ -260,7 +260,21 @@ module.exports = React.createClass({ return to_display; }, + _createOverflowTile: function(overflowCount, totalCount) { + // For now we'll pretend this is any entity. It should probably be a separate tile. + var EntityTile = sdk.getComponent("rooms.EntityTile"); + var BaseAvatar = sdk.getComponent('avatars.BaseAvatar'); + return ( + + } key="overflow" name={`and ${overflowCount} more`} presenceState="online" + suppressOnHover={true} onClick={this._showFullMemberList} /> + ); + }, + _showFullMemberList: function() { + console.log("TODO"); + }, memberSort: function(userIdA, userIdB) { var userA = this.memberDict[userIdA].user; @@ -373,7 +387,8 @@ module.exports = React.createClass({
{this.inviteTile()} - + {this.makeMemberTiles('join', this.state.searchQuery)} {invitedSection}