3.5.423. Add option to hide boxart on hover to directory. Add support for new bits badge tiers. Reduce data stored for local chat history cache. Don't hide AutoMod buttons when a message is handled to prevent mis-clicks. Closes #77

changelog.html

@@ -1,3 +1,12 @@
+<div class="list-header">3.5.423 <time datetime="2017-01-30">(2017-01-30)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Added: Option to hide boxart when hovering streams and videos in the directory.</li>
+	<li>Added: Support for the new tiers of bits badges.</li>
+	<li>Changed: By default, do not store locally cached user chat history for rooms that have logviewer.</li>
+	<li>Changed: Store less data for locally cached user chat history.</li>
+	<li>Fixed: Do not hide AutoMod buttons when a message has been dealt with. Only make them inactive, potentially preventing mis-clicks. (Thanks, Seldszar!)</li>
+</ul>
+
 <div class="list-header">3.5.422 <time datetime="2017-01-27">(2017-01-27)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Fixed: Re-sub notifications appearing with a white background within dark chat.</li>
@@ -55,11 +64,5 @@
 	<li>This FFZ update brought to you by my AGDQ hotel room.</li>
 </ul>
 
-<div class="list-header">3.5.413 <time datetime="2017-01-05">(2017-01-05)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Fixed: Schedule rendering could goof up if a category was very long, leading to horizontal scrolling.</li>
-	<li>Changed: Refactor some bits stuff to potentially fix things if they potentially break.</li>
-</ul>
-
 <div class="list-header" id="ffz-old-news-button"><a href="#">View Older</a></div>
 <div id="ffz-old-news"></div>

dark.css

@@ -33,6 +33,7 @@
 
 
 /* hidden chat */
+.ffz-dark .card__img,
 .ffz-dark .ember-chat .chat-hidden-overlay{
 	background-color:rgb(24,24,24)!important;
 }

old_changes.html

@@ -1,3 +1,9 @@
+<div class="list-header">3.5.413 <time datetime="2017-01-05">(2017-01-05)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: Schedule rendering could goof up if a category was very long, leading to horizontal scrolling.</li>
+	<li>Changed: Refactor some bits stuff to potentially fix things if they potentially break.</li>
+</ul>
+
 <div class="list-header">3.5.412 <time datetime="2017-01-01">(2017-01-01)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Changed: Do not push the entire event schedule to the client every time there's an update.</li>

src/badges.js

@@ -22,7 +22,19 @@ var FFZ = window.FrankerFaceZ,
 			1000: { color: "#3ed8b3" },
 			5000: { color: "#49acff" },
 			10000: { color: "#ff271e" },
-			100000: { color: "#ffcb13" }
+			25000: { color: "#f560ab" },
+			50000: { color: "#ff881f" },
+			75000: { color: "#16d03d" },
+			100000: { color: "#ffcb13" },
+			200000: { color: "#cbc8d0" },
+			300000: { color: "#c97ffd" },
+			400000: { color: "#3dd8b3" },
+			500000: { color: "#48acfe" },
+			600000: { color: "#ff281f" },
+			700000: { color: "#f560ab" },
+			800000: { color: "#ff881f" },
+			900000: { color: "#16d03d" },
+			1000000: { color: "#fecb11" }
 		}
 	},
 

src/ember/directory.js

@@ -200,6 +200,20 @@ FFZ.settings_info.directory_uploads_position = {
 };
 
 
+FFZ.settings_info.directory_hide_info_on_hover = {
+	type: "boolean",
+	value: false,
+
+	category: "Directory",
+	no_mobile: true,
+
+	name: "Hide Boxart on Hover",
+	help: "Do not display boxart and other information over a stream or video's thumbnail when hovering over it.",
+
+	on_update: utils.toggle_cls('ffz-hide-thumb-info-on-hover')
+}
+
+
 // --------------------
 // Initialization
 // --------------------
@@ -210,6 +224,7 @@ FFZ.prototype.setup_directory = function() {
 	utils.toggle_cls('ffz-creative-tags')(this.settings.directory_creative_all_tags);
 	utils.toggle_cls('ffz-creative-showcase')(this.settings.directory_creative_showcase);
 	utils.toggle_cls('ffz-hide-directory-uploads')(this.settings.directory_uploads_position === 2);
+	utils.toggle_cls('ffz-hide-thumb-info-on-hover')(this.settings.directory_hide_info_on_hover);
 
 	var f = this,
 		VodCoviews = utils.ember_lookup('service:vod-coviews');

src/ember/line.js

@@ -810,9 +810,12 @@ FFZ.prototype._modify_chat_line = function(component, is_vod) {
 
 			output = ['<span class="mod-icons">'];
 
-			if ( is_tb && ! this.get('hasClickedFlaggedMessage') ) {
+			if ( is_tb ) {
-				output.push('<a class="mod-icon html-tooltip tb-reject" title="Not Allowed' + TB_TOOLTIP + '">Not Allowed</a>');
+				var clicked = this.get('hasClickedFlaggedMessage'),
-				output.push('<a class="mod-icon html-tooltip tb-allow" title="Allowed' + TB_TOOLTIP + '">Allowed</a>');
+					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 ) {
@@ -1201,7 +1204,10 @@ FFZ.prototype._modify_chat_subline = function(component, is_whisper) {
 				jQuery(e.target).trigger('mouseout');
 				e.preventDefault();
 
-				if ( cl.contains('pc-dismiss-local') )
+				if ( cl.contains('inactive') )
+					return;
+
+				else if ( cl.contains('pc-dismiss-local') )
 					PinnedCheers.dismissLocalMessage();
 
 				else if ( cl.contains('pc-dismiss') )

src/ember/moderation-card.js

@@ -233,8 +233,15 @@ FFZ.settings_info.timeout_notices = {
 
 
 FFZ.settings_info.mod_card_history = {
-	type: "boolean",
+	type: "select",
-	value: false,
+	options: {
+		0: "Disabled",
+		1: "On Rooms without Logviewer",
+		2: "Always"
+	},
+
+	value: 0,
+	process_value: utils.process_int(0, 0, 1),
 
 	no_bttv: true,
 	category: "Chat Moderation",
@@ -243,13 +250,13 @@ FFZ.settings_info.mod_card_history = {
 	help: "Display a few of the user's previously sent messages on moderation cards.",
 
 	on_update: function(val) {
-		if ( val || ! this.rooms )
+		if ( val === 2 || ! this.rooms )
 			return;
 
 		// Delete all history~!
 		for(var room_id in this.rooms) {
 			var room = this.rooms[room_id];
-			if ( room )
+			if ( room && (val === 0 || room.has_logs) )
 				room.user_history = undefined;
 		}
 	}
@@ -1527,9 +1534,9 @@ FFZ.prototype._build_mod_card_history = function(msg, modcard, show_from, ts_cli
 		colored = '';
 	}
 
-
+	var tokens = this.tokenize_chat_line(msg, true, false, true),
-	var message = '<span class="message' + colored + '" style="' + style + (colors ? '" data-color="' + raw_color : '') + '">' +
+		message = '<span class="message' + colored + '" style="' + style + (colors ? '" data-color="' + raw_color : '') + '">' +
-			(msg.style === 'action' && ! show_from ? '*' + name + ' ' : '') + this.render_tokens(msg.cachedTokens, true, false, msg.tags && msg.tags.bits) + '</span>';
+			(msg.style === 'action' && ! show_from ? '*' + name + ' ' : '') + this.render_tokens(tokens, true, false, msg.tags && msg.tags.bits) + '</span>';
 
 	if ( msg.deleted )
 		out.push('<span class="deleted"><a class="undelete" href="#" data-message="' + utils.quote_attr(message) + '">&lt;message deleted&gt;</a></span>');

src/ember/room.js

@@ -1029,6 +1029,10 @@ FFZ.prototype.add_room = function(room_id, room) {
 
 		data.has_logs = response.has_logs;
 		data.log_source = response.log_source;
+
+		if ( f.settings.mod_card_history === 1 )
+			data.user_history = undefined;
+
 	}, true);
 
 	// Is the room important?
@@ -1481,25 +1485,43 @@ FFZ.prototype._modify_room = function(room) {
 
 		addUserHistory: function(message) {
 			var room_id = this.get('id'),
+				is_group = this.get('isGroupRoom'),
+				setting = f.settings.mod_card_history,
 				ffz_room = f.rooms[room_id];
 
-			if ( ! ffz_room || ! f.settings.mod_card_history )
+			if ( is_group || ! ffz_room || setting === 0 || (setting === 1 && ffz_room.has_logs) )
 				return;
 
 			var username = message.ffz_ban_target || message.from,
 				historical = message.tags && message.tags.historical,
 
 				chat_history = ffz_room.user_history = ffz_room.user_history || {},
-				user_history = chat_history[username] = chat_history[username] || [];
+				user_history = chat_history[username] = chat_history[username] || [],
+
+				// Don't store any computed values that would take a lot of memory.
+				old_tags = message.tags || {},
+				cache_object = {
+					date: message.date,
+					from: message.from,
+					room: message.room,
+					message: message.message,
+					style: message.style,
+					tags: {
+						emotes: old_tags.emotes,
+						bits: old_tags.bits,
+						'display-name': old_tags['display-name'],
+						id: old_tags.id
+					}
+				};
 
 			if ( historical ) {
 				if ( user_history.length >= 20 )
 					return;
 
-				user_history.unshift(message);
+				user_history.unshift(cache_object);
 
 			} else {
-				user_history.push(message);
+				user_history.push(cache_object);
 				while ( user_history.length > 20 )
 					user_history.shift();
 			}
@@ -1510,7 +1532,7 @@ FFZ.prototype._modify_room = function(room) {
 
 				if ( history ) {
 					var was_at_top = history.scrollTop >= (history.scrollHeight - history.clientHeight),
-						line = f._build_mod_card_history(message, f._mod_card);
+						line = f._build_mod_card_history(cache_object, f._mod_card);
 
 					if ( historical )
 						history.insertBefore(line, history.firstElementChild);
@@ -2086,18 +2108,7 @@ FFZ.prototype._modify_room = function(room) {
 
 			// Keep the history.
 			if ( ! is_whisper && msg.from && msg.from !== 'jtv' && msg.from !== 'twitchnotify' )
-				this.addUserHistory({
+				this.addUserHistory(msg);
-					from: msg.from,
-					tags: {
-						id: msg.tags && msg.tags.id,
-						'display-name': msg.tags && msg.tags['display-name'],
-						bits: msg.tags && msg.tags.bits
-					},
-					message: msg.message,
-					cachedTokens: msg.cachedTokens,
-					style: msg.style,
-					date: msg.date
-				});
 
 			// Clear the last ban for that user.
 			var f_room = f.rooms && f.rooms[msg.room],

src/main.js

@@ -61,7 +61,7 @@ FFZ.channel_metadata = {};
 
 // Version
 var VER = FFZ.version_info = {
-	major: 3, minor: 5, revision: 422,
+	major: 3, minor: 5, revision: 423,
 	toString: function() {
 		return [VER.major, VER.minor, VER.revision].join(".") + (VER.extra || "");
 	}

src/tokenize.js

@@ -678,8 +678,8 @@ FFZ.prototype._tokenize_bits = function(tokens) {
 }
 
 
-FFZ.prototype.tokenize_chat_line = function(msgObject, prevent_notification, delete_links) {
+FFZ.prototype.tokenize_chat_line = function(msgObject, prevent_notification, delete_links, disable_cache) {
-	if ( msgObject.cachedTokens )
+	if ( msgObject.cachedTokens && ! disable_cache )
 		return msgObject.cachedTokens;
 
 	var msg = msgObject.message,
@@ -858,7 +858,9 @@ FFZ.prototype.tokenize_chat_line = function(msgObject, prevent_notification, del
 	// Tokenize users last.
 	tokens = this.tokenize_users(tokens);
 
-	msgObject.cachedTokens = tokens;
+	if ( ! disable_cache )
+		msgObject.cachedTokens = tokens;
+
 	return tokens;
 }
 

style.css

@@ -22,6 +22,15 @@ body > div.tipsy .tipsy-arrow { opacity: 0.8; }
 .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,
+.ffz-hide-thumb-info-on-hover .video.item:hover .boxart,
+.ffz-hide-thumb-info-on-hover .video.item:hover .overlay_info,
+.ffz-hide-thumb-info-on-hover .video.item:hover .card__meta,
+.ffz-hide-thumb-info-on-hover .video.item:hover .progress-bar-wrapper,
+.ffz-hide-thumb-info-on-hover .card-carousel__item:hover .card__boxpin,
+
 .cn-bar-spacer.show,
 .ffz-minimal-dashboard[data-current-path="user.dashboards.index"] #left_col,
 .ffz-minimal-dashboard[data-current-path="user.dashboards.index"] #left_close,
@@ -694,6 +703,7 @@ body.ffz-bttv-dark .ffz-ui-toggle.blue.live:hover svg.svg-emoticons path { fill:
 	margin: 11px 13px;
 }
 
+.player-menu__menu,
 .ffz-ui-sub-menu-page,
 .ffz-ui-menu-page { overflow-y: auto; }
 
@@ -1161,6 +1171,7 @@ body:not(.ffz-bttv) .dropmenu.share { margin-bottom: 0; }
 
 /* Menu Scrollbar */
 
+.player-menu__menu::-webkit-scrollbar,
 .dash-column::-webkit-scrollbar,
 #ffz-metadata-popup .scroller::-webkit-scrollbar,
 .search-panel .collection-wrapper::-webkit-scrollbar,
@@ -1180,6 +1191,7 @@ body:not(.ffz-bttv) .dropmenu.share { margin-bottom: 0; }
 	width: 6px;
 }
 
+.player-menu__menu::-webkit-scrollbar-thumb,
 .dash-column::-webkit-scrollbar-thumb,
 #ffz-metadata-popup .scroller::-webkit-scrollbar-thumb,
 .search-panel .collection-wrapper::-webkit-scrollbar-thumb,
@@ -1200,6 +1212,8 @@ body:not(.ffz-bttv) .dropmenu.share { margin-bottom: 0; }
 	box-shadow: 0 0 1px 1px rgba(255,255,255,0.25);
 }
 
+.ffz-dark .player-menu__menu::-webkit-scrollbar-thumb,
+
 .ffz-dark .dash-column::-webkit-scrollbar-thumb,
 .theatre .dash-column::-webkit-scrollbar-thumb,
 
@@ -1510,6 +1524,11 @@ body:not(.ffz-hide-friends) .ffz-moderation-card .follow-button {
 	line-height: 30px;
 }
 
+.mod-icon.inactive {
+	opacity: 0.25;
+	filter: grayscale(1);
+}
+
 .chat-line.ffz-deleted > span {
 	opacity: 0.5;
 }