3.5.459. Improve prefix detection for sub-emotes. Allow prefixes for FFZ and API emote sets. Dark CSS tweaks. Closes #127.

changelog.html

@@ -1,4 +1,11 @@
-<div class="list-header">3.5.458 <time datetime="2017-04-05">(2017-04-06)</time></div>
+<div class="list-header">3.5.459 <time datetime="2017-04-07">(2017-04-07)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Changed: Improved prefix detection for tab-completion of sub emotes.</li>
+	<li>Fixed: Darken an input box in the video manager.</li>
+	<li>API Added: <code>has_prefix</code> for emote sets and <code>prefix_length</code> for emote sets and emotes.</li>
+</ul>
+
+<div class="list-header">3.5.458 <time datetime="2017-04-06">(2017-04-06)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Changed: Display a disclaimer on the ITAD popup that purchases made on other websites don't earn Twitch Crates and don't support streamers. Those are both cool things and should be supported.</li>
 	<li>Fixed: Scrolling over the player could end up scrolling the page when the player is already above 90% volume or below 10% volume.</li>
@@ -49,11 +56,5 @@
 	<li>Fixed: Darken game detail pages.</li>
 </ul>
 
-<div class="list-header">3.5.449 <time datetime="2017-04-04">(2017-04-04)</time></div>
-<ul class="chat-menu-content menu-side-padding">
-	<li>Fixed: Bug with the emoticon menu for channels without FFZ emotes.</li>
-	<li>Fixed: Darken updated clips UI.</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

@@ -514,6 +514,29 @@ body.ffz-dark:not([data-page="teams#show"]),
 	border-top-color: rgba(255,255,255,0.25);
 }
 
+.ffz-dark .twitch_subwindow_container .card .text-content .content-header,
+.ffz-dark .kraken-embed .card .text-content .content-header,
+.ffz-dark .kraken-page .card .text-content .content-header,
+.ffz-dark .twitch_subwindow_container .card .buttons,
+.ffz-dark .kraken-embed .card .buttons,
+.ffz-dark .kraken-page .card .buttons,
+.ffz-dark .card-vod-edit {
+	border-color: #474747;
+}
+
+.ffz-dark .playlist-menu-create {
+	background-color: #101010;
+	border-color: #474747;
+}
+
+.ffz-dark .button--disabled {
+	background-color: #333;
+}
+
+.ffz-dark .card-vod-edit {
+	box-shadow: 0 2px 4px 0 rgba(255,255,255,0.1);
+}
+
 .ffz-dark #highlighter .highlight-content .form-container li label {
 	color: #fff;
 }

old_changes.html

@@ -1,3 +1,9 @@
+<div class="list-header">3.5.449 <time datetime="2017-04-04">(2017-04-04)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: Bug with the emoticon menu for channels without FFZ emotes.</li>
+	<li>Fixed: Darken updated clips UI.</li>
+</ul>
+
 <div class="list-header">3.5.448 <time datetime="2017-04-02">(2017-04-02)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Added: Setting to use the Bits Redesign images from April 1st, 2017.</li>

src/ember/chat-input.js

@@ -781,7 +781,8 @@ FFZ.prototype.modify_chat_input = function(component) {
 				tmi = in_conversation ? window.TMI && TMI._sessions && TMI._sessions[0] : room && room.tmiSession,
 
 				set_name, replacement, url, is_sub_set, fav_list,
-				emote_set, emote, emote_id, code, sort_factor,
+				emote_set, emote, emote_id, code, sort_factor, is_fav,
+				prefix_length, per_pref,
 
 				user = f.get_user(),
 				ffz_sets = f.getEmotes(user && user.login, room_id),
@@ -821,8 +822,12 @@ FFZ.prototype.modify_chat_input = function(component) {
 						if ( setting === 1 && ! is_sub_set )
 							continue;
 
+						prefix_length = f.settings.input_complete_without_prefix && is_sub_set ? utils.find_common_prefix(_.pluck(emote_set, 'code'), true) : 0;
 						sort_factor = is_sub_set ? 1 : 9;
 
+						if ( is_sub_set )
+							f.log("Sub Set: " + set_name + " -- Common Prefix: " + prefix_length + " [" + emote_set[0].code.substr(0, prefix_length) + "]", emote_set);
+
 						for(var i = 0; i < emote_set.length; i++) {
 							emote = emote_set[i];
 							if ( used_ids.indexOf(emote.id) !== -1 )
@@ -835,6 +840,8 @@ FFZ.prototype.modify_chat_input = function(component) {
 								(constants.EMOTE_REPLACEMENT_BASE + replacement) :
 								(constants.TWITCH_BASE + emote.id + "/1.0");
 
+							is_fav = fav_list.indexOf(emote.id) !== -1;
+
 							emotes.push({
 								type: 'emoticon',
 								label: code,
@@ -842,28 +849,26 @@ FFZ.prototype.modify_chat_input = function(component) {
 								sort: sort_factor,
 								image: url,
 								width: null,
-								favorite: fav_list.indexOf(emote.id) !== -1
+								favorite: is_fav
 							});
 
 							used_ids.push(emote.id);
 
-							if ( f.settings.input_complete_without_prefix && is_sub_set ) {
+							if ( prefix_length !== 0 ) {
-								// It's a sub emote, so try splitting off the end of the code.
+								// We have a common prefix, so make sure this emote is longer
-								// It's a bit weird, but people might like it. Also, make sure
+								// than the prefix length, and add it.
-								// we aren't just grabbing an initial capital.
+								var unprefixed = code.substr(prefix_length);
-								var unprefixed = code.substr(1).match(/[A-Z0-9](?:.+)?$/);
-								unprefixed = unprefixed ? unprefixed[0] : null;
 								if ( unprefixed )
 									emotes.push({
 										type: 'emoticon',
-										label: '<i>' + code.substr(0, code.length - unprefixed.length) + '</i>' + unprefixed,
+										label: '<i>' + code.substr(0, prefix_length) + '</i>' + unprefixed,
 										match: unprefixed,
 										content: code,
 										info: set_name,
 										sort: sort_factor,
 										image: url,
 										width: null,
-										favorite: fav_list.indexOf(emote.id) !== -1
+										favorite: is_fav
 									});
 							}
 						}
@@ -884,6 +889,11 @@ FFZ.prototype.modify_chat_input = function(component) {
 				set_name = (emote_set.source || "FFZ") + " " + (emote_set.title || "Global");
 				fav_list = f.settings.favorite_emotes[emote_set.hasOwnProperty('source_ext') ? 'ffz-ext-' + emote_set.source_ext + '-' + emote_set.source_id : 'ffz-' + emote_set.id] || [];
 
+				prefix_length = emote_set.prefix_length || 0;
+
+				if ( prefix_length === 0 && emote_set.has_prefix )
+					prefix_length = utils.find_common_prefix(_.pluck(emote_set.emoticons, 'name'), emote_set.has_prefix !== 2);
+
 				sort_factor = emote_set._type === 1 ? 3 : f.default_sets.indexOf(emote_set.id) === -1 ? 2 : 6;
 
 				for(emote_id in emote_set.emoticons) {
@@ -891,6 +901,8 @@ FFZ.prototype.modify_chat_input = function(component) {
 					if ( emote.hidden || ! emote.name || used_ids.indexOf(emote_id) !== -1 )
 						continue;
 
+					is_fav = fav_list.indexOf(emote.id) !== -1;
+
 					emotes.push({
 						type: "emoticon",
 						label: emote.name,
@@ -898,8 +910,28 @@ FFZ.prototype.modify_chat_input = function(component) {
 						sort: sort_factor,
 						image: emote.urls[1],
 						width: emote.width,
-						favorite: fav_list.indexOf(emote.id) !== -1
+						favorite: is_fav
 					});
+
+					per_pref = emote.hasOwnProperty('prefix_length') ? emote.prefix_length : prefix_length;
+
+					if ( per_pref !== 0 ) {
+						// We have a common prefix, so make sure this emote is longer
+						// than the prefix length, and add it.
+						var unprefixed = emote.name.substr(per_pref);
+						if ( unprefixed )
+							emotes.push({
+								type: "emoticon",
+								label: '<i>' + emote.name.substr(0, per_pref) + '</i>' + unprefixed,
+								match: unprefixed,
+								content: emote.name,
+								info: set_name,
+								sort: sort_factor,
+								image: emote.urls[1],
+								width: emote.width,
+								favorite: is_fav
+							});
+					}
 				}
 			}
 

src/main.js

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

src/utils.js

@@ -1066,6 +1066,23 @@ module.exports = FFZ.utils = {
 		}
 	},
 
+
+	find_common_prefix: function(list, lower_only) {
+		var p = 0,
+			l = list.length,
+			w = lower_only ? list[0].toLowerCase() : list[0];
+
+		while(true) {
+			var c = w[p];
+			for(var i=0; i < l; ++i)
+				if ( list[i][p] !== c)
+					return p;
+
+			++p;
+		}
+	},
+
+
 	utf8_encode: function(text) {
 		return unescape(encodeURIComponent(text))
 	},