From c76f5ab7f960456d8d59fb7a2d8d1c96faf174c3 Mon Sep 17 00:00:00 2001
From: SirStendec <sir@stendec.me>
Date: Tue, 9 May 2017 16:49:24 -0400
Subject: [PATCH] Most changes for 3.5.481. Closes #146.

---
 changelog.html                    | 46 ++++++++-------
 dark.css                          | 73 +++++++++++++++++++++++
 old_changes.html                  | 21 +++++++
 src/ember/channel.js              |  2 +-
 src/ember/commerce.js             |  7 ++-
 src/ember/line.js                 | 96 +++++++++++++++++++++++++------
 src/ember/moderation-card.js      | 23 ++++++--
 src/ember/room.js                 | 25 ++++----
 src/main.js                       |  2 +-
 src/settings.js                   |  2 +-
 src/styles/chat-hc-background.css |  1 +
 src/tokenize.js                   |  2 +-
 src/utils.js                      |  1 +
 style.css                         | 20 ++++++-
 14 files changed, 261 insertions(+), 60 deletions(-)

diff --git a/changelog.html b/changelog.html
index a63f2169..8146bd44 100644
--- a/changelog.html
+++ b/changelog.html
@@ -1,3 +1,28 @@
+<div class="list-header">3.5.481 <time datetime="2017-05-09">(2017-05-09)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: Don't display background colors on custom bits badges.</li>
+	<li>Fixed: Advanced settings search box styling.</li>
+	<li>Fixed: ITAD button showing in places it shouldn't.</li>
+	<li>Fixed: Only show the Friend Watching desktop notification for the channel you're watching if you have multiple chats pinned.</li>
+</ul>
+
+<div class="list-header">3.5.480 <time datetime="2017-05-03">(2017-05-03)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Added: Setting for displaying AutoMod actions in the same way as vanilla Twitch.</li>
+	<li>Changed: More dark mode tweaks for partner-specific pages.</li>
+</ul>
+
+<div class="list-header">3.5.479 <time datetime="2017-05-02">(2017-05-02)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Changed: You can now define in-line moderation icons that are usable even when you don't have moderation power over the user.</li>
+	<li>Fixed: Darken several pages related to subscriptions and bits settings for partners and affiliates.</li>
+</ul>
+
+<div class="list-header">3.5.478 <time datetime="2017-04-28">(2017-04-28)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: Twitch also broke linkification of channel titles when they removed the selector for the title element.</li>
+</ul>
+
 <div class="list-header">3.5.477 <time datetime="2017-04-28">(2017-04-28)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Fixed: Channel Title on Top setting breaking after Twitch removed specific selectors for that part of the page.</li>
@@ -51,26 +76,5 @@
 	<li>Fixed: Don't re-enable gray mode if a user has it specifically disabled and they enable dark mode via the Twitch chat settings menu.</li>
 </ul>
 
-<div class="list-header">3.5.470 <time datetime="2017-04-20">(2017-04-20)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Changed: More improved wording for the ITAD popup.</li>
-</ul>
-
-<div class="list-header">3.5.469 <time datetime="2017-04-20">(2017-04-20)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Changed: Add a bit more nagging when trying to buy from ITAD when a streamer would be supported.</li>
-</ul>
-
-<div class="list-header">3.5.468 <time datetime="2017-04-20">(2017-04-20)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Changed: Improved the wording for the disclaimer on the ITAD popup.</li>
-</ul>
-
-<div class="list-header">3.5.467 <time datetime="2017-04-11">(2017-04-11)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Added: Better tooltips for live followed channels in the social bar.</li>
-	<li>Fixed: Position of Channel Bar with Minimize Navigation, channel bar on top, and non-minimized channel bar. (Yes, debugging layout things is fun.)</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/dark.css b/dark.css
index c8dd823c..bd1fe646 100644
--- a/dark.css
+++ b/dark.css
@@ -181,6 +181,8 @@ body.ffz-dark:not([data-page="teams#show"]),
 	color: #000;
 }
 
+.ffz-dark .subdash-feature-notice,
+.ffz-dark #channel-prompt,
 .ffz-dark .balloon,
 .ffz-dark .balloon:after,
 .ffz-dark .conversation-settings-menu,
@@ -368,6 +370,7 @@ body.ffz-dark:not([data-page="teams#show"]),
 .ffz-dark .dropmenu_action:not(:hover) span,
 .ffz-dark .chat-menu-content button.font-color-purple,
 .ffz-dark .player a.player-text-link,
+.ffz-dark .cn-metabar .cn-metabar__title a,
 .ffz-dark a {
 /*.ffz-dark a:not(.profile-card__content):not(.filter-item):not(.ui-state-focus):not(.button):not(.switch):not(.follow):not(.fb_button):not(.what) {*/
 	color: #a68ed2;
@@ -389,6 +392,15 @@ body.ffz-dark:not([data-page="teams#show"]),
 
 .ffz-dark .exit-theatre > a { color: #000 !important; }
 
+.ffz-dark .cheermote-tier {
+	background-color: #111;
+	border-color: #474747;
+}
+
+.ffz-dark .progress-bar {
+	background-color: #444;
+}
+
 .ffz-dark .switch,
 .ffz-dark .button,
 .ffz-dark .pl-button--hollow,
@@ -557,6 +569,7 @@ body.ffz-dark:not([data-page="teams#show"]),
 
 /* Subscriptions Page */
 
+.ffz-dark .ticket__benefits,
 .ffz-dark .tickets .ticket .benefits {
 	background-color: rgb(16,16,16);
 	color: rgb(195,195,195); /*#acacbf;*/
@@ -606,6 +619,8 @@ body.ffz-dark:not([data-page="teams#show"]),
 	border-left-color: #6441a5;
 }
 
+.ffz-dark .form__input[type=checkbox] + label,
+.ffz-dark .form__input[type=radio] + label,
 .ffz-dark label,
 .ffz-dark code {
 	color: #999;
@@ -642,6 +657,30 @@ body.ffz-dark:not([data-page="teams#show"]),
 	color: #ccc;
 }
 
+.ffz-dark .subscription-dash .video-quality-list li.non-selectables .option,
+.ffz-dark .subscription-dash .video-quality-list li {
+	background-color: #191919;
+	border-color: #474747;
+}
+
+.ffz-dark .subscription-dash .video-quality-list li .quality-setting {
+	background-color: #000;
+}
+
+.ffz-dark .subscription-dash .video-quality-list li.selectable.over {
+	background-image: none;
+	background-color: #242424;
+}
+
+.ffz-dark .subscription-dash .video-quality-list li.selectable.restricted {
+	background-color: #cc2b2b;
+	border-color: #801b1b;
+}
+
+.ffz-dark .subscription-dash .video-quality-list li.selectable.restricted.over {
+	background-color: #fc3636;
+}
+
 .ffz-dark .card__info,
 .ffz-dark .items-grid .meta .info {
 	color: #6c6c6c;
@@ -650,6 +689,7 @@ body.ffz-dark:not([data-page="teams#show"]),
 .ffz-dark .mininav li > a,
 .ffz-dark ul.tabs li > a,
 .ffz-dark .directory_header .nav li > a,
+.ffz-dark .tw-tabs__item > button,
 .ffz-dark ul.tabs_fake li > a {
 	color: #a68ed2;
 }
@@ -674,12 +714,18 @@ body.ffz-dark:not([data-page="teams#show"]),
 	border-color: #32323e;
 }
 
+.ffz-dark .tw-tabs__item > button:hover,
 .ffz-dark .tw-tabs__item > a.active,
 .ffz-dark .tw-tabs__item > button.active {
 	color: #ccc;
 	box-shadow: 0 -1px 0 #ccc inset;
 }
 
+.ffz-dark .contract-amendments-window {
+	border-color: #474747;
+	background-color: #000;
+}
+
 .ffz-dark .game-details__nav > li > a.active { color: #fff }
 
 .ffz-dark .mininav li > a:hover,
@@ -895,6 +941,27 @@ body.ffz-dark:not([data-page="teams#show"]),
 	background-color: rgba(255,255,255,0.2);
 }
 
+.ffz-dark .subscription-dash .list-head th {
+	border-color: #474747;
+	color: #ccc;
+}
+
+.ffz-dark .subdash-feature-section,
+.ffz-dark .subdash-feature-header__back,
+.ffz-dark .subdash-feature-header,
+.ffz-dark .subdash-feature-row--border,
+.ffz-dark .cl-container .section-header .header-content.indented,
+.ffz-dark .cl-container .section-header .header-back {
+	border-color: rgba(255,255,255,0.2);
+}
+
+.ffz-dark .subdash-feature-header__back:hover,
+.ffz-dark .cl-container .section-header .header-back:hover {
+	background-color: rgba(255,255,255,0.2);
+}
+
+.ffz-dark .new-dashboard .dashboard-section .submit-button-fieldset,
+.ffz-dark .subdash-feature-header,
 .ffz-dark .cl-container .section-header,
 .ffz-dark .cl-container .cl-section .cl-subheader {
 	background-color: rgb(32,32,32);
@@ -911,10 +978,14 @@ body.ffz-dark:not([data-page="teams#show"]),
 	border-bottom-color: rgba(255,255,255,0.2);
 }
 
+.ffz-dark .cl-container fieldset .cl-input-container label { color: #fff }
+
+.ffz-dark .subdash-feature-row__title,
 .ffz-dark .cl-container fieldset .label-wrapper label {
 	color: #ccc;
 }
 
+.ffz-dark .subdash-feature,
 .ffz-dark #emoticons #emote_switch .set-button,
 .ffz-dark #example .line {
 	background-color: #19191f;
@@ -951,6 +1022,7 @@ body.ffz-dark:not([data-page="teams#show"]),
 	border-color: #fff;
 }
 
+.ffz-dark .card .brick,
 .ffz-dark .brick.brick--theme-grey,
 .ffz-dark .card-carousel__button:hover
 .ffz-dark .carousel__button:hover {
@@ -1704,6 +1776,7 @@ body.ffz-dark:not([data-page="teams#show"]),
 
 /* Video Uploads */
 
+.ffz-dark #video-manager .card > div[style],
 .ffz-dark .videos.uploads .card > div[style] {
 	background-color: #101010 !important;
 }
diff --git a/old_changes.html b/old_changes.html
index 4df36e78..ef38761f 100644
--- a/old_changes.html
+++ b/old_changes.html
@@ -1,3 +1,24 @@
+<div class="list-header">3.5.470 <time datetime="2017-04-20">(2017-04-20)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Changed: More improved wording for the ITAD popup.</li>
+</ul>
+
+<div class="list-header">3.5.469 <time datetime="2017-04-20">(2017-04-20)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Changed: Add a bit more nagging when trying to buy from ITAD when a streamer would be supported.</li>
+</ul>
+
+<div class="list-header">3.5.468 <time datetime="2017-04-20">(2017-04-20)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Changed: Improved the wording for the disclaimer on the ITAD popup.</li>
+</ul>
+
+<div class="list-header">3.5.467 <time datetime="2017-04-11">(2017-04-11)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Added: Better tooltips for live followed channels in the social bar.</li>
+	<li>Fixed: Position of Channel Bar with Minimize Navigation, channel bar on top, and non-minimized channel bar. (Yes, debugging layout things is fun.)</li>
+</ul>
+
 <div class="list-header">3.5.466 <time datetime="2017-04-11">(2017-04-11)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Fixed: Following Data feature not working for top navigation.</li>
diff --git a/src/ember/channel.js b/src/ember/channel.js
index 94442407..c482acb5 100644
--- a/src/ember/channel.js
+++ b/src/ember/channel.js
@@ -360,7 +360,7 @@ FFZ.prototype.modify_channel_live = function(view) {
 			if ( game === 'Creative' )
 				tokens = f.tokenize_ctags(tokens);
 
-			var el = this.$(".cn-metabar__title .card__title");
+			var el = this.$(".cn-metabar > div:first-child .js-card__title");
 			el && el.html(f.render_tokens(tokens));
 		}.observes('channel.id', 'channel.status', 'channel.game'),
 
diff --git a/src/ember/commerce.js b/src/ember/commerce.js
index 8ef3ea84..00ffdbd8 100644
--- a/src/ember/commerce.js
+++ b/src/ember/commerce.js
@@ -116,6 +116,9 @@ FFZ.prototype.modify_buy_game_now = function(view) {
 		itad_country: null,
 
 		ffz_init: function() {
+			if ( ! this.$().parents('.cmrc-game-details-box,.cmrc-channel-box').length || ! this.$('button').length )
+				return;
+
 			//f.log("Buy-Game-New Component", this);
 			this.itad_count = 0;
 			this.ffzUpdateITADPlain();
@@ -138,7 +141,7 @@ FFZ.prototype.modify_buy_game_now = function(view) {
 			if ( document.body.dataset.currentPath === 'directory.game-details' )
 				el = document.querySelector('.game-details__page-title');
 			else
-				el = document.querySelector('.card__info [data-tt_content="current_game"]');
+				el = document.querySelector('.js-card__info [data-tt_content="current_game"]');
 
 			var output = el ? _.pluck(_.filter(el.childNodes, function(x) { return x.nodeType === document.TEXT_NODE }), 'textContent').join(' ').trim() : null;
 
@@ -302,7 +305,7 @@ FFZ.prototype.modify_buy_game_now = function(view) {
 			// Add a by-line for IsThereAnyDeal.
 
 			var url = data[1].urls && data[1].urls.game || "https://isthereanydeal.com",
-				by_line = utils.createElement('span', 'ffz-attributiona',
+				by_line = utils.createElement('span', 'ffz-attributions',
 					'<hr>Source: <a rel="noreferrer" target="_blank" href="' + utils.quote_san(url) + '">IsThereAnyDeal.com</a><br><br>Any affiliate links in the provided data are the responsibility of IsThereAnyDeal and do not benefit FrankerFaceZ. You may consider visiting the store directly.' +
 					'<hr>Reminder: When you buy a game from other services, you miss out on the benefits of purchasing from Twitch directly including: supporting partnered streamers and earning <a target="_blank" href="https://blog.twitch.tv/twitch-crates-are-coming-soon-f50fa0cd4cdf">Twitch Crates</a> containing emotes and badges.');
 
diff --git a/src/ember/line.js b/src/ember/line.js
index a7747867..97bcf0fd 100644
--- a/src/ember/line.js
+++ b/src/ember/line.js
@@ -2,7 +2,7 @@
 	utils = require("../utils"),
 	constants = require("../constants"),
 
-	TB_TOOLTIP = '<hr>This message was flagged by AutoMod. Should it be allowed?',
+	TB_TOOLTIP = 'This message was flagged by AutoMod. Should it be allowed?',
 
 	BAN_SPLIT = /[\/\.](?:ban ([^ ]+)|timeout ([^ ]+)(?: (\d+))?|timeout_message ([^ ]+) ([^ ]+)(?: (\d+))?)(?: (.*))?$/;
 
@@ -11,6 +11,29 @@
 // Settings
 // ---------------------
 
+FFZ.settings_info.automod_inline = {
+	type: "boolean",
+	value: true,
+
+	category: "Chat Moderation",
+	no_bttv: 6,
+
+	name: "AutoMod In-Line Actions",
+	help: "Display AutoMod controls as in-line mod icons instead of space wasting buttons.",
+
+	on_update: function(val) {
+		var CL = utils.ember_resolve('component:chat/chat-line'),
+			views = CL ? utils.ember_views() : [];
+
+		for(var vid in views) {
+			var view = views[vid];
+			if ( view instanceof CL && view.ffzRender )
+				view.ffzRender();
+		}
+	}
+}
+
+
 FFZ.settings_info.friend_notifications = {
 	type: "boolean",
 	value: false,
@@ -841,7 +864,7 @@ FFZ.prototype._modify_chat_line = function(component, is_vod) {
 			}
 		}.property("msgObject.message", "isChannelLinksDisabled", "currentUserNick", "msgObject.from", "msgObject.tags.emotes"),
 
-		lineChanged: Ember.observer("msgObject.deleted", "isModeratorOrHigher", "msgObject.ffz_old_messages", "ffzTokenizedMessage", "hasClickedFlaggedMessage", function() {
+		lineChanged: Ember.observer("msgObject.deleted", "isModeratorOrHigher", "msgObject.ffz_old_messages", "ffzTokenizedMessage", function() {
 			this.$(".mod-icons").replaceWith(this.buildModIconsHTML());
 			if ( this.get("msgObject.deleted") ) {
 				this.$(".message").replaceWith(this.buildDeletedMessageHTML());
@@ -849,6 +872,13 @@ FFZ.prototype._modify_chat_line = function(component, is_vod) {
 				this.$(".deleted,.message").replaceWith(this.buildMessageHTML());
 		}),
 
+		clickedChanged: Ember.observer("hasClickedFlaggedMessage", function() {
+			if ( f.settings.automod_inline )
+				this.$(".mod-icons").replaceWith(this.buildModIconsHTML());
+			else
+				this.ffzRender();
+		}),
+
 		ffzUpdateBadges: function() {
 			this.$(".badges").html(f.render_badges(f.get_line_badges(this.get('msgObject'))));
 		},
@@ -889,37 +919,35 @@ 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 = (f.settings.mod_buttons.length === 0 && ! is_tb),
+				had_output = false,
 				output;
 
 			if ( ! is_pinned_cheer && shouldnt_show )
 				return '';
 
+			shouldnt_show = shouldnt_show || this_ul >= other_ul;
 			output = ['<span class="mod-icons">'];
 
-			if ( is_tb ) {
-				var clicked = this.get('hasClickedFlaggedMessage'),
-					inactive = clicked ? ' inactive' : '';
-
-				output.push('<a class="mod-icon html-tooltip tb-reject' + inactive + (clicked ? '' : '" title="Not Allowed' + TB_TOOLTIP) + '">Not Allowed</a>');
-				output.push('<a class="mod-icon html-tooltip tb-allow' + inactive + (clicked ? '' : '" title="Allowed' + TB_TOOLTIP) + '">Allowed</a>');
-			}
-
 			if ( is_pinned_cheer ) {
 				var parent = this.get('ffzPinnedParent');
+				had_output = true;
 				if ( parent && PinnedCheers && PinnedCheers.canDismissPinnedCheer(parent.get('userData.id'), parent.get('isViewerModeratorOrHigher')) )
 					output.push('<a class="mod-icon html-tooltip pc-dismiss" title="Dismiss for Everyone">Dismiss</a>');
 				if ( is_pinned_cheer !== 2 )
 					output.push('<a class="mod-icon html-tooltip pc-dismiss-local" title="Dismiss">Dismiss</a>');
 			}
 
-			if ( ! shouldnt_show )
+			if ( ! is_whisper )
 				for(var i=0, l = f.settings.mod_buttons.length; i < l; i++) {
 					var pair = f.settings.mod_buttons[i],
-						prefix = pair[0], btn = pair[1], had_label = pair[2], is_emoji = pair[3],
+						prefix = pair[0], btn = pair[1], had_label = pair[2], is_emoji = pair[3], non_mod = pair[4],
 
 						cmd, tip;
 
+					if ( ! non_mod && shouldnt_show )
+						continue;
+
 					if ( is_emoji ) {
 						var setting = f.settings.parse_emoji,
 							token = f.emoji_data[is_emoji],
@@ -937,6 +965,8 @@ FFZ.prototype._modify_chat_line = function(component, is_vod) {
 						}
 					}
 
+					had_output = true;
+
 					if ( btn === false ) {
 						if ( deleted )
 							output.push('<a class="mod-icon html-tooltip unban" title="Unban User" href="#">Unban</a>');
@@ -958,7 +988,16 @@ FFZ.prototype._modify_chat_line = function(component, is_vod) {
 					}
 				}
 
-			return output.join('') + '</span>';
+			if ( f.settings.automod_inline && is_tb ) {
+				var clicked = this.get('hasClickedFlaggedMessage'),
+					inactive = clicked ? ' inactive' : '';
+
+				had_output = true;
+				output.push('<a class="mod-icon html-tooltip tb-reject' + inactive + (clicked ? '' : '" title="Not Allowed<hr>' + TB_TOOLTIP) + '">Not Allowed</a>');
+				output.push('<a class="mod-icon html-tooltip tb-allow' + inactive + (clicked ? '' : '" title="Allowed<hr>' + TB_TOOLTIP) + '">Allowed</a>');
+			}
+
+			return had_output ? output.join('') + '</span>' : '';
 		},
 
 		buildFromHTML: function(is_recipient) {
@@ -1081,6 +1120,18 @@ FFZ.prototype._modify_chat_line = function(component, is_vod) {
 			return output + '</span>';
 		},
 
+		buildAutoModHTML: function() {
+			if ( this.get('hasClickedFlaggedMessage') )
+				return '<div class="system-msg">Thank you for your response!</div>';
+
+			return  '<p class="inline-warning">' + TB_TOOLTIP + '</p>' +
+				'<div class="pd-y-1 clearfix">' +
+					'<a class="button button--small button--alert float-left mg-r-1 tb-button" data-action="no">Deny</a>' +
+					'<a class="button button--small float-left mg-r-1 tb-button" data-action="yes">Allow</a>' +
+					'<a class="button button--small button--text float-left tb-button" data-action="not sure">Not Sure</a>' +
+				'</div>';
+		},
+
 		ffzRender: function() {
 			var el = this.get('element'),
 				output = '<div class="indicator"></div>';
@@ -1093,6 +1144,9 @@ FFZ.prototype._modify_chat_line = function(component, is_vod) {
 					this.buildDeletedMessageHTML() : this.buildMessageHTML();
 			}
 
+			if ( ! f.settings.automod_inline && this.get('msgObject.autoModRejected') )
+				output += this.buildAutoModHTML();
+
 			el.innerHTML = output;
 		},
 
@@ -1302,7 +1356,8 @@ FFZ.prototype._modify_chat_subline = function(component, is_whisper) {
 				return;
 
 			var cl = e.target.classList,
-				from = this.get("msgObject.from");
+				from = this.get("msgObject.from"),
+				msg_id = this.get("msgObject.tags.id");
 
 			/*if ( cl.contains('ffz-old-messages') )
 				return f._show_deleted(this.get('msgObject.room'));*/
@@ -1314,6 +1369,13 @@ FFZ.prototype._modify_chat_subline = function(component, is_whisper) {
 			} else if ( cl.contains('deleted-link') )
 				return f._deleted_link_click.call(e.target, e);
 
+			else if ( cl.contains('tb-button') ) {
+				jQuery(e.target).trigger('mouseout');
+				e.preventDefault();
+				this.actions.clickedAutoModResponse.call(this, msg_id, e.target.dataset.action);
+
+			}
+
 			else if ( cl.contains('mod-icon') ) {
 
 				jQuery(e.target).trigger('mouseout');
@@ -1332,10 +1394,10 @@ FFZ.prototype._modify_chat_subline = function(component, is_whisper) {
 					);
 
 				else if ( cl.contains('tb-reject') )
-					this.actions.clickedAutoModResponse.call(this, this.get('msgObject.tags.id'), 'no');
+					this.actions.clickedAutoModResponse.call(this, msg_id, 'no');
 
 				else if ( cl.contains('tb-allow') )
-					this.actions.clickedAutoModResponse.call(this, this.get('msgObject.tags.id'), 'yes');
+					this.actions.clickedAutoModResponse.call(this, msg_id, 'yes');
 
 				else if ( ! from )
 					return;
diff --git a/src/ember/moderation-card.js b/src/ember/moderation-card.js
index d91d4b05..ddb2ba3a 100644
--- a/src/ember/moderation-card.js
+++ b/src/ember/moderation-card.js
@@ -381,7 +381,7 @@ FFZ.settings_info.mod_buttons = {
 
 		for(var i=0; i < this.settings.mod_buttons.length; i++) {
 			var pair = this.settings.mod_buttons[i],
-				prefix = pair[0], cmd = pair[1], had_prefix = pair[2];
+				prefix = pair[0], cmd = pair[1], had_prefix = pair[2], non_mod = pair[4];
 
 			if ( cmd === false )
 				cmd = "/ban";
@@ -391,7 +391,7 @@ FFZ.settings_info.mod_buttons = {
 				cmd = '' + cmd;
 
 			prefix = had_prefix ? 'name:' + prefix + '=' : '';
-			old_val += (old_val.length ? '\n' : '') + prefix + cmd;
+			old_val += (old_val.length ? '\n' : '') + (non_mod ? 'nonmod:' : '') + prefix + cmd;
 		}
 
 		utils.prompt(
@@ -406,6 +406,10 @@ FFZ.settings_info.mod_buttons = {
 				"name of the button. End the name with an equals sign. Only the first character will be displayed.<br>" +
 				"<strong>Example:</strong> <code>name:B=/ban {user}</code><hr>" +
 
+				"To create a button that will be visible even if you don't have moderator privileges over a user, " +
+				"start your line with <code>nonmod:</code><br>" +
+				"<strong>Example:</strong> <code>nonmod:/w some_bot !info {user}</code><hr>" +
+
 				"<strong>Allowed Variables</strong><br><table><tbody>" +
 				"<tr><td><code>{user}</code></td><td>target user's name</td>" +
 				"<td><code>{user_name}</code></td><td>target user's name</td></tr>" +
@@ -430,11 +434,15 @@ FFZ.settings_info.mod_buttons = {
 					var cmd = vals[i],
 						prefix,
 						is_emoji = false,
-						name_match = /^name:([^=]+)=/.exec(cmd);
+						non_mod = /^nonmod:/.test(cmd);
 
 					if ( ! cmd || ! cmd.length )
 						continue;
 
+					if ( non_mod )
+						cmd = cmd.substr(7).trim();
+
+					var name_match = /^name:([^=]+)=/.exec(cmd);
 					if ( name_match ) {
 						label = name_match[1];
 
@@ -447,6 +455,13 @@ FFZ.settings_info.mod_buttons = {
 							is_emoji = tokens[0].ffzEmoji;
 
 						cmd = cmd.substr(name_match[0].length).trim();
+
+						if ( ! non_mod ) {
+							non_mod = /^nonmod:/.test(cmd);
+							if ( non_mod )
+								cmd = cmd.substr(7).trim();
+						}
+
 					} else
 						label = undefined;
 
@@ -487,7 +502,7 @@ FFZ.settings_info.mod_buttons = {
 						}
 					}
 
-					output.push([label, cmd, name_match != null, is_emoji]);
+					output.push([label, cmd, name_match != null, is_emoji, non_mod]);
 				}
 
 				f.settings.set('mod_buttons', output);
diff --git a/src/ember/room.js b/src/ember/room.js
index 5ae8df59..c02b5572 100644
--- a/src/ember/room.js
+++ b/src/ember/room.js
@@ -1330,17 +1330,20 @@ FFZ.prototype._modify_room = function(room) {
 		},
 
 		addFriendsWatchingMessage: function(msg) {
-			if ( f.settings.friend_notifications && ! document.hasFocus() )
-				f.show_notification(
-					msg.replace(/ *VoHiYo$/g, ''),
-					document.title,
-					"ffz_watching_notice",
-					(this.settings.notification_timeout*1000),
-					function() {
-						window.focus();
-					},
-					null,
-					'https://static-cdn.jtvnw.net/emoticons/v1/81274/3.0');
+			if ( f.settings.friend_notifications && ! document.hasFocus() ) {
+				var Chat = utils.ember_lookup('controller:chat');
+				if ( Chat && Chat.get('currentChannelRoom') === this )
+					f.show_notification(
+						msg.replace(/ *VoHiYo$/g, ''),
+						(this.get('channel.display_name') || this.get('id')) + " - Twitch",
+						"ffz_watching_notice",
+						(this.settings.notification_timeout*1000),
+						function() {
+							window.focus();
+						},
+						null,
+						'https://static-cdn.jtvnw.net/emoticons/v1/81274/3.0');
+			}
 
 			this.addMessage({
 				style: 'admin' + (f.has_bttv_6 ? '' : ' friend-watching'),
diff --git a/src/main.js b/src/main.js
index 9e256e1e..a9ec608c 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: 477,
+	major: 3, minor: 5, revision: 480,
 	toString: function() {
 		return [VER.major, VER.minor, VER.revision].join(".") + (VER.extra || "");
 	}
diff --git a/src/settings.js b/src/settings.js
index 71a9b872..02111951 100644
--- a/src/settings.js
+++ b/src/settings.js
@@ -234,7 +234,7 @@ var is_android = navigator.userAgent.indexOf('Android') !== -1,
 			// Searching!
 			if ( show_pin ) {
 				var search_cont = utils.createElement('div', 'ffz-filter-container'),
-					search_input = utils.createElement('input', 'emoticon-selector__filter-input js-filter-input text text--full-width'),
+					search_input = utils.createElement('input', 'emoticon-selector__filter-input form__input js-filter-input text text--full-width'),
 					filtered_cont = utils.createElement('div', 'ffz-filter-children ffz-ui-sub-menu-page');
 
 				search_input.placeholder = 'Search for Settings';
diff --git a/src/styles/chat-hc-background.css b/src/styles/chat-hc-background.css
index 1b26fd77..58f1ee98 100644
--- a/src/styles/chat-hc-background.css
+++ b/src/styles/chat-hc-background.css
@@ -12,6 +12,7 @@ body.ffz-bttv .chat-messages,
 body.ffz-bttv-dark .chat-messages,
 body.ffz-bttv-dark .chat-header,
 body.ffz-bttv-dark .chat-interface,
+body.ffz-bttv-dark .ember-chat.roomMode,
 .theatre .chat-container,
 .theatre .ember-chat-container,
 .chat-container.dark,
diff --git a/src/tokenize.js b/src/tokenize.js
index 52501df5..1cf18bfb 100644
--- a/src/tokenize.js
+++ b/src/tokenize.js
@@ -1125,7 +1125,7 @@ FFZ.prototype.render_token = function(render_links, warn_links, render_bits, tok
 			return 'cheer' + token.amount;
 
 		var prefix = utils.quote_attr(token.prefix);
-		return '<span class="emoticon ffz-bit ffz-tooltip bit-prefix-' + prefix + ' bit-tier-' + tier[0] + '"' + (token.individuals ? ' data-individuals="' + utils.quote_attr(JSON.stringify(token.individuals)) + '"' : '') + ' data-prefix="' + prefix + '" data-amount="' + utils.number_commas(token.amount) + '" alt="cheer' + token.amount + '"></span>';
+		return '<span class="emoticon js-bits-emote-image ffz-bit ffz-tooltip bit-prefix-' + prefix + ' bit-tier-' + tier[0] + '"' + (token.individuals ? ' data-individuals="' + utils.quote_attr(JSON.stringify(token.individuals)) + '"' : '') + ' data-prefix="' + prefix + '" data-amount="' + utils.number_commas(token.amount) + '" alt="cheer' + token.amount + '"></span>';
 	}
 
 	else if ( token.type === 'bits-tag' ) {
diff --git a/src/utils.js b/src/utils.js
index 8bdaa98c..b07ffb5b 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -1180,6 +1180,7 @@ module.exports = FFZ.utils = {
 
 		return (loyalty ? '.ffz-no-loyalty ' : '') + '.from-display-preview[data-room="' + room_id + '"] .badge.' + badge_id + (loyalty ? '' : '.version-' + version) +
 				(loyalty ? ',.ffz-no-loyalty ' : ',') + '.chat-line[data-room="' + room_id + '"] .badge.' + badge_id + (loyalty ? '' : '.version-' + version) + '{' +
+			'background-color:transparent;' +
 			'background-image:url("' + img_1x + '");' +
 			'background-image:' + WEBKIT + 'image-set(url("' + img_1x + '") 1x' + (img_2x ? ',url("' + img_2x + '") 2x' : '') + (img_4x ? ',url("' + img_4x + '") 4x' : '') + ')}';
 	},
diff --git a/style.css b/style.css
index 8051d011..e16d36a8 100644
--- a/style.css
+++ b/style.css
@@ -18,10 +18,15 @@ body > div.tipsy .tipsy-arrow { opacity: 0.8; }
 	cursor: pointer;
 }
 
+.app-main.has-sc .dash-dragula { height: calc(100vh - 18rem); }
+.ffz-sidebar-minimize .app-main.has-sc .dash-dragula { height: calc(100vh - 14rem) }
+
+.ffz-minimal-dashboard[data-current-path="user.dashboards.index"] .app-main.has-sc { top: 0 }
 .ffz-minimal-dashboard[data-current-path="user.dashboards.index"] #main_col { margin: 0 !important }
 .ffz-minimal-dashboard[data-current-path="user.dashboards.index"] .dash-dragula { height: calc(100vh - 70px) }
 .ffz-minimize-conversations.ffz-minimal-dashboard[data-current-path="user.dashboards.index"] .dash-dragula { height: calc(100vh - 50px) }
 
+
 .ffz-hide-thumb-info-on-hover .stream.item:hover .boxart,
 .ffz-hide-thumb-info-on-hover .stream.item:hover .overlay_info,
 .ffz-hide-thumb-info-on-hover .stream.item:hover .card__meta,
@@ -31,10 +36,12 @@ body > div.tipsy .tipsy-arrow { opacity: 0.8; }
 .ffz-hide-thumb-info-on-hover .video.item:hover .progress-bar-wrapper,
 .ffz-hide-thumb-info-on-hover .card-carousel__item:hover .card__boxpin,
 
+.player[data-paused="false"] #js-follow-panel,
 body:not(.ffz-theater-basic-stats) .player-userinfo__game,
 body:not(.ffz-theater-basic-stats) .player-controls-top,
 .moderation-card__actions:not(.loading):empty,
 .ffz-hide-purchase-game .cmrc-channel-box,
+.ffz-minimal-dashboard[data-current-path="user.dashboards.index"] .top-nav,
 .ffz-minimal-dashboard[data-current-path="user.dashboards.index"] #left_col,
 .ffz-minimal-dashboard[data-current-path="user.dashboards.index"] #left_close,
 .ffz-minimal-dashboard[data-current-path="user.dashboards.index"] #right_col,
@@ -387,6 +394,7 @@ body.ffz-bttv-dark .ffz-ui-toggle.blue.live:hover svg.svg-emoticons path { fill:
 	fill: #a68ed2;
 }
 
+.chat-container.dark .chat-line .button,
 .ffz-theater-stats .theatre .button.primary.subscribe-button {
 	color: #fff;
 }
@@ -1608,6 +1616,13 @@ body:not(.ffz-bttv) .chat-container:not(.chatReplay) .more-messages-indicator {
 
 /* Emoticon Tooltips */
 
+#ffz-price-popup hr,
+.ffz-subwindow hr {
+	border-bottom-width: 1px;
+	border-bottom-style: solid;
+	margin: 10px 0;
+}
+
 .ffz-wide-tip hr {
 	margin: 5px 0;
 }
@@ -3629,7 +3644,10 @@ body.ffz-bttv #ffz-feed-tabs .tabs { margin-bottom: 0 }
 	border-top: 1px solid rgba(0,0,0,0.2);
 }
 
-.ffz-ui-menu-page input.js-filter-input { margin: 0 }
+.ffz-ui-menu-page input.js-filter-input {
+	margin: 0;
+	width: calc(100% - 2rem);
+}
 
 .bttv-incompatibility b + b:before {
 	content: ', ';