Extend the emote_set data structure to support merging add-on emote sets in the emote menu, as well as forcing emote sets to render on both the Channel and All Emotes tabs.

changelog.html

@@ -1,3 +1,8 @@
+<div class="list-header">4.0.0-rc1.10<span>@d27dc686044b45c844e4</span> <time datetime="2018-05-21">(2018-05-21)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Changed: Add requested emote data support for merging emote sets and forcing certain emote sets to appear on the Channel tab of the emote menu.</li>
+</ul>
+
 <div class="list-header">4.0.0-rc1.9<span>@d5a7ef61195e86dc7277</span> <time datetime="2018-05-18">(2018-05-18)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Fixed: Add support for minimal root pages to the new webpack 4 code. They don't use the same router.</li>

src/main.js

@@ -100,7 +100,7 @@ class FrankerFaceZ extends Module {
 FrankerFaceZ.Logger = Logger;
 
 const VER = FrankerFaceZ.version_info = {
-	major: 4, minor: 0, revision: 0, extra: '-rc1.9',
+	major: 4, minor: 0, revision: 0, extra: '-rc1.10',
 	build: __webpack_hash__,
 	toString: () =>
 		`${VER.major}.${VER.minor}.${VER.revision}${VER.extra || ''}${DEBUG ? '-dev' : ''}`

src/modules/main_menu/components/home-page.vue

@@ -29,21 +29,16 @@
 				<ul class="tw-mg-b-2">
 					<li>Settings from the old version are not being imported.</li>
 					<li>Settings cannot be searched.</li>
-					<li>Emoji aren't displayed.</li>
+					<li>Advanced input (better tab completion, history) isn't available.</li>
-					<li>Advanced input isn't available.</li>
 				</ul>
 
 				<p>And the biggest features still under development:</p>
 
 				<ul class="tw-mg-b-2">
-					<li>Emoji Rendering</li>
 					<li>Chat Filtering (Highlighted Words, etc.)</li>
 					<li>Room Status Indicators</li>
 					<li>Custom Mod Cards</li>
-					<li>Custom Mod Actions</li>
 					<li>Recent Highlights</li>
-					<li>More Channel Metadata</li>
-					<li>Disable Hosting</li>
 					<li>Portrait Mode</li>
 					<li>Importing and exporting settings</li>
 					<li>User Aliases</li>

src/sites/twitch-twilight/modules/chat/emote_menu.jsx

@@ -4,7 +4,7 @@
 // Chat Emote Menu
 // ============================================================================
 
-import {has, get, once, set_equals} from 'utilities/object';
+import {has, get, once, maybe_call, set_equals} from 'utilities/object';
 import {IS_OSX, KNOWN_CODES, TWITCH_EMOTE_BASE, REPLACEMENT_BASE, REPLACEMENTS} from 'utilities/constants';
 
 import Twilight from 'site';
@@ -26,10 +26,14 @@ function maybe_date(val) {
 
 const EMOTE_SORTERS = [
 	function id_asc(a, b) {
-		return a.id - b.id;
+		if ( a.id < b.id ) return -1;
+		if ( a.id > b.id ) return 1;
+		return 0;
 	},
 	function id_desc(a, b) {
-		return b.id - a.id;
+		if ( a.id > b.id ) return -1;
+		if ( a.id < b.id ) return 1;
+		return 0;
 	},
 	function name_asc(a, b) {
 		const a_n = a.name.toLowerCase(),
@@ -38,7 +42,9 @@ const EMOTE_SORTERS = [
 		if ( a_n < b_n ) return -1;
 		if ( a_n > b_n ) return 1;
 
-		return a.id - b.id;
+		if ( a.id < b.id ) return -1;
+		if ( a.id > b.id ) return 1;
+		return 0;
 	},
 	function name_desc(a, b) {
 		const a_n = a.name.toLowerCase(),
@@ -47,7 +53,9 @@ const EMOTE_SORTERS = [
 		if ( a_n > b_n ) return -1;
 		if ( a_n < b_n ) return 1;
 
-		return b.id - a.id;
+		if ( a.id > b.id ) return -1;
+		if ( a.id < b.id ) return 1;
+		return 0;
 	}
 ];
 
@@ -989,19 +997,30 @@ export default class EmoteMenu extends Module {
 						ffz_global = t.emotes.getGlobalSetsWithSources(me.id, me.login),
 						seen_favorites = {};
 
+					let grouped_sets = {};
+
 					for(const [emote_set, provider] of ffz_room) {
-						const section = this.processFFZSet(emote_set, provider, favorites, seen_favorites);
+						const section = this.processFFZSet(emote_set, provider, favorites, seen_favorites, grouped_sets);
 						if ( section ) {
 							section.emotes.sort(sort_emotes);
+
+							if ( ! channel.includes(section) )
 								channel.push(section);
 						}
 					}
 
+					grouped_sets = {};
+
 					for(const [emote_set, provider] of ffz_global) {
-						const section = this.processFFZSet(emote_set, provider, favorites, seen_favorites);
+						const section = this.processFFZSet(emote_set, provider, favorites, seen_favorites, grouped_sets);
 						if ( section ) {
 							section.emotes.sort(sort_emotes);
+
+							if ( ! all.includes(section) )
 								all.push(section);
+
+							if ( ! channel.includes(section) && maybe_call(section.force_global, this, emote_set, props.channel_data.user, me) )
+								channel.push(section);
 						}
 					}
 				}
@@ -1026,7 +1045,7 @@ export default class EmoteMenu extends Module {
 			}
 
 
-			processFFZSet(emote_set, provider, favorites, seen_favorites) { // eslint-disable-line class-methods-use-this
+			processFFZSet(emote_set, provider, favorites, seen_favorites, grouped_sets) { // eslint-disable-line class-methods-use-this
 				if ( ! emote_set || ! emote_set.emotes )
 					return null;
 
@@ -1034,7 +1053,8 @@ export default class EmoteMenu extends Module {
 					known_favs = t.emotes.getFavorites(fav_key),
 					seen_favs = seen_favorites[fav_key] = seen_favorites[fav_key] || new Set;
 
-				const pdata = t.emotes.providers.get(provider),
+				const key = `${emote_set.merge_source || fav_key}-${emote_set.merge_id || emote_set.id}`,
+					pdata = t.emotes.providers.get(provider),
 					source = pdata && pdata.name ?
 						(pdata.i18n_key ?
 							t.i18n.t(pdata.i18n_key, pdata.name, pdata) :
@@ -1049,16 +1069,34 @@ export default class EmoteMenu extends Module {
 				if ( sort_key == null )
 					sort_key = emote_set.title.toLowerCase().includes('global') ? 100 : 0;
 
-				const emotes = [],
+				let section, emotes;
-					section = {
+
+				if ( grouped_sets[key] ) {
+					section = grouped_sets[key];
+					emotes = section.emotes;
+
+					if ( key === `${fav_key}-${emote_set.id}` )
+						Object.assign(section, {
 							sort_key,
-						key: `ffz-${emote_set.id}`,
+							image: emote_set.icon,
+							title,
+							source,
+							force_global: emote_set.force_global
+						});
+
+				} else {
+					emotes = [];
+					section = grouped_sets[key] = {
+						sort_key,
+						key,
 						image: emote_set.icon,
 						icon: 'zreknarf',
 						title,
 						source,
 						emotes,
-					};
+						force_global: emote_set.force_global
+					}
+				}
 
 				for(const emote of Object.values(emote_set.emotes))
 					if ( ! emote.hidden ) {