From 1357a3e1432b2e9de2f494af80136d2ef8dfc9c5 Mon Sep 17 00:00:00 2001
From: SirStendec <sir@stendec.me>
Date: Wed, 15 Nov 2017 14:05:58 -0500
Subject: [PATCH] Simplify how the Chat Freeze feature is implemented to
 hopefully fix any FFZ-related bugs there. Also fix an issue with FFZ failing
 to load when there are extra React roots in the page.

---
 .../twitch-twilight/modules/chat/scroller.js  | 34 +++++++------------
 src/utilities/compat/fine.js                  | 17 +++++++---
 2 files changed, 26 insertions(+), 25 deletions(-)

diff --git a/src/sites/twitch-twilight/modules/chat/scroller.js b/src/sites/twitch-twilight/modules/chat/scroller.js
index 9cbc98b6..fde3a3ee 100644
--- a/src/sites/twitch-twilight/modules/chat/scroller.js
+++ b/src/sites/twitch-twilight/modules/chat/scroller.js
@@ -55,30 +55,20 @@ export default class Scroller extends Module {
 			const old_freeze = this.freeze;
 			this.freeze = val;
 
-			for(const inst of this.ChatScroller.instances)
-				if ( val === 0 )
-					inst.ffzDisableFreeze();
-				else if ( old_freeze === 0 )
+			for(const inst of this.ChatScroller.instances) {
+				inst.ffzDisableFreeze();
+				if ( val !== 0 )
 					inst.ffzEnableFreeze();
-				else
-					inst.ffzUpdateText();
+			}
 		});
 
 		this.ChatScroller.ready((cls, instances) => {
-			const t = this;
+			const t = this,
+				old_scroll = cls.prototype.scrollToBottom;
 
-			cls.prototype.componentDidUpdate = function(props, state) {
-				if ( state.isAutoScrolling &&
-						! state.ffzFrozen &&
-						this.props.messages !== props.messages )
-					this.scrollToBottom();
-			}
-
-			const old_scroll = cls.prototype.scrollToBottom;
 			cls.prototype.scrollToBottom = function() {
-				if ( this.state.ffzFrozen )
-					this.setState({ffzFrozen: false});
-				return old_scroll.call(this);
+				if ( ! this.state.ffzFrozen )
+					return old_scroll.call(this);
 			}
 
 			cls.prototype.ffzShouldBeFrozen = function(since) {
@@ -190,10 +180,12 @@ export default class Scroller extends Module {
 
 				this.ffz_freeze_enabled = true;
 
-				document.body.addEventListener('keydown',
-					this._ffz_key = this.ffzKey.bind(this));
+				if ( t.freeze > 1 ) {
+					document.body.addEventListener('keydown',
+						this._ffz_key = this.ffzKey.bind(this));
 
-				document.body.addEventListener('keyup', this._ffz_key);
+					document.body.addEventListener('keyup', this._ffz_key);
+				}
 
 				node.addEventListener('mousemove',
 					this._ffz_mousemove = this.ffzMouseMove.bind(this));
diff --git a/src/utilities/compat/fine.js b/src/utilities/compat/fine.js
index 1379d189..770c4c17 100644
--- a/src/utilities/compat/fine.js
+++ b/src/utilities/compat/fine.js
@@ -21,14 +21,17 @@ export default class Fine extends Module {
 	}
 
 
-	async onEnable() {
+	async onEnable(tries=0) {
 		// TODO: Move awaitElement to utilities/dom
 		if ( ! this.root_element )
-			this.root_element = await this.parent.awaitElement(this.selector || '[data-reactroot]');
+			this.root_element = await this.parent.awaitElement(this.selector || '#root [data-reactroot]');
 
 		const accessor = this.accessor = Fine.findAccessor(this.root_element);
-		if ( ! accessor )
-			return new Promise(r => setTimeout(r, 50)).then(() => this.onEnable());
+		if ( ! accessor ) {
+			if ( tries > 500 )
+				throw new Error(`unable to find React after 25 seconds`);
+			return new Promise(r => setTimeout(r, 50)).then(() => this.onEnable(tries+1));
+		}
 
 		this.react = this.getReactInstance(this.root_element);
 	}
@@ -449,6 +452,12 @@ export class FineWrapper extends EventEmitter {
 	}
 
 
+	forceUpdate() {
+		for(const inst of this.instances)
+			inst.forceUpdate();
+	}
+
+
 	on(event, fn, ctx) {
 		this._maybeWrap(event);
 		return super.on(event, fn, ctx);