1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-06-27 12:55:55 +00:00
* Added: Setting to hide the border around streams in the directory that have guest stars.
* Fixed: Issue with chat alternating backgrounds not appearing correctly after a Twitch update. Some settings may still not be working (notably: separators)
* Fixed: Issue where FFZ could be injected into a page twice, breaking basically everything.
* Experiments: Disable the EMQX experiment. It's not working out.
This commit is contained in:
SirStendec 2024-10-22 17:19:03 -04:00
parent efd6d2fa42
commit 1cacacaecb
17 changed files with 134 additions and 30 deletions

View file

@ -1,7 +1,7 @@
{
"name": "frankerfacez",
"author": "Dan Salvato LLC",
"version": "4.75.3",
"version": "4.75.4",
"description": "FrankerFaceZ is a Twitch enhancement suite.",
"private": true,
"license": "Apache-2.0",
@ -88,7 +88,7 @@
"mnemonist": "^0.38.5",
"path-to-regexp": "^3.2.0",
"raven-js": "^3.27.2",
"react": "^17.0.2",
"react": "^18.3.1",
"safe-regex": "^2.1.1",
"sortablejs": "^1.14.0",
"sourcemapped-stacktrace": "^1.1.11",

24
pnpm-lock.yaml generated
View file

@ -63,8 +63,8 @@ dependencies:
specifier: ^3.27.2
version: 3.27.2
react:
specifier: ^17.0.2
version: 17.0.2
specifier: ^18.3.1
version: 18.3.1
safe-regex:
specifier: ^2.1.1
version: 2.1.1
@ -195,7 +195,7 @@ devDependencies:
version: 5.2.2
vue-loader:
specifier: ^15.10.2
version: 15.10.2(css-loader@6.8.1)(react@17.0.2)(vue-template-compiler@2.6.14)(webpack@5.88.2)
version: 15.10.2(css-loader@6.8.1)(react@18.3.1)(vue-template-compiler@2.6.14)(webpack@5.88.2)
vue-template-compiler:
specifier: ^2.6.14
version: 2.6.14
@ -842,10 +842,10 @@ packages:
'@types/node': 20.5.7
dev: true
/@vue/component-compiler-utils@3.3.0(react@17.0.2):
/@vue/component-compiler-utils@3.3.0(react@18.3.1):
resolution: {integrity: sha512-97sfH2mYNU+2PzGrmK2haqffDpVASuib9/w2/noxiFi31Z54hW+q3izKQXXQZSNhtiUpAI36uSuYepeBe4wpHQ==}
dependencies:
consolidate: 0.15.1(react@17.0.2)
consolidate: 0.15.1(react@18.3.1)
hash-sum: 1.0.2
lru-cache: 4.1.5
merge-source-map: 1.1.0
@ -2163,7 +2163,7 @@ packages:
dev: true
optional: true
/consolidate@0.15.1(react@17.0.2):
/consolidate@0.15.1(react@18.3.1):
resolution: {integrity: sha512-DW46nrsMJgy9kqAbPt5rKaCr7uFtpo4mSUvLHIUbJEjm0vo+aY5QLwBUq3FK4tRnJr/X0Psc0C4jf/h+HtXSMw==}
engines: {node: '>= 0.10.0'}
deprecated: Please upgrade to consolidate v1.0.0+ as it has been modernized with several long-awaited fixes implemented. Maintenance is supported by Forward Email at https://forwardemail.net ; follow/watch https://github.com/ladjs/consolidate for updates and release changelog
@ -2330,7 +2330,7 @@ packages:
optional: true
dependencies:
bluebird: 3.7.2
react: 17.0.2
react: 18.3.1
dev: true
/content-disposition@0.5.4:
@ -4583,6 +4583,7 @@ packages:
/object-assign@4.1.1:
resolution: {integrity: sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=}
engines: {node: '>=0.10.0'}
dev: true
/object-inspect@1.11.0:
resolution: {integrity: sha512-jp7ikS6Sd3GxQfZJPyH3cjcbJF6GZPClgdV+EFygjFLQ5FmW/dRUnTd9PQ9k0JhoNDabWFbpF1yCdSWCC6gexg==}
@ -5035,12 +5036,11 @@ packages:
resolution: {integrity: sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==}
dev: true
/react@17.0.2:
resolution: {integrity: sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==}
/react@18.3.1:
resolution: {integrity: sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==}
engines: {node: '>=0.10.0'}
dependencies:
loose-envify: 1.4.0
object-assign: 4.1.1
/readable-stream@2.3.7:
resolution: {integrity: sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==}
@ -6101,7 +6101,7 @@ packages:
resolution: {integrity: sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==}
dev: true
/vue-loader@15.10.2(css-loader@6.8.1)(react@17.0.2)(vue-template-compiler@2.6.14)(webpack@5.88.2):
/vue-loader@15.10.2(css-loader@6.8.1)(react@18.3.1)(vue-template-compiler@2.6.14)(webpack@5.88.2):
resolution: {integrity: sha512-ndeSe/8KQc/nlA7TJ+OBhv2qalmj1s+uBs7yHDRFaAXscFTApBzY9F1jES3bautmgWjDlDct0fw8rPuySDLwxw==}
peerDependencies:
'@vue/compiler-sfc': ^3.0.8
@ -6120,7 +6120,7 @@ packages:
vue-template-compiler:
optional: true
dependencies:
'@vue/component-compiler-utils': 3.3.0(react@17.0.2)
'@vue/component-compiler-utils': 3.3.0(react@18.3.1)
css-loader: 6.8.1(webpack@5.88.2)
hash-sum: 1.0.2
loader-utils: 1.4.0

View file

@ -8,6 +8,11 @@
if ( /disable_frankerfacez/.test(location.search) )
return;
if ( document.body.dataset.ffzSource )
return;
document.body.dataset.ffzSource = 'script';
const DEBUG = localStorage.ffzDebugMode == 'true' && document.body.classList.contains('ffz-dev'),
HOST = location.hostname,
SERVER = DEBUG ? '//localhost:8000' : '//cdn2.frankerfacez.com',

View file

@ -9,6 +9,9 @@
||
// Don't run on pages that have disabled FFZ.
/disable_frankerfacez/.test(location.search)
||
// Don't run on pages we've already run on.
document.body.dataset.ffzSource
) {
// Tell the service worker we aren't injecting.
browser.runtime.sendMessage({
@ -17,6 +20,8 @@
return;
}
document.body.dataset.ffzSource = 'extension';
// Make sure to wake the service worker up early.
browser.runtime.sendMessage({
type: 'ffz_injecting'

View file

@ -20,8 +20,8 @@
"name": "EMQX MQTT-Based PubSub",
"description": "An experimental pubsub system running on an EMQX cluster, to see how that performs.",
"groups": [
{"value": true, "weight": 50},
{"value": false, "weight": 50}
{"value": true, "weight": 0},
{"value": false, "weight": 100}
]
},
"cf_pubsub": {

View file

@ -101,7 +101,7 @@ export default class PubSub extends Module<'pubsub', PubSubEvents> {
return Promise.resolve(this._mqtt);
if ( ! this._mqtt_loader )
this._mqtt_loader = import('utilities/pubsub')
this._mqtt_loader = import(/* webpackChunkName: 'pubsub' */ 'utilities/pubsub')
.then(thing => {
this._mqtt = thing.default;
return thing.default;

View file

@ -38,6 +38,15 @@ export default class BaseSite extends Module {
return this._react = react;
}
getReactDom() {
if ( this._reactDom )
return this._reactDom;
let reactDom = this.resolve('site.web_munch')?.getModule?.('react-dom');
if ( reactDom?.createPortal )
return this._reactDom = reactDom;
}
findReact() {
const react = this.getReact();
if ( react )

View file

@ -205,6 +205,7 @@ const CALCULATE_BITS = '_calculateChangedBits';
Twilight.KNOWN_MODULES = {
simplebar: n => n.globalObserver && n.initDOMLoadedElements,
react: n => n.Component && n.createElement,
'react-dom': n => n.createRoot && n.createPortal,
core: n => {
if ( n.x2?.experiments && n.x2.intl )
return n.x2;

View file

@ -182,6 +182,7 @@ export default class ChatHook extends Module {
this.inject('site.web_munch');
this.inject('site.css_tweaks');
this.inject('site.subpump');
//this.inject('site.loadable');
this.inject('chat');
@ -1101,6 +1102,21 @@ export default class ChatHook extends Module {
}
/*setChatPortal(node) {
if ( ! node )
node = null;
if ( node === this.chat_portal )
return;
if ( node && !(node instanceof HTMLElement) )
throw new Error('Tried to set invalid chat portal, must be null or HTMLElement');
this.chat_portal = node;
this.loadable.ErrorBoundaryComponent.forceUpdate();
}*/
onEnable() {
this.on('site.web_munch:loaded', this.grabTypes);
this.on('site.web_munch:loaded', this.defineClasses);
@ -1293,6 +1309,33 @@ export default class ChatHook extends Module {
}
});
/*this.loadable.ErrorBoundaryComponent.ready(cls => {
const t = this,
proto = cls.prototype,
old_render = proto.render;
proto.render = function() {
try {
const type = this.props.name;
if ( type === 'ChatLive' && t.chat_portal ) {
const ReactDOM = t.site.getReactDom(),
createPortal = ReactDOM?.createPortal;
if ( createPortal ) {
const out = old_render.call(this);
console.log('creating portal', out);
return createPortal(out, t.chat_portal, 'ffz-chat-portal');
}
}
} catch(err) {
/* no-op * /
}
return old_render.call(this);
}
});*/
this.RaidController.on('mount', this.wrapRaidController, this);
this.RaidController.on('update', this.noAutoRaids, this);
this.RaidController.ready((cls, instances) => {
@ -1591,8 +1634,9 @@ export default class ChatHook extends Module {
className: 'tw-border-l tw-c-background-alt-2 tw-c-text-base tw-full-width tw-full-height tw-align-items-center tw-flex tw-flex-column tw-justify-content-center tw-relative'
}, 'There was an error displaying chat.');
} else
return old_render.call(this);
}
return old_render.call(this);
}
for(const inst of instances)

View file

@ -50,4 +50,4 @@
& > .tw-pd-y-05 {
padding-top: calc(.5rem - 1px) !important;
}
}
}

View file

@ -1,10 +1,13 @@
.chat-line__message:not(.chat-line--inline),
.user-notice-line {
&.ffz-mentioned:not(.ffz-custom-color):nth-child(2n+0) {
background-color: rgba(255,127,127,.4) !important;
.chat-scrollable-area__message-container > div:nth-child(2n+0) > &,
&:nth-child(2n+0) {
&.ffz-mentioned:not(.ffz-custom-color) {
background-color: rgba(255,127,127,.4) !important;
.tw-root--theme-dark & {
background-color: rgba(255,0,0,.3) !important;
.tw-root--theme-dark & {
background-color: rgba(255,0,0,.3) !important;
}
}
}
}
@ -15,4 +18,4 @@
.tw-root--theme-dark & {
background-color: rgba(255,0,0,.3) !important;
}
}
}

View file

@ -3,8 +3,9 @@
.user-notice-line {
&.ffz-mentioned:not(.ffz-custom-color) {
&,
.chat-scrollable-area__message-container > div:nth-child(2n+0) > &,
&:nth-child(2n+0) {
background-color: var(--ffz-chat-mention-color) !important;
}
}
}
}

View file

@ -8,10 +8,12 @@
.chat-list__lines .chat-line__bits-charity,
.user-notice-line,
.ffz-notice-line,
.chat-line__message:not(.chat-line--inline) {
&:not(.ffz-custom-color) {
background-color: transparent !important;
.chat-scrollable-area__message-container > div:nth-child(2n+0) > &,
&:nth-child(2n+0) {
background-color: rgba(0,0,0,0.1) !important;
@ -37,4 +39,4 @@
.video-chat__message-list-wrapper li:nth-child(2n+0) .ffz--points-highlight,
.ffz--points-highlight:nth-child(2n+0) {
background-color: var(--ffz-channel-color-30);
}
}

View file

@ -14,4 +14,10 @@
transition-delay: 1s;
filter: blur(0) !important;
}
}
.blurred-preview-card-image div[class^=ScPositionOver] {
transition: opacity 0.2s;
transition-delay: 1s;
opacity: 0;
}
}

View file

@ -0,0 +1,16 @@
.guest-star-live-card-border {
background: unset !important;
}
.guest-star-live-card-clip-edge {
clip-path: unset !important;
}
.guest-star-live-card-branding-image {
display: none !important;
}
.guest-star-live-card-clip-corner {
-webkit-mask: unset !important;
mask: unset !important;
}

View file

@ -106,6 +106,17 @@ export default class Directory extends Module {
}
});
this.settings.add('directory.hide-costream-border', {
default: false,
ui: {
path: 'Directory > Channels >> Appearance',
title: 'Hide border on streams with guest stars.',
component: 'setting-check-box',
getExtraTerms: () => ['costream', 'co-stream']
}
});
this.settings.add('directory.hidden.reveal', {
default: false,
@ -511,6 +522,7 @@ export default class Directory extends Module {
this.css_tweaks.toggleHide('profile-hover', this.settings.get('directory.show-channel-avatars') === 2);
this.css_tweaks.toggleHide('dir-live-ind', this.settings.get('directory.hide-live'));
this.css_tweaks.toggle('dir-reveal', this.settings.get('directory.hidden.reveal'));
this.settings.getChanges('directory.hide-costream-border', val => this.css_tweaks.toggle('hide-costream-border', val));
const blur = this.settings.get('directory.hidden.style');

View file

@ -517,7 +517,7 @@ export function highlightJson(object: any, pretty = false, depth = 1, max_depth
return `<span class="ffz-ct--literal" depth="${depth}">${object}</span>`;
if ( typeof object === 'string' )
return `<span class=ffz-ct--string depth="${depth}">"${sanitize(object)}"</span>`;
return `<span class=ffz-ct--string depth="${depth}">${sanitize(JSON.stringify(object))}</span>`;
if ( Array.isArray(object) )
return `<span class="ffz-ct--obj-open" depth="${depth}">[</span>`
@ -535,7 +535,7 @@ export function highlightJson(object: any, pretty = false, depth = 1, max_depth
if ( pretty )
out.push(`\n${indent_inner}`);
out.push(`<span class="ffz-ct--obj-key" depth="${depth}">"${sanitize(key)}"</span><span class="ffz-ct--obj-key-sep" depth="${depth}">: </span>`);
out.push(`<span class="ffz-ct--obj-key" depth="${depth}">${sanitize(JSON.stringify(key))}</span><span class="ffz-ct--obj-key-sep" depth="${depth}">: </span>`);
out.push(highlightJson(val, pretty, depth + 1, max_depth));
}