Merge remote-tracking branch 'origin/develop' into dbkr/memberinfo_list_rooms

src/components/views/rooms/MemberDeviceInfo.js

@@ -99,12 +99,16 @@ export default class MemberDeviceInfo extends React.Component {
             );
         }
 
-        var deviceName = this.props.device.display_name || this.props.device.deviceId;
+        var deviceName = this.props.device.getDisplayName() || this.props.device.deviceId;
 
+        // add the deviceId as a titletext to help with debugging
         return (
-            <div className="mx_MemberDeviceInfo">
+            <div className="mx_MemberDeviceInfo" title={this.props.device.deviceId}>
                 <div className="mx_MemberDeviceInfo_deviceId">{deviceName}</div>
                 {indicator}
+                <div className="mx_MemberDeviceInfo_deviceKey">
+                    {this.props.device.getFingerprint()}
+                </div>
                 {verifyButton}
                 {blockButton}
             </div>

src/components/views/rooms/RoomList.js

@@ -79,8 +79,6 @@ module.exports = React.createClass({
         switch (payload.action) {
             case 'view_tooltip':
                 this.tooltip = payload.tooltip;
-                this._repositionTooltip();
-                if (this.tooltip) this.tooltip.style.display = 'block';
                 break;
             case 'call_state':
                 var call = CallHandler.getCall(payload.room_id);
@@ -315,17 +313,15 @@ module.exports = React.createClass({
     },
 
     _whenScrolling: function(e) {
-        this._repositionTooltip(e);
+        this._hideTooltip(e);
         this._repositionIncomingCallBox(e, false);
         this._updateStickyHeaders(false);
     },
 
-    _repositionTooltip: function(e) {
-        // We access the parent of the parent, as the tooltip is inside a container
-        // Needs refactoring into a better multipurpose tooltip
-        if (this.tooltip && this.tooltip.parentElement && this.tooltip.parentElement.parentElement) {
-            var scroll = ReactDOM.findDOMNode(this);
-            this.tooltip.style.top = (3 + scroll.parentElement.offsetTop + this.tooltip.parentElement.parentElement.offsetTop - this._getScrollNode().scrollTop) + "px";
+    _hideTooltip: function(e) {
+        // Hide tooltip when scrolling, as we'll no longer be over the one we were on
+        if (this.tooltip && this.tooltip.style.display !== "none") {
+            this.tooltip.style.display = "none";
         }
     },
 
@@ -374,7 +370,7 @@ module.exports = React.createClass({
         var scrollArea = this._getScrollNode();
         // Use the offset of the top of the scroll area from the window
         // as this is used to calculate the CSS fixed top position for the stickies
-        var scrollAreaOffset = scrollArea.getBoundingClientRect().top;
+        var scrollAreaOffset = scrollArea.getBoundingClientRect().top + window.pageYOffset;
         // Use the offset of the top of the componet from the window
         // as this is used to calculate the CSS fixed top position for the stickies
         var scrollAreaHeight = ReactDOM.findDOMNode(this).getBoundingClientRect().height;

src/components/views/rooms/RoomTile.js

@@ -17,9 +17,11 @@ limitations under the License.
 'use strict';
 
 var React = require('react');
+var ReactDOM = require("react-dom");
 var classNames = require('classnames');
 var dis = require("../../../dispatcher");
 var MatrixClientPeg = require('../../../MatrixClientPeg');
+var DMRoomMap = require('../../../utils/DMRoomMap');
 var sdk = require('../../../index');
 var ContextualMenu = require('../../structures/ContextualMenu');
 var RoomNotifs = require('../../../RoomNotifs');
@@ -66,6 +68,16 @@ module.exports = React.createClass({
         return this.state.notifState != RoomNotifs.MUTE;
     },
 
+    _isDirectMessageRoom: function(roomId) {
+        const dmRoomMap = new DMRoomMap(MatrixClientPeg.get());
+        var dmRooms = dmRoomMap.getUserIdForRoomId(roomId);
+        if (dmRooms) {
+            return true;
+        } else {
+            return false;
+        }
+    },
+
     onAccountData: function(accountDataEvent) {
         if (accountDataEvent.getType() == 'm.push_rules') {
             this.setState({
@@ -248,10 +260,9 @@ module.exports = React.createClass({
             } else {
                 label = <EmojiText element="div" title={ name } className={ nameClasses }>{name}</EmojiText>;
             }
-        }
-        else if (this.state.hover) {
+        } else if (this.state.hover) {
             var RoomTooltip = sdk.getComponent("rooms.RoomTooltip");
-            label = <RoomTooltip room={this.props.room}/>;
+            tooltip = <RoomTooltip className="mx_RoomTile_tooltip" room={this.props.room} />;
         }
 
         var incomingCallBox;
@@ -262,6 +273,11 @@ module.exports = React.createClass({
 
         var RoomAvatar = sdk.getComponent('avatars.RoomAvatar');
 
+        var directMessageIndicator;
+        if (this._isDirectMessageRoom(this.props.room.roomId)) {
+            directMessageIndicator = <img src="img/icon_person.svg" className="mx_RoomTile_dm" width="11" height="13" alt="dm"/>;
+        }
+
         // These props are injected by React DnD,
         // as defined by your `collect` function above:
         var isDragging = this.props.isDragging;
@@ -274,6 +290,7 @@ module.exports = React.createClass({
                     <div className="mx_RoomTile_avatar_menu" onClick={this.onAvatarClicked}>
                         <div className={avatarContainerClasses}>
                             <RoomAvatar room={this.props.room} width={24} height={24} />
+                            {directMessageIndicator}
                         </div>
                     </div>
                 </div>