From 8dc73cb6cccd4cadfced4b7ce78089e1a4b2df07 Mon Sep 17 00:00:00 2001
From: Matthew Hodgson <matthew@matrix.org>
Date: Tue, 21 Jul 2015 11:03:01 -0700
Subject: [PATCH] finally fix dave's MemberInfo visibility bug, hopefully

---
 skins/base/css/molecules/MemberTile.css  | 16 ++++++++++++++--
 skins/base/views/molecules/MemberTile.js | 20 ++++++++++++++++----
 skins/base/views/organisms/RightPanel.js |  2 +-
 3 files changed, 31 insertions(+), 7 deletions(-)

diff --git a/skins/base/css/molecules/MemberTile.css b/skins/base/css/molecules/MemberTile.css
index d47768f39..ba64ec953 100644
--- a/skins/base/css/molecules/MemberTile.css
+++ b/skins/base/css/molecules/MemberTile.css
@@ -71,14 +71,26 @@ limitations under the License.
     text-overflow: ellipsis;
 }
 
+.mx_MemberTile_nameWrapper {
+    display: table-cell;
+    vertical-align: middle;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.mx_MemberTile_nameSpan {
+}
+
 .mx_MemberTile_unavailable .mx_MemberTile_avatar,
-.mx_MemberTile_unavailable .mx_MemberTile_name
+.mx_MemberTile_unavailable .mx_MemberTile_name,
+.mx_MemberTile_unavailable .mx_MemberTile_nameSpan
 {
     opacity: 0.75;
 }
 
 .mx_MemberTile_offline .mx_MemberTile_avatar,
-.mx_MemberTile_offline .mx_MemberTile_name
+.mx_MemberTile_offline .mx_MemberTile_name,
+.mx_MemberTile_offline .mx_MemberTile_nameSpan
 {
     opacity: 0.5;
 }
\ No newline at end of file
diff --git a/skins/base/views/molecules/MemberTile.js b/skins/base/views/molecules/MemberTile.js
index 8dd3f00ab..9583c3c4d 100644
--- a/skins/base/views/molecules/MemberTile.js
+++ b/skins/base/views/molecules/MemberTile.js
@@ -58,6 +58,21 @@ module.exports = React.createClass({
         }
         mainClassName += presenceClass;
 
+        var name;
+        if (this.state.hover) {
+            name =
+                <div className="mx_MemberTile_nameWrapper">
+                    <MemberInfo member={this.props.member} />
+                    <span className="mx_MemberTile_nameSpan">{this.props.member.name}</span>
+                </div>
+        }
+        else {
+            name =
+                <div className="mx_MemberTile_name">
+                    {this.props.member.name}
+                </div>
+        }
+
         return (
             <div className={mainClassName} onMouseEnter={ this.mouseEnter } onMouseLeave={ this.mouseLeave }>
                 <div className="mx_MemberTile_avatar">
@@ -66,10 +81,7 @@ module.exports = React.createClass({
                          width="40" height="40" alt=""/>
                          { power }
                 </div>
-                <div className="mx_MemberTile_name">
-                    { this.state.hover ? <MemberInfo member={this.props.member} /> : null }
-                    {this.props.member.name}
-                </div>
+                { name }
             </div>
         );
     }
diff --git a/skins/base/views/organisms/RightPanel.js b/skins/base/views/organisms/RightPanel.js
index 5b6477a0d..e5ca89c90 100644
--- a/skins/base/views/organisms/RightPanel.js
+++ b/skins/base/views/organisms/RightPanel.js
@@ -33,7 +33,7 @@ module.exports = React.createClass({
 
     getInitialState: function() {
         return {
-            phase : this.Phase.None
+            phase : this.Phase.MemberList
         }
     },