From d953ac4e6b7f716931cc09949554f6953bb3b693 Mon Sep 17 00:00:00 2001
From: Richard van der Hoff <richard@matrix.org>
Date: Wed, 20 Apr 2016 12:25:19 +0100
Subject: [PATCH] Don't relayout scrollpanels every time something changes

Gemini's habit of reflowing everything everytime anything changes at all makes
for an unresponsive app. Turn it off everywhere we use gemini.
---
 package.json                                       |  2 +-
 src/components/structures/ScrollPanel.js           |  1 +
 src/components/structures/UserSettings.js          |  4 +++-
 src/components/views/rooms/MemberList.js           |  4 +++-
 src/components/views/rooms/RoomList.js             | 12 +++++++-----
 src/components/views/rooms/SearchableEntityList.js | 10 +++++++---
 6 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/package.json b/package.json
index c904769084..cd1545c1be 100644
--- a/package.json
+++ b/package.json
@@ -35,7 +35,7 @@
     "q": "^1.4.1",
     "react": "^15.0.1",
     "react-dom": "^15.0.1",
-    "react-gemini-scrollbar": "matrix-org/react-gemini-scrollbar#4707b88",
+    "react-gemini-scrollbar": "matrix-org/react-gemini-scrollbar#6f5336c",
     "sanitize-html": "^1.11.1",
     "velocity-animate": "^1.2.3",
     "velocity-ui-pack": "^1.2.2"
diff --git a/src/components/structures/ScrollPanel.js b/src/components/structures/ScrollPanel.js
index e62b67e314..77569be3bb 100644
--- a/src/components/structures/ScrollPanel.js
+++ b/src/components/structures/ScrollPanel.js
@@ -540,6 +540,7 @@ module.exports = React.createClass({
         // it's not obvious why we have a separate div and ol anyway.
         return (<GeminiScrollbar autoshow={true} ref="geminiPanel"
                 onScroll={this.onScroll} onResize={this.onResize}
+                relayoutOnUpdate={false}
                 className={this.props.className} style={this.props.style}>
                     <div className="mx_RoomView_messageListWrapper">
                         <ol ref="itemlist" className="mx_RoomView_MessageList" aria-live="polite">
diff --git a/src/components/structures/UserSettings.js b/src/components/structures/UserSettings.js
index 0b6815980c..57c5b7a9be 100644
--- a/src/components/structures/UserSettings.js
+++ b/src/components/structures/UserSettings.js
@@ -342,7 +342,9 @@ module.exports = React.createClass({
             <div className="mx_UserSettings">
                 <SimpleRoomHeader title="Settings" onCancelClick={ this.props.onClose }/>
 
-                <GeminiScrollbar className="mx_UserSettings_body" autoshow={true}>
+                <GeminiScrollbar className="mx_UserSettings_body"
+                                 relayoutOnUpdate={false}
+                                 autoshow={true}>
 
                 <h3>Profile</h3>
 
diff --git a/src/components/views/rooms/MemberList.js b/src/components/views/rooms/MemberList.js
index 735a7451b3..f029c519bc 100644
--- a/src/components/views/rooms/MemberList.js
+++ b/src/components/views/rooms/MemberList.js
@@ -521,7 +521,9 @@ module.exports = React.createClass({
         return (
             <div className="mx_MemberList">
                     {inviteMemberListSection}
-                    <GeminiScrollbar autoshow={true} className="mx_MemberList_joined mx_MemberList_outerWrapper">
+                    <GeminiScrollbar autoshow={true}
+                                     relayoutOnUpdate={false}
+                                     className="mx_MemberList_joined mx_MemberList_outerWrapper">
                         <TruncatedList className="mx_MemberList_wrapper" truncateAt={this.state.truncateAt}
                                 createOverflowElement={this._createOverflowTile}>
                             {this.makeMemberTiles('join', this.state.searchQuery)}
diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js
index 8550c0ee8f..aff03182a1 100644
--- a/src/components/views/rooms/RoomList.js
+++ b/src/components/views/rooms/RoomList.js
@@ -193,9 +193,9 @@ module.exports = React.createClass({
             var me = room.getMember(MatrixClientPeg.get().credentials.userId);
             if (!me) return;
 
-            // console.log("room = " + room.name + ", me.membership = " + me.membership + 
+            // console.log("room = " + room.name + ", me.membership = " + me.membership +
             //             ", sender = " + me.events.member.getSender() +
-            //             ", target = " + me.events.member.getStateKey() + 
+            //             ", target = " + me.events.member.getStateKey() +
             //             ", prevMembership = " + me.events.member.getPrevContent().membership);
 
             if (me.membership == "invite") {
@@ -232,7 +232,7 @@ module.exports = React.createClass({
                         }
                     }
                     else {
-                        s.lists["im.vector.fake.recent"].push(room); 
+                        s.lists["im.vector.fake.recent"].push(room);
                     }
                 }
             }
@@ -270,7 +270,7 @@ module.exports = React.createClass({
     _repositionTooltip: function(e) {
         if (this.tooltip && this.tooltip.parentElement) {
             var scroll = ReactDOM.findDOMNode(this);
-            this.tooltip.style.top = (70 + scroll.parentElement.offsetTop + this.tooltip.parentElement.offsetTop - this._getScrollNode().scrollTop) + "px"; 
+            this.tooltip.style.top = (70 + scroll.parentElement.offsetTop + this.tooltip.parentElement.offsetTop - this._getScrollNode().scrollTop) + "px";
         }
     },
 
@@ -324,7 +324,9 @@ module.exports = React.createClass({
         var self = this;
 
         return (
-            <GeminiScrollbar className="mx_RoomList_scrollbar" autoshow={true} onScroll={ self._repositionTooltips } ref="gemscroll">
+            <GeminiScrollbar className="mx_RoomList_scrollbar"
+                 relayoutOnUpdate={false}
+                 autoshow={true} onScroll={ self._repositionTooltips } ref="gemscroll">
             <div className="mx_RoomList">
                 <RoomSubList list={ self.state.lists['im.vector.fake.invite'] }
                              label="Invites"
diff --git a/src/components/views/rooms/SearchableEntityList.js b/src/components/views/rooms/SearchableEntityList.js
index fc0446ab41..c09fc2faee 100644
--- a/src/components/views/rooms/SearchableEntityList.js
+++ b/src/components/views/rooms/SearchableEntityList.js
@@ -162,9 +162,13 @@ var SearchableEntityList = React.createClass({
                     </div>
                 );
             }
-            list = <GeminiScrollbar autoshow={true} className="mx_SearchableEntityList_listWrapper">
-                        { list }
-                    </GeminiScrollbar>;
+            list = (
+                <GeminiScrollbar autoshow={true}
+                                 relayoutOnUpdate={false}
+                                 className="mx_SearchableEntityList_listWrapper">
+                    { list }
+                </GeminiScrollbar>
+            );
         }
 
         return (