From 1b9b695bdd74d539ad77a87407b95d210d2637bf Mon Sep 17 00:00:00 2001
From: SirStendec <sir@stendec.me>
Date: Mon, 19 Dec 2016 21:33:45 -0500
Subject: [PATCH] 3.5.405. API additions. Improve support for follower-only
 chat mode. Fix whispers in pop-out chat. Fix a compatibility issue with
 BetterTTV. Fix channel metadata on theater mode hover. Fix Twitch's most
 recent changes to player positioning. Fix classic player control height in
 theater mode. Closes #72

---
 changelog.html          | 64 +++++++++++++---------------
 old_changes.html        | 34 +++++++++++++++
 src/ember/channel.js    |  4 +-
 src/ember/chat-input.js |  6 +--
 src/ember/line.js       | 16 ++++---
 src/ember/room.js       | 50 +++++++++++++++++++---
 src/ext/api.js          |  7 ++++
 src/main.js             |  2 +-
 src/ui/channel_stats.js |  4 +-
 src/utils.js            | 12 +++---
 style.css               | 93 ++++++++++++++++++++---------------------
 11 files changed, 186 insertions(+), 106 deletions(-)

diff --git a/changelog.html b/changelog.html
index 668b3771..c342f662 100644
--- a/changelog.html
+++ b/changelog.html
@@ -1,3 +1,33 @@
+<div class="list-header">3.5.405 <time datetime="2016-12-19">(2016-12-19)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: Display Channel Metadata on Theater Mode Hover</li>
+	<li>Fixed: Twitch goofed up player positioning.</li>
+	<li>Fixed: Classic Player controls not rendering as the correct height in theater mode with whispers on bottom.</li>
+</ul>
+
+<div class="list-header">3.5.404 <time datetime="2016-12-18">(2016-12-18)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: Compatibility issue with BetterTTV and FFZ getting into a fight over positioning the player.</li>
+</ul>
+
+<div class="list-header">3.5.403 <time datetime="2016-12-16">(2016-12-16)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: Whisper display in pop-out chat.</li>
+</ul>
+
+<div class="list-header">3.5.402 <time datetime="2016-12-16">(2016-12-16)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>API Changed: <code>api.retokenize_messages(room, user, max_age)</code> now takes a maximum age to prevent it from processing old chat messages.</li>
+	<li>Fixed: Room status indicator for Follower-Only chat mode wasn't updating.</li>
+	<li>Added: Enable the tab-completion for <code>/followers</code> and <code>/followersoff</code> as they can be used even if you don't have the tab enabling the UI.</li>
+</ul>
+
+<div class="list-header">3.5.401 <time datetime="2016-12-16">(2016-12-16)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>API Added: <code>api.retokenize_messages</code> to force retokenization of old chat messages after emoticons load.</li>
+	<li>API Fixed: Bug modifying the source data array in metadata click functions.</li>
+</ul>
+
 <div class="list-header">3.5.400 <time datetime="2016-12-16">(2016-12-16)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Added: Support for Follower-Only chat mode.</li>
@@ -48,39 +78,5 @@
 	<li>Fixed: Bug when testing to see if a chat command should be accessible.</li>
 </ul>
 
-<div class="list-header">3.5.394 <time datetime="2016-12-08">(2016-12-08)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Fixed: The <code>/card</code> command and the link in whisper windows to Open Moderation Card were not working.</li>
-	<li>Fixed: Switching moderation cards to another user by clicking their name in moderation card chat history.</li>
-</ul>
-
-<div class="list-header">3.5.393 <time datetime="2016-12-07">(2016-12-07)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>API Added: <code>api.room_add_user_badge</code> and <code>api.room_remove_user_badge</code> methods for adding and removing room-specific badges from a user. Note: These methods only function when the associated room is loaded.</li>
-</ul>
-
-<div class="list-header">3.5.392 <time datetime="2016-12-07">(2016-12-07)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Fixed: Not sanitizing emoticon names in tooltips.</li>
-</ul>
-
-<div class="list-header">3.5.391 <time datetime="2016-12-07">(2016-12-07)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Fixed: Security issue.</li>
-</ul>
-
-<div class="list-header">3.5.390 <time datetime="2016-12-06">(2016-12-06)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Fixed: Dark theme CSS tweaks.</li>
-</ul>
-
-<div class="list-header">3.5.389 <time datetime="2016-12-03">(2016-12-03)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Added: Setting to move the Latest Uploads to the bottom of the Following page or to hide it outright.</li>
-	<li>Changed: When you pop out chat, it will take the custom width you've given the right sidebar.</li>
-	<li>Removed: Auto-Pause Hosted Channels. Twitch has made it impossible to determine from the player if it is a host or not.</li>
-	<li>Fixed: Stream latency display.</li>
-</ul>
-
 <div class="list-header" id="ffz-old-news-button"><a href="#">View Older</a></div>
 <div id="ffz-old-news"></div>
\ No newline at end of file
diff --git a/old_changes.html b/old_changes.html
index a8f005c6..48b1cf24 100644
--- a/old_changes.html
+++ b/old_changes.html
@@ -1,3 +1,37 @@
+<div class="list-header">3.5.394 <time datetime="2016-12-08">(2016-12-08)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: The <code>/card</code> command and the link in whisper windows to Open Moderation Card were not working.</li>
+	<li>Fixed: Switching moderation cards to another user by clicking their name in moderation card chat history.</li>
+</ul>
+
+<div class="list-header">3.5.393 <time datetime="2016-12-07">(2016-12-07)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>API Added: <code>api.room_add_user_badge</code> and <code>api.room_remove_user_badge</code> methods for adding and removing room-specific badges from a user. Note: These methods only function when the associated room is loaded.</li>
+</ul>
+
+<div class="list-header">3.5.392 <time datetime="2016-12-07">(2016-12-07)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: Not sanitizing emoticon names in tooltips.</li>
+</ul>
+
+<div class="list-header">3.5.391 <time datetime="2016-12-07">(2016-12-07)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: Security issue.</li>
+</ul>
+
+<div class="list-header">3.5.390 <time datetime="2016-12-06">(2016-12-06)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: Dark theme CSS tweaks.</li>
+</ul>
+
+<div class="list-header">3.5.389 <time datetime="2016-12-03">(2016-12-03)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Added: Setting to move the Latest Uploads to the bottom of the Following page or to hide it outright.</li>
+	<li>Changed: When you pop out chat, it will take the custom width you've given the right sidebar.</li>
+	<li>Removed: Auto-Pause Hosted Channels. Twitch has made it impossible to determine from the player if it is a host or not.</li>
+	<li>Fixed: Stream latency display.</li>
+</ul>
+
 <div class="list-header">3.5.388 <time datetime="2016-12-02">(2016-12-02)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Fixed: Moderation cards.</li>
diff --git a/src/ember/channel.js b/src/ember/channel.js
index d7d4addb..0755d8c6 100644
--- a/src/ember/channel.js
+++ b/src/ember/channel.js
@@ -193,9 +193,11 @@ FFZ.prototype.modify_channel_live = function(view) {
 		},
 
 		ffzUpdatePlayerPosition: function() {
-			if ( this._ffz_player_repositoner && Date.now() - this._ffz_loaded > 60000 ) {
+			if ( f.has_bttv || this._ffz_player_repositoner && Date.now() - this._ffz_loaded > 60000 ) {
 				clearInterval(this._ffz_player_repositoner);
 				this._ffz_player_repositoner = null;
+				if ( f.has_bttv )
+					return;
 			}
 
 			this.updatePlayerPosition();
diff --git a/src/ember/chat-input.js b/src/ember/chat-input.js
index 3886f458..c92d419d 100644
--- a/src/ember/chat-input.js
+++ b/src/ember/chat-input.js
@@ -29,11 +29,11 @@ var FFZ = window.FrankerFaceZ,
 		},
 		slowoff: {info: 'Disable Slow Mode'},
 
-		/*followers: {
-			label: '/followers <i>[duration followed]</i>',
+		followers: {
+			label: '/followers <i>[duration]</i>',
 			info: 'Enable Followers-Only Mode'
 		},
-		followersoff: { info: 'Disable Followers-Only Mode'},*/
+		followersoff: { info: 'Disable Followers-Only Mode'},
 
 		r9kbeta: {info: 'Enable R9k Mode'},
 		r9kbetaoff: {info: 'Disable R9k Mode'},
diff --git a/src/ember/line.js b/src/ember/line.js
index 49fe9f77..f17f9c1d 100644
--- a/src/ember/line.js
+++ b/src/ember/line.js
@@ -679,10 +679,10 @@ FFZ.prototype.setup_line = function() {
 	this.toggle_style('chat-hc-bold', this.settings.high_contrast_chat[1] === '1');
 	this.toggle_style('chat-hc-background', this.settings.high_contrast_chat[0] === '1');
 
-
+	var f = this;
 	this.update_views('component:video/rechat/chat-message', this._modify_vod_line);
 	this.update_views('component:chat/message-line', this._modify_chat_subline);
-	this.update_views('component:chat/whisper-line', this._modify_chat_subline);
+	this.update_views('component:chat/whisper-line', function(x) { return f._modify_chat_subline(x, true) });
 
 
 	// Store the capitalization of our own name.
@@ -773,7 +773,7 @@ FFZ.prototype._modify_chat_line = function(component, is_vod) {
 				this_ul = this.get('ffzUserLevel'),
 				other_ul = room && room.room && room.room.get('ffzUserLevel') || 0,
 
-				shouldnt_show =is_whisper || this_ul >= other_ul || (f.settings.mod_buttons.length === 0 && ! is_tb),
+				shouldnt_show = is_whisper || this_ul >= other_ul || (f.settings.mod_buttons.length === 0 && ! is_tb),
 				output;
 
 			if ( ! is_pinned_cheer && shouldnt_show )
@@ -976,15 +976,19 @@ FFZ.prototype._modify_chat_line = function(component, is_vod) {
 }
 
 
-FFZ.prototype._modify_chat_subline = function(component) {
+FFZ.prototype._modify_chat_subline = function(component, is_whisper) {
 	var f = this,
 		PinnedCheers = utils.ember_lookup('service:bits-pinned-cheers');
 
 	this._modify_chat_line(component);
 
 	component.reopen({
-		classNameBindings: ["msgObject.style", "msgObject.isModerationMessage:moderation-message", "msgObject.ffz_has_mention:ffz-mentioned", "ffzWasDeleted:ffz-deleted", "ffzHasOldMessages:clearfix", "ffzHasOldMessages:ffz-has-deleted"],
-		attributeBindings: ["msgObject.tags.id:data-id", "msgObject.room:data-room", "msgObject.from:data-sender", "msgObject.deleted:data-deleted"],
+		classNameBindings: is_whisper ?
+			[':whisper-line', ':chat-line', 'isReceivedWhisper:whisper-incoming:whisper-outgoing'] :
+			["msgObject.style", "msgObject.isModerationMessage:moderation-message", "msgObject.ffz_has_mention:ffz-mentioned", "ffzWasDeleted:ffz-deleted", "ffzHasOldMessages:clearfix", "ffzHasOldMessages:ffz-has-deleted"],
+		attributeBindings: is_whisper ?
+			['msgObject.nonce:data-nonce', 'msgObject.tags.id:data-id', 'msgObject.from:data-sender'] :
+			["msgObject.tags.id:data-id", "msgObject.room:data-room", "msgObject.from:data-sender", "msgObject.deleted:data-deleted"],
 
 		didInsertElement: function() {
 			if ( this.get('msgObject') ) {
diff --git a/src/ember/room.js b/src/ember/room.js
index 19265ff5..2d00306c 100644
--- a/src/ember/room.js
+++ b/src/ember/room.js
@@ -23,10 +23,11 @@ var FFZ = window.FrankerFaceZ,
 		["emote", "emoteOnly", "This room is in Twitch emoticons only mode. Emoticons added by extensions are not available in this mode."],
 		["sub", "subsOnly", "This room is in subscribers-only mode."],
 		["follow", function(room) {
-				return room && room.get('followersOnly') > -1
+				return room && ! room.get('isGroupRoom') && room.get('followersOnly') > -1
 			}, function(room) {
-				var name = room && (room.get('channel.display_name') || room.get("tmiRoom.displayName") || room.get('isGroupRoom') ? room.get('tmiRoom.name') : FFZ.get_capitalization(room.get('name')) );
-				return "This room is in followers-only mode. You may only participate in chat if you have been following " + utils.sanitize(name) + " for at least " + utils.duration_string((room && room.get('followersOnly') || 0) * 60, true, true) + "."
+				var name = room && (room.get('channel.display_name') || room.get("tmiRoom.displayName") || room.get('isGroupRoom') ? room.get('tmiRoom.name') : FFZ.get_capitalization(room.get('name')) ),
+					duration = room && room.get('followersOnly') || 0;
+				return "This room is in followers-only mode. You may only participate in chat if you " + (duration > 0 ? " have been following " : 'follow ') + utils.sanitize(name) + (duration > 0 ? " for at least " + utils.duration_string(duration * 60, true, true) : '') + ".";
 			}],
 		["slow", "slow", function(room) { return "This room is in slow mode. You may send messages every <nobr>" + utils.number_commas(room && room.get('slow') || 120) + " seconds</nobr>." }],
 		["ban", "ffz_banned", "You have been banned from talking in this room."],
@@ -999,12 +1000,16 @@ FFZ.prototype.add_room = function(room_id, room) {
 			if ( set ) {
 				if ( set.users.indexOf(room_id) === -1 )
 					set.users.push(room_id);
+				room.ffzRetokenizeUser();
 				continue;
 			}
 
 			this.load_set(sid, function(success, data) {
-				if ( success )
-					data.users.push(room_id);
+				if ( success ) {
+					if ( data.users.indexOf(room_id) === -1 )
+						data.users.push(room_id);
+					room.ffzRetokenizeUser();
+				}
 			});
 		}
 	}
@@ -1260,7 +1265,7 @@ FFZ.prototype._modify_room = function(room) {
 		ffzUpdateStatus: function() {
 			if ( f._roomv )
 				f._roomv.ffzUpdateStatus();
-		}.observes('r9k', 'subsOnly', 'emoteOnly', 'slow', 'ffz_banned'),
+		}.observes('r9k', 'subsOnly', 'emoteOnly', 'slow', 'ffz_banned', 'followersOnly'),
 
 
 		// User Level
@@ -1889,6 +1894,39 @@ FFZ.prototype._modify_room = function(room) {
 			return f.settings.timeout_notices === 2 || (f.settings.timeout_notices === 1 && this.get('isModeratorOrHigher'));
 		},
 
+		ffzRetokenizeUser: function(user, max_age) {
+			// Retokenize all messages by a user, or just all messages.
+			var messages = this.get('messages'),
+				i = messages.length,
+				now = new Date;
+
+			while(i--) {
+				var msg = messages[i],
+					age = msg.date ? (now - msg.date) / 1000 : 0;
+
+				if ( max_age && age > max_age )
+					break;
+
+				if ( ! user || msg.from === user ) {
+					msg.cachedTokens = null;
+					if ( msg._line )
+						Ember.propertyDidChange(msg._line, 'ffzTokenizedMessage');
+				}
+			}
+
+			messages = this.ffzPending;
+			i = messages ? messages.length : 0;
+
+			while(i--) {
+				var msg = messages[i],
+					age = msg.date ? (now - msg.date) / 1000 : 0;
+				if ( max_age && age > max_age )
+					break;
+				if ( ! user || msg.from === user )
+					msg.cachedTokens = null;
+			}
+		},
+
 		addNotification: function(msg) {
 			if ( msg ) {
 				// We don't want to display these notices because we're injecting our own messages.
diff --git a/src/ext/api.js b/src/ext/api.js
index 8bc1995e..fc99e6ca 100644
--- a/src/ext/api.js
+++ b/src/ext/api.js
@@ -599,6 +599,13 @@ API.prototype.user_remove_set = function(username, set_id) {
 }
 
 
+API.prototype.retokenize_messages = function(room, user, max_age) {
+	var rooms = room ? [room] : Object.keys(this.ffz.rooms);
+	for(var i=0; i < rooms.length; i++)
+		rooms[i] && rooms[i].room && rooms[i].room.ffzRetokenizeUser(user, max_age);
+}
+
+
 // -----------------------
 // Chat Callback
 // -----------------------
diff --git a/src/main.js b/src/main.js
index 5f3c93e8..234d7d96 100644
--- a/src/main.js
+++ b/src/main.js
@@ -61,7 +61,7 @@ FFZ.channel_metadata = {};
 
 // Version
 var VER = FFZ.version_info = {
-	major: 3, minor: 5, revision: 400,
+	major: 3, minor: 5, revision: 405,
 	toString: function() {
 		return [VER.major, VER.minor, VER.revision].join(".") + (VER.extra || "");
 	}
diff --git a/src/ui/channel_stats.js b/src/ui/channel_stats.js
index 6733f410..20935fb8 100644
--- a/src/ui/channel_stats.js
+++ b/src/ui/channel_stats.js
@@ -303,7 +303,7 @@ FFZ.prototype.render_metadata = function(key, basic_info, metabar, timers, refre
 						return false;
 
 					e.update_stat = f.render_metadata.bind(f, key, basic_info, metabar, timers, refresh_func, is_hosting);
-					var data = info.setup ? info.setup.apply(f, basic_info) : basic_info;
+					var data = info.setup ? info.setup.apply(f, basic_info) : basic_info.copy();
 					if ( ! (data instanceof Promise) )
 						data = Promise.resolve(data);
 
@@ -323,7 +323,7 @@ FFZ.prototype.render_metadata = function(key, basic_info, metabar, timers, refre
 					if ( popup && popup.id === 'ffz-metadata-popup' && popup.dataset.key === key )
 						return;
 
-					var data = info.setup ? info.setup.apply(f, basic_info) : basic_info;
+					var data = info.setup ? info.setup.apply(f, basic_info) : basic_info.copy();
 					if ( ! (data instanceof Promise) )
 						data = Promise.resolve(data);
 
diff --git a/src/utils.js b/src/utils.js
index 95a1c1e2..b4dbd429 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -986,14 +986,14 @@ module.exports = FFZ.utils = {
 		minutes = Math.floor(seconds / 60);
 		seconds %= 60;
 
-		var out = (weeks ? weeks + (full_names ? ' week' + pluralize(weeks) + ', ' : 'w') : '') +
-			(days ? days + (full_names ? ' day' + pluralize(days) + ', ' : 'd') : '') +
-			(hours ? hours + (full_names ? ' hour' + pluralize(hours) + ', ' : 'h') : '') +
-			(minutes ? minutes + (full_names ? ' minute' + pluralize(minutes) + ', ' : 'm') : '') +
-			(seconds ? seconds + (full_names ? ' second' + pluralize(seconds) + ', ' : 's') : '');
+		var out = (weeks ? weeks + (full_names ? ' week' + pluralize(weeks) + ' ' : 'w') : '') +
+			(days ? days + (full_names ? ' day' + pluralize(days) + ' ' : 'd') : '') +
+			(hours ? hours + (full_names ? ' hour' + pluralize(hours) + ' ' : 'h') : '') +
+			(minutes ? minutes + (full_names ? ' minute' + pluralize(minutes) + ' ' : 'm') : '') +
+			(seconds ? seconds + (full_names ? ' second' + pluralize(seconds) + ' ' : 's') : '');
 
 		if ( full_names )
-			return out.substr(0, out.length - 2);
+			return out.substr(0, out.length - 1);
 
 		DURATIONS[val] = out;
 		return out;
diff --git a/style.css b/style.css
index 60075afd..4286b39a 100644
--- a/style.css
+++ b/style.css
@@ -290,34 +290,20 @@ body.ffz-bttv-dark .ffz-ui-toggle.blue.live:hover svg.svg-emoticons path { fill:
 
 /* Theater Mode hover bar */
 
-.ffz-theater-basic-stats .app-main.theatre .player-userinfo__game,
-.ffz-theater-basic-stats .app-main.theatre .player-controls-top {
+.ffz-theater-basic-stats .theatre .player-userinfo__game,
+.ffz-theater-basic-stats .theatre .player-controls-top {
 	display: block
 }
 
-/*.ffz-theater-stats .app-main.theatre .player-column:focus #hostmode > div.clearfix,
-.ffz-theater-stats .app-main.theatre .player-column:hover #hostmode > div.clearfix {
-	margin-bottom: 30px;
-}
+.ffz-theater-stats .theatre #main_col:hover .cn-hosting--bottom,
+.ffz-theater-stats .theatre #main_col:focus .cn-hosting--bottom,
+.ffz-theater-stats .theatre .cn-hosting--bottom:hover,
+.ffz-theater-stats .theatre .cn-hosting--bottom:focus,
 
-.ffz-theater-stats .app-main.theatre #channel .player-column:focus .archive_info + .stats-and-actions,
-.ffz-theater-stats .app-main.theatre #channel .player-column:hover .archive_info + .stats-and-actions {
-	display: none;
-}*/
-
-.ffz-theater-stats .app-main.theatre .player-column:hover .cn-hosting--bottom,
-.ffz-theater-stats .app-main.theatre .player-column:focus .cn-hosting--bottom,
-.ffz-theater-stats .app-main.theatre .cn-hosting--bottom:hover,
-.ffz-theater-stats .app-main.theatre .cn-hosting--bottom:focus,
-
-.ffz-theater-stats .app-main.theatre .player-column:hover + .metadata-box .cn-metabar__more,
-.ffz-theater-stats .app-main.theatre .player-column:focus + .metadata-box .cn-metabar__more,
-.ffz-theater-stats .app-main.theatre .cn-metabar__more:hover,
-.ffz-theater-stats .app-main.theatre .cn-metabar__more:focus /*,
-.ffz-theater-stats .app-main.theatre .player-column:focus #hostmode > div.clearfix,
-.ffz-theater-stats .app-main.theatre .player-column:hover #hostmode > div.clearfix,
-.ffz-theater-stats .app-main.theatre .player-column:focus .stats-and-actions,
-.ffz-theater-stats .app-main.theatre .player-column:hover .stats-and-actions */ {
+.ffz-theater-stats .theatre #main_col:hover .cn-metabar__more,
+.ffz-theater-stats .theatre #main_col:focus .cn-metabar__more,
+.ffz-theater-stats .theatre .cn-metabar__more:hover,
+.ffz-theater-stats .theatre .cn-metabar__more:focus {
 	background-color: rgba(25,25,31,0.95);
 
 	color: #aaa;
@@ -332,43 +318,43 @@ body.ffz-bttv-dark .ffz-ui-toggle.blue.live:hover svg.svg-emoticons path { fill:
 	flex-wrap: wrap;
 }
 
-.ffz-theater-stats .app-main.theatre .cn-hosting--bottom,
-.ffz-theater-stats .app-main.theatre .cn-metabar__more {
+.ffz-theater-stats .theatre .cn-hosting--bottom,
+.ffz-theater-stats .theatre .cn-metabar__more {
 	bottom: 55px;
 }
 
-.ffz-theater-stats:not(.ffz-theatre-conversations):not(.ffz-top-conversations) .app-main.theatre .cn-hosting--bottom,
-.ffz-theater-stats:not(.ffz-theatre-conversations):not(.ffz-top-conversations) .app-main.theatre .cn-metabar__more {
+.ffz-theater-stats:not(.ffz-theatre-conversations):not(.ffz-top-conversations) .theatre .cn-hosting--bottom,
+.ffz-theater-stats:not(.ffz-theatre-conversations):not(.ffz-top-conversations) .theatre .cn-metabar__more {
 	bottom: 95px;
 }
 
-.ffz-theater-stats .app-main.theatre .cn-metabar__more span,
-.ffz-theater-stats .app-main.theatre .cn-metabar__more div { flex-grow: 0 !important }
+.ffz-theater-stats .theatre .cn-metabar__more span,
+.ffz-theater-stats .theatre .cn-metabar__more div { flex-grow: 0 !important }
 
-.ffz-theater-stats .app-main.theatre .channel-stats .stat { color: #aaa; }
+.ffz-theater-stats .theatre .channel-stats .stat { color: #aaa; }
 
-.ffz-theater-stats .app-main.theatre .channel-stats span:not(.live-count) svg path {
+.ffz-theater-stats .theatre .channel-stats span:not(.live-count) svg path {
 	fill: rgba(255,255,255,0.35);
 }
 
-.ffz-theater-stats .app-main.theatre .follow-button .notify:before,
-.ffz-theater-stats .app-main.theatre .button.drop:after,
-.ffz-theater-stats .app-main.theatre .follow-button .drop.follow:after {
+.ffz-theater-stats .theatre .follow-button .notify:before,
+.ffz-theater-stats .theatre .button.drop:after,
+.ffz-theater-stats .theatre .follow-button .drop.follow:after {
 	border: 5px solid rgba(255,255,255,0.35);
 	border-left-color: transparent;
 	border-right-color: transparent;
 	border-bottom-color: transparent;
 }
 
-.ffz-theater-stats .app-main.theatre .follow-button .notify {
+.ffz-theater-stats .theatre .follow-button .notify {
 	background-color: #25252a;
 }
 
-.ffz-theater-stats .app-main.theatre .button.button--icon-only:not(.follow-button) svg path {
+.ffz-theater-stats .theatre .button.button--icon-only:not(.follow-button) svg path {
 	fill: #a68ed2;
 }
 
-.ffz-theater-stats .app-main.theatre .button.primary.subscribe-button {
+.ffz-theater-stats .theatre .button.primary.subscribe-button {
 	color: #fff;
 }
 
@@ -2736,36 +2722,36 @@ li[data-name="following"] a {
 	background: linear-gradient(to top, #252525, #666);
 }
 
-.ffz-classic-player .app-main.theatre .player .player-video,
+.ffz-classic-player .theatre .player .player-video,
 .ffz-classic-player .player[data-isfullscreen="true"] .player-video {
 	bottom: 0;
 }
 
-.ffz-classic-player .app-main.theatre .player .player-controls-bottom,
+.ffz-classic-player .theatre .player .player-controls-bottom,
 .ffz-classic-player .player[data-isfullscreen="true"] .player-controls-bottom {
 	margin-bottom: -32px;
 	-webkit-transition: margin-bottom .2s ease-out, padding-bottom .2s ease-out;
 	transition: margin-bottom .2s ease-out, padding-bottom .2s ease-out;
 }
 
-.ffz-classic-player:not(.ffz-top-conversations):not(.ffz-theatre-conversations) .app-main.theatre .player .player-controls-bottom,
-.ffz-classic-player:not(.ffz-top-conversations):not(.ffz-theatre-conversations) .app-main.theatre .player[data-controls=true] .player-controls-bottom,
-.ffz-classic-player .app-main.theatre .player[data-isfullscreen="true"] .player-controls-bottom,
-.ffz-classic-player .app-main.theatre .player[data-isfullscreen="true"][data-controls=true] .player-controls-bottom {
+.ffz-classic-player:not(.ffz-top-conversations):not(.ffz-theatre-conversations) .theatre .player .player-controls-bottom,
+.ffz-classic-player:not(.ffz-top-conversations):not(.ffz-theatre-conversations) .theatre .player[data-controls=true] .player-controls-bottom,
+.ffz-classic-player .theatre .player[data-isfullscreen="true"] .player-controls-bottom,
+.ffz-classic-player .theatre .player[data-isfullscreen="true"][data-controls=true] .player-controls-bottom {
 	padding-bottom: 0;
 }
 
-.ffz-classic-player .app-main.theatre .player.player-isvod .player-controls-bottom,
+.ffz-classic-player .theatre .player.player-isvod .player-controls-bottom,
 .ffz-classic-player .player.player-isvod[data-isfullscreen="true"] .player-controls-bottom {
 	margin-bottom: -36px;
 }
 
-.ffz-classic-player .app-main.theatre .player-column .player[data-controls=true] .player-controls-bottom,
+.ffz-classic-player .theatre .player[data-controls=true] .player-controls-bottom,
 .ffz-classic-player .player[data-isfullscreen="true"][data-controls="true"] .player-controls-bottom {
 	margin-bottom: 0;
 }
 
-.ffz-classic-player:not(.ffz-top-conversations):not(.ffz-theatre-conversations) .app-main.theatre .player[data-isfullscreen=false][data-controls=true] .player-controls-bottom {
+.ffz-classic-player:not(.ffz-top-conversations):not(.ffz-theatre-conversations) .theatre .player[data-isfullscreen=false][data-controls=true] .player-controls-bottom {
 	padding-bottom: 40px;
 }
 
@@ -3586,12 +3572,21 @@ body.ffz-bttv #ffz-feed-tabs .tabs { margin-bottom: 0 }
 	margin-right: 5px;
 }
 
+body:not(.ffz-minimal-channel-bar):not(.ffz-channel-bar-bottom) #channel {
+	padding-top: 75px;
+}
+
 .ffz-channel-title-top .cn-metabar__more { width: 100% }
 .ffz-channel-title-top #channel {
 	position: relative;
 	padding-top: 80px;
 }
 
+.ffz-channel-title-top:not(.ffz-minimal-channel-bar):not(.ffz-channel-bar-bottom) #channel {
+	padding-top: 135px;
+}
+
+
 .cn-hosting .ffz.card__layout .card__title { color: #9c9c9c }
 
 .cn-hosting .ffz.card__layout .card__title,
@@ -3605,6 +3600,10 @@ body.ffz-bttv #ffz-feed-tabs .tabs { margin-bottom: 0 }
 .ffz-hide-channel-banner .cn-cover { height: 0 !important }
 .ffz-minimal-channel-title.ffz-channel-title-top #channel { padding-top: 50px }
 
+.ffz-minimal-channel-title.ffz-channel-title-top:not(.ffz-minimal-channel-bar):not(.ffz-channel-bar-bottom) #channel {
+	padding-top: 100px;
+}
+
 .ffz-channel-title-top .ffz-channel.ffz-host { margin-top: -55px }
 .ffz-minimal-channel-title.ffz-channel-title-top .ffz-channel.ffz-host { margin-top: -25px }