diff --git a/package.json b/package.json
index 22f2ce56..39e62d68 100755
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "frankerfacez",
"author": "Dan Salvato LLC",
- "version": "4.36.2",
+ "version": "4.37.0",
"description": "FrankerFaceZ is a Twitch enhancement suite.",
"private": true,
"license": "Apache-2.0",
@@ -12,9 +12,9 @@
"dev": "cross-env NODE_OPTIONS=--openssl-legacy-provider webpack-dev-server --config webpack.web.dev.js",
"dev:prod": "cross-env NODE_OPTIONS=--openssl-legacy-provider webpack-dev-server --config webpack.web.dev.prod.js",
"build": "pnpm build:prod",
- "build:stats": "cross-env NODE_ENV=production webpack --config webpack.web.prod.js --json > stats.json",
- "build:prod": "cross-env NODE_ENV=production webpack --config webpack.web.prod.js",
- "build:dev": "pnpm clean && webpack --config webpack.web.dev.js",
+ "build:stats": "cross-env NODE_OPTIONS=--openssl-legacy-provider NODE_ENV=production webpack --config webpack.web.prod.js --json > stats.json",
+ "build:prod": "cross-env NODE_OPTIONS=--openssl-legacy-provider NODE_ENV=production webpack --config webpack.web.prod.js",
+ "build:dev": "pnpm clean && cross-env NODE_OPTIONS=--openssl-legacy-provider webpack --config webpack.web.dev.js",
"font": "pnpm font:edit",
"font:edit": "fontello-cli --cli-config fontello.client.json edit",
"font:save": "fontello-cli --cli-config fontello.client.json save && pnpm font:update",
diff --git a/src/entry.js b/src/entry.js
index ca7b8c21..7b3ae680 100644
--- a/src/entry.js
+++ b/src/entry.js
@@ -2,7 +2,7 @@
'use strict';
(() => {
// Don't run on certain sub-domains.
- if ( /^(?:localhost\.rig|blog|im|chatdepot|tmi|api|brand|dev)\./.test(location.hostname) )
+ if ( /^(?:localhost\.rig|blog|im|chatdepot|tmi|api|brand|dev|gql|passport)\./.test(location.hostname) )
return;
const DEBUG = localStorage.ffzDebugMode == 'true' && document.body.classList.contains('ffz-dev'),
diff --git a/src/modules/chat/actions/components/edit-copy.vue b/src/modules/chat/actions/components/edit-copy.vue
new file mode 100644
index 00000000..1dfbedfd
--- /dev/null
+++ b/src/modules/chat/actions/components/edit-copy.vue
@@ -0,0 +1,29 @@
+
+
+
+
+
+
+
+
+ {{ t('setting.actions.variables', 'Available Variables: {vars}', {vars}) }}
+
+
+
{ // eslint-disable-line react/jsx-key
+ this.i18n.t('chat.actions.copy_message', 'Copy Message')
+ }
),
+ ({ // eslint-disable-line react/jsx-key
+ msg
+ }
)
+ ];
+ },
+
+ click(event, data) {
+ const msg = this.replaceVariables(data.options.format, data);
+ navigator.clipboard.writeText(msg);
+ }
+}
+
+
// ============================================================================
// Open URL
// ============================================================================
diff --git a/src/sites/shared/player.jsx b/src/sites/shared/player.jsx
index 20425591..f3ec0a95 100644
--- a/src/sites/shared/player.jsx
+++ b/src/sites/shared/player.jsx
@@ -559,6 +559,15 @@ export default class PlayerBase extends Module {
},
changed: val => this.css_tweaks.toggle('player-hide-mouse', val)
});
+
+ this.settings.add('player.single-click-pause', {
+ default: false,
+ ui: {
+ path: 'Player > General >> Playback',
+ title: "Pause/Unpause the player by clicking.",
+ component: 'setting-check-box'
+ }
+ });
}
async onEnable() {
@@ -643,8 +652,6 @@ export default class PlayerBase extends Module {
onShortcut(e) {
- this.log.info('Compressor Hotkey', e);
-
for(const inst of this.Player.instances)
this.compressPlayer(inst, e);
}
@@ -825,10 +832,14 @@ export default class PlayerBase extends Module {
if ( ! this._ffz_click_handler )
this._ffz_click_handler = this.ffzClickHandler.bind(this);
+ if ( ! this._ffz_dblclick_handler )
+ this._ffz_dblclick_handler = this.ffzDblClickHandler.bind(this);
+
if ( ! this._ffz_menu_handler )
this._ffz_menu_handler = this.ffzMenuHandler.bind(this);
on(cont, 'wheel', this._ffz_scroll_handler);
+ on(cont, 'dblclick', this._ffz_dblclick_handler);
on(cont, 'mousedown', this._ffz_click_handler);
on(cont, 'contextmenu', this._ffz_menu_handler);
}
@@ -853,23 +864,60 @@ export default class PlayerBase extends Module {
this._ffz_menu_handler = null;
}
+ if ( this._ffz_dblclick_handler ) {
+ off(cont, 'dblclick', this._ffz_dblclick_handler);
+ this._ffz_dblclick_handler = null;
+ }
+
this._ffz_listeners = false;
}
+ cls.prototype.ffzDelayPause = function() {
+ if ( this._ffz_pause_timer )
+ clearTimeout(this._ffz_pause_timer);
+
+ const player = this.props?.mediaPlayerInstance;
+ if (! player.isPaused())
+ this._ffz_pause_timer = setTimeout(() => {
+ const player = this.props?.mediaPlayerInstance;
+ if (!player.isPaused())
+ player.pause();
+ }, 500);
+ }
+
+ cls.prototype.ffzDblClickHandler = function(event) {
+ if ( ! event )
+ return;
+
+ if ( this._ffz_pause_timer )
+ clearTimeout(this._ffz_pause_timer);
+ }
+
cls.prototype.ffzClickHandler = function(event) {
if ( ! event )
return;
const vol_scroll = t.settings.get('player.volume-scroll'),
gain_scroll = t.settings.get('player.gain.scroll'),
+ click_pause = t.settings.get('player.single-click-pause'),
wants_rmb = wantsRMB(vol_scroll) || wantsRMB(gain_scroll);
+ // Left Click
+ if (click_pause && event.button === 0) {
+ if (! event.target || ! event.target.classList.contains('click-handler'))
+ return;
+
+ this.ffzDelayPause();
+ }
+
+ // Right Click
if ( wants_rmb && event.button === 2 ) {
this.ffz_rmb = true;
this.ffz_scrolled = false;
}
+ // Middle Click
if ( ! t.settings.get('player.mute-click') || event.button !== 1 )
return;
diff --git a/src/sites/twitch-twilight/modules/channel.jsx b/src/sites/twitch-twilight/modules/channel.jsx
index 3751ae8b..af212516 100644
--- a/src/sites/twitch-twilight/modules/channel.jsx
+++ b/src/sites/twitch-twilight/modules/channel.jsx
@@ -79,7 +79,7 @@ export default class Channel extends Module {
changed: () => this.updateLinks()
});
- this.settings.add('channel.hosting.enable', {
+ /*this.settings.add('channel.hosting.enable', {
default: true,
ui: {
path: 'Channel > Behavior >> Hosting',
@@ -87,8 +87,7 @@ export default class Channel extends Module {
component: 'setting-check-box'
},
changed: val => ! val && this.InfoBar.each(el => this.updateBar(el))
- });
-
+ });*/
this.ChannelPanels = this.fine.define(
'channel-panels',
@@ -116,7 +115,7 @@ export default class Channel extends Module {
{childNodes: true, subtree: true}, 1
);
- const strip_host = resp => {
+ /*const strip_host = resp => {
if ( this.settings.get('channel.hosting.enable') )
return;
@@ -130,7 +129,7 @@ export default class Channel extends Module {
};
this.apollo.registerModifier('UseHosting', strip_host, false);
- this.apollo.registerModifier('PlayerTrackingContextQuery', strip_host, false);
+ this.apollo.registerModifier('PlayerTrackingContextQuery', strip_host, false);*/
}
onEnable() {
@@ -162,7 +161,7 @@ export default class Channel extends Module {
this.InfoBar.on('unmount', this.removeBar, this);
this.InfoBar.each(el => this.updateBar(el));
- this.subpump.on(':pubsub-message', this.onPubSub, this);
+ //this.subpump.on(':pubsub-message', this.onPubSub, this);
this.router.on(':route', this.checkNavigation, this);
this.checkNavigation();
@@ -230,7 +229,7 @@ export default class Channel extends Module {
}
}
- setHost(channel_id, channel_login, target_id, target_login) {
+ /*setHost(channel_id, channel_login, target_id, target_login) {
const topic = `stream-chat-room-v1.${channel_id}`;
this.subpump.inject(topic, {
@@ -272,7 +271,7 @@ export default class Channel extends Module {
event.message.data.num_viewers = 0;
event.markChanged();
}
- }
+ }*/
updateSubscription(login) {
@@ -441,8 +440,8 @@ export default class Channel extends Module {
});
}*/
- if ( ! this.settings.get('channel.hosting.enable') && props.hostLogin )
- this.setHost(props.channelID, props.channelLogin, null, null);
+ //if ( ! this.settings.get('channel.hosting.enable') && props.hostLogin )
+ // this.setHost(props.channelID, props.channelLogin, null, null);
this.updateSubscription(props.channelLogin);
this.updateMetadata(el);
@@ -492,10 +491,10 @@ export default class Channel extends Module {
live_since: props.liveSince
},
props,
- hosted: {
+ /*hosted: {
login: props.hostLogin,
display_name: props.hostDisplayName
- },
+ },*/
el,
getViewerCount: () => {
const thing = cont.querySelector('p[data-a-target="animated-channel-viewers-count"]'),
diff --git a/src/sites/twitch-twilight/modules/chat/emote_menu.jsx b/src/sites/twitch-twilight/modules/chat/emote_menu.jsx
index 0da82e64..6e6be4a7 100644
--- a/src/sites/twitch-twilight/modules/chat/emote_menu.jsx
+++ b/src/sites/twitch-twilight/modules/chat/emote_menu.jsx
@@ -188,6 +188,15 @@ export default class EmoteMenu extends Module {
}
});
+ this.settings.add('chat.emote-menu.clear-search', {
+ default: false,
+ ui: {
+ path: 'Chat > Emote Menu >> General',
+ title: 'Reset search when closing the Emote Menu.',
+ component: 'setting-check-box'
+ }
+ });
+
this.settings.add('chat.emote-menu.enabled', {
default: true,
ui: {
@@ -1078,6 +1087,7 @@ export default class EmoteMenu extends Module {
reducedPadding: t.chat.context.get('chat.emote-menu.reduced-padding'),
combineTabs: t.chat.context.get('chat.emote-menu.combine-tabs'),
showSearch: t.chat.context.get('chat.emote-menu.show-search'),
+ clearSearch: t.chat.context.get('chat.emote-menu.clear-search'),
tone: t.settings.provider.get('emoji-tone', null)
}
@@ -1226,6 +1236,7 @@ export default class EmoteMenu extends Module {
t.chat.context.on('changed:chat.emote-menu.show-heading', this.updateSettingState, this);
t.chat.context.on('changed:chat.emote-menu.combine-tabs', this.updateSettingState, this);
t.chat.context.on('changed:chat.emote-menu.show-search', this.updateSettingState, this);
+ t.chat.context.on('changed:chat.emote-menu.clear-search', this.updateSettingState, this);
t.chat.context.on('changed:chat.emote-menu.tall', this.updateSettingState, this);
window.ffz_menu = this;
@@ -1241,6 +1252,7 @@ export default class EmoteMenu extends Module {
t.chat.context.off('changed:chat.emote-menu.reduced-padding', this.updateSettingState, this);
t.chat.context.off('changed:chat.emote-menu.combine-tabs', this.updateSettingState, this);
t.chat.context.off('changed:chat.emote-menu.show-search', this.updateSettingState, this);
+ t.chat.context.off('changed:chat.emote-menu.clear-search', this.updateSettingState, this);
t.chat.context.off('changed:chat.emote-menu.tall', this.updateSettingState, this);
if ( window.ffz_menu === this )
@@ -1256,6 +1268,7 @@ export default class EmoteMenu extends Module {
reducedPadding: t.chat.context.get('chat.emote-menu.reduced-padding'),
combineTabs: t.chat.context.get('chat.emote-menu.combine-tabs'),
showSearch: t.chat.context.get('chat.emote-menu.show-search'),
+ clearSearch: t.chat.context.get('chat.emote-menu.clear-search'),
tall: t.chat.context.get('chat.emote-menu.tall')
});
}
@@ -2309,6 +2322,13 @@ export default class EmoteMenu extends Module {
return;
}
+ if ( ! this.props.visible && old_props.visible ) {
+ if ( this.state.clearSearch ) {
+ this.setState(this.filterState('', this.state));
+ return;
+ }
+ }
+
const cd = this.props.channel_data,
old_cd = old_props.channel_data,
cd_diff = cd?.user !== old_cd?.user || cd?.channel !== old_cd?.channel,
diff --git a/src/sites/twitch-twilight/modules/chat/index.js b/src/sites/twitch-twilight/modules/chat/index.js
index 1b43f35c..62d5f28b 100644
--- a/src/sites/twitch-twilight/modules/chat/index.js
+++ b/src/sites/twitch-twilight/modules/chat/index.js
@@ -201,7 +201,7 @@ export default class ChatHook extends Module {
this.ChatController = this.fine.define(
'chat-controller',
- n => n.hostingHandler && n.onRoomStateUpdated,
+ n => n.parseOutgoingMessage && n.onRoomStateUpdated && n.renderNotifications,
Twilight.CHAT_ROUTES
);
@@ -656,6 +656,15 @@ export default class ChatHook extends Module {
component: 'setting-check-box'
}
});
+
+ this.settings.add('chat.input.show-elevate-your-message', {
+ default: true,
+ ui: {
+ path: 'Chat > Input >> Appearance',
+ title: 'Allow the "Elevate Your Message" button to be displayed.',
+ component: 'setting-check-box'
+ }
+ });
}
get currentChat() {
@@ -941,6 +950,9 @@ export default class ChatHook extends Module {
this.updateMentionCSS();
});
+ this.chat.context.getChanges('chat.input.show-elevate-your-message', val =>
+ this.css_tweaks.toggleHide('elevate-your-message', ! val));
+
this.updateChatCSS();
this.updateColors();
this.updateLineBorders();
@@ -2441,7 +2453,7 @@ export default class ChatHook extends Module {
return old_points.call(i, e);
}
- const old_host = this.onHostingEvent;
+ /*const old_host = this.onHostingEvent;
this.onHostingEvent = function (e, _t) {
t.emit('tmi:host', e, _t);
return old_host.call(i, e, _t);
@@ -2451,7 +2463,7 @@ export default class ChatHook extends Module {
this.onUnhostEvent = function (e, _t) {
t.emit('tmi:unhost', e, _t);
return old_unhost.call(i, e, _t);
- }
+ }*/
const old_add = this.addMessage;
this.addMessage = function(e) {
diff --git a/src/sites/twitch-twilight/modules/css_tweaks/index.js b/src/sites/twitch-twilight/modules/css_tweaks/index.js
index da1cbf50..323eb3bc 100644
--- a/src/sites/twitch-twilight/modules/css_tweaks/index.js
+++ b/src/sites/twitch-twilight/modules/css_tweaks/index.js
@@ -26,6 +26,7 @@ const CLASSES = {
'modview-hide-info': '.modview-player-widget__hide-stream-info',
'community-highlights': '.community-highlight-stack__card',
+ 'elevate-your-message': '.chat-input__input-icons button[aria-label="ElevatedMessage"]',
'prime-offers': '.top-nav__prime',
'discover-luna': '.top-nav__external-link[data-a-target="try-presto-link"]',
@@ -38,7 +39,7 @@ const CLASSES = {
'player-event-bar': '.channel-root .live-event-banner-ui__header',
'player-rerun-bar': '.channel-root__player-container div.tw-c-text-overlay:not([data-a-target="hosting-ui-header"])',
- 'pinned-cheer': '.pinned-cheer,.pinned-cheer-v2,.channel-leaderboard',
+ 'pinned-cheer': '.pinned-cheer,.pinned-cheer-v2,.channel-leaderboard,.channel-leaderboard-marquee',
'whispers': 'body .whispers-open-threads,.tw-core-button[data-a-target="whisper-box-button"],.whispers__pill',
'dir-live-ind': '.live-channel-card[data-ffz-type="live"] .tw-channel-status-text-indicator, article[data-ffz-type="live"] .tw-channel-status-text-indicator',
diff --git a/src/sites/twitch-twilight/modules/dashboard.js b/src/sites/twitch-twilight/modules/dashboard.js
index 9e68298d..2c1cdd95 100644
--- a/src/sites/twitch-twilight/modules/dashboard.js
+++ b/src/sites/twitch-twilight/modules/dashboard.js
@@ -54,7 +54,7 @@ export default class Dashboard extends Module {
this.settings.updateContext({
channel: get('props.channelLogin', inst),
channelID: get('props.channelID', inst),
- hosting: !! inst.props?.hostedChannel?.id
+ //hosting: !! inst.props?.hostedChannel?.id
});
}
@@ -62,7 +62,7 @@ export default class Dashboard extends Module {
this.settings.updateContext({
channel: null,
channelID: null,
- hosting: false
+ //hosting: false
});
}
diff --git a/src/sites/twitch-twilight/modules/directory/following.jsx b/src/sites/twitch-twilight/modules/directory/following.jsx
deleted file mode 100644
index 99ce9efc..00000000
--- a/src/sites/twitch-twilight/modules/directory/following.jsx
+++ /dev/null
@@ -1,249 +0,0 @@
-'use strict';
-
-// ============================================================================
-// Following Page
-// ============================================================================
-
-import {SiteModule} from 'utilities/module';
-import {createElement} from 'utilities/dom';
-import {get} from 'utilities/object';
-
-import {createPopper} from '@popperjs/core';
-import {makeReference} from 'utilities/tooltip';
-
-export default class Following extends SiteModule {
- constructor(...args) {
- super(...args);
-
- this.inject('site.fine');
- this.inject('site.router');
- this.inject('site.apollo');
- this.inject('site.css_tweaks');
-
- this.inject('i18n');
- this.inject('settings');
-
- this.settings.add('directory.following.group-hosts', {
- default: true,
-
- ui: {
- path: 'Directory > Following @{"description": "**Note:** These settings do not currently work due to changes made by Twitch to how the directory works."} >> Hosts',
- title: 'Group Hosts',
- description: 'Only show a given hosted channel once in the directory.',
- component: 'setting-check-box'
- },
-
- changed: () => {
- this.apollo.maybeRefetch('FollowedIndex_CurrentUser');
- this.apollo.maybeRefetch('FollowingHosts_CurrentUser');
- }
- });
-
- this.settings.add('directory.following.host-menus', {
- default: 1,
-
- ui: {
- path: 'Directory > Following >> Hosts',
- title: 'Hosted Channel Menus',
- description: 'Display a menu to select which channel to visit when clicking a hosted channel in the directory.',
-
- component: 'setting-select-box',
-
- data: [
- {value: 0, title: 'Disabled'},
- {value: 1, title: 'When Multiple are Hosting'},
- {value: 2, title: 'Always'}
- ]
- },
-
- changed: () => this.parent.DirectoryCard.forceUpdate()
- });
-
- this.hosts = new WeakMap;
- }
-
- modifyLiveUsers(res, path = 'followedLiveUsers') {
- const followed_live = get(`data.currentUser.${path}`, res);
- if ( ! followed_live )
- return;
-
- if ( followed_live.nodes )
- followed_live.nodes = this.parent.processNodes(followed_live.nodes);
-
- else if ( followed_live.edges )
- followed_live.edges = this.parent.processNodes(followed_live.edges);
-
- return res;
- }
-
- modifyLiveHosts(res) {
- const blocked_games = this.settings.provider.get('directory.game.blocked-games', []),
- do_grouping = this.settings.get('directory.following.group-hosts'),
- edges = get('data.currentUser.followedHosts.nodes', res);
-
- if ( ! edges || ! edges.length )
- return res;
-
- this.hosts = new WeakMap();
- const out = [];
-
- for(const edge of edges) {
- if ( ! edge )
- continue;
-
- const node = edge.node || edge,
- hosted = node.hosting,
- stream = hosted && hosted.stream;
-
- if ( ! stream || stream.game && blocked_games.includes(stream.game.name) )
- continue;
-
- if ( ! stream.viewersCount ) {
- if ( ! do_grouping || ! this.hosts[hosted.login] )
- out.push(edge);
- continue;
- }
-
- const store = stream.viewersCount = new Number(stream.viewersCount || 0);
-
- store.createdAt = stream.createdAt;
- store.title = stream.title;
- //store.game = stream.game;
-
- if ( do_grouping ) {
- const host_nodes = this.hosts[hosted.login];
- if ( host_nodes ) {
- host_nodes.push(node);
- this.hosts.set(store, host_nodes);
-
- } else {
- this.hosts.set(store, this.hosts[hosted.login] = [node]);
- out.push(edge);
- }
-
- } else
- out.push(edge);
- }
-
- res.data.currentUser.followedHosts.nodes = out;
- return res;
- }
-
- onEnable() {
- document.body.addEventListener('click', this.destroyHostMenu.bind(this));
- }
-
- destroyHostMenu(event) {
- if (!event || ! this.hostMenu || event && event.target && event.target.closest('.ffz-channel-selector-outer') === null && Date.now() > this.hostMenuBuffer) {
- this.hostMenuPopper && this.hostMenuPopper.destroy();
- this.hostMenu && this.hostMenu.remove();
- this.hostMenuPopper = this.hostMenu = undefined;
- }
- }
-
- showHostMenu(inst, channels, event) {
- if (this.settings.get('directory.following.host-menus') === 0 || this.settings.get('directory.following.host-menus') === 1 && channels.length < 2) return;
-
- event.preventDefault();
- event.stopPropagation();
-
- this.hostMenuPopper && this.hostMenuPopper.destroy();
-
- this.hostMenu && this.hostMenu.remove();
-
- const simplebarContentChildren = [];
-
- // Hosted Channel Header
- simplebarContentChildren.push(
- {this.i18n.t('directory.hosted', 'Hosted Channel')}
-
);
-
- // Hosted Channel Content
- simplebarContentChildren.push( this.parent.hijackUserClick(e, inst.props.channelLogin, this.destroyHostMenu.bind(this))} // eslint-disable-line react/jsx-no-bind
- >
-
-
-
-
-
- {inst.props.channelDisplayName}
-
-
- {this.i18n.t('directory.hosting', 'Hosting Channels')}
-
);
-
- // Hosting Channels Content
- for (const channel of channels) {
- simplebarContentChildren.push( this.parent.hijackUserClick(e, channel.login, this.destroyHostMenu.bind(this))} // eslint-disable-line react/jsx-no-bind
- >
-
-
-
-
-
- {channel.displayName}
-
-