mirror of
https://github.com/FrankerFaceZ/FrankerFaceZ.git
synced 2025-08-03 00:18:31 +00:00
4.19.5
* Added: Support for the new Mod View. * Fixed: Changes to chat room state not updating room actions correctly. * Fixed: Chat room state not being detected correctly when the client loads.
This commit is contained in:
parent
0c1e9c5204
commit
99eee7396d
7 changed files with 78 additions and 25 deletions
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"name": "frankerfacez",
|
||||
"author": "Dan Salvato LLC",
|
||||
"version": "4.19.4",
|
||||
"version": "4.19.5",
|
||||
"description": "FrankerFaceZ is a Twitch enhancement suite.",
|
||||
"license": "Apache-2.0",
|
||||
"scripts": {
|
||||
|
|
|
@ -210,7 +210,8 @@ Twilight.CHAT_ROUTES = [
|
|||
'embed-chat',
|
||||
'squad',
|
||||
'command-center',
|
||||
'dash-stream-manager'
|
||||
'dash-stream-manager',
|
||||
'mod-view'
|
||||
];
|
||||
|
||||
|
||||
|
@ -262,7 +263,7 @@ Twilight.DASH_ROUTES = {
|
|||
'dash-settings-moderation': '/u/:userName/settings/moderation',
|
||||
'dash-settings-channel': '/u/:userName/settings/channel',
|
||||
'dash-settings-revenue': '/u/:userName/settings/revenue',
|
||||
'dash-extensions': '/u/:userName/extensions',
|
||||
'dash-extensions': '/u/:userName/extensions',
|
||||
'dash-streaming-tools': '/u/:userName/broadcast',
|
||||
};
|
||||
|
||||
|
@ -300,10 +301,11 @@ Twilight.ROUTES = {
|
|||
'user': '/:userName',
|
||||
'squad': '/:userName/squad',
|
||||
'command-center': '/:userName/commandcenter',
|
||||
'embed-chat': '/embed/:userName/chat'
|
||||
'embed-chat': '/embed/:userName/chat',
|
||||
'mod-view': '/moderator/:userName'
|
||||
};
|
||||
|
||||
|
||||
Twilight.DIALOG_EXCLUSIVE = '.sunlight-root,.twilight-main,.twilight-minimal-root>div,#root>div>.tw-full-height,.clips-root';
|
||||
Twilight.DIALOG_MAXIMIZED = '.sunlight-page,.twilight-main,.twilight-minimal-root,#root .dashboard-side-nav+.tw-full-height,.clips-root>.tw-full-height .scrollable-area';
|
||||
Twilight.DIALOG_SELECTOR = '.sunlight-root,#root>div,.twilight-minimal-root>.tw-full-height,.clips-root>.tw-full-height .scrollable-area';
|
||||
Twilight.DIALOG_EXCLUSIVE = '.moderation-root,.sunlight-root,.twilight-main,.twilight-minimal-root>div,#root>div>.tw-full-height,.clips-root';
|
||||
Twilight.DIALOG_MAXIMIZED = '.moderation-view-page > div[data-highlight-selector="main-grid"],.sunlight-page,.twilight-main,.twilight-minimal-root,#root .dashboard-side-nav+.tw-full-height,.clips-root>.tw-full-height .scrollable-area';
|
||||
Twilight.DIALOG_SELECTOR = '.moderation-root,.sunlight-root,#root>div,.twilight-minimal-root>.tw-full-height,.clips-root>.tw-full-height .scrollable-area';
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
import {ColorAdjuster} from 'utilities/color';
|
||||
import {setChildren} from 'utilities/dom';
|
||||
import {get, has, make_enum, split_chars, shallow_object_equals, set_equals} from 'utilities/object';
|
||||
import {get, has, make_enum, split_chars, shallow_object_equals, set_equals, deep_equals} from 'utilities/object';
|
||||
import {WEBKIT_CSS as WEBKIT} from 'utilities/constants';
|
||||
import {FFZEvent} from 'utilities/events';
|
||||
|
||||
|
@ -892,6 +892,12 @@ export default class ChatHook extends Module {
|
|||
|
||||
inst._ffzInstall();
|
||||
|
||||
const channel = inst.joinedChannel,
|
||||
state = inst.client?.session?.channelstate?.[`#${channel}`]?.roomState;
|
||||
|
||||
if ( state )
|
||||
this.updateChatState(state);
|
||||
|
||||
inst.connectHandlers();
|
||||
|
||||
inst.props.setChatConnectionAPI({
|
||||
|
@ -914,20 +920,19 @@ export default class ChatHook extends Module {
|
|||
if ( handler )
|
||||
handler.addMessageHandler(inst.handleMessage);
|
||||
|
||||
if ( Array.isArray(inst.buffer) ) {
|
||||
// We grab this from the chat client now.
|
||||
/*if ( Array.isArray(inst.buffer) ) {
|
||||
let i = inst.buffer.length;
|
||||
const ct = this.chat_types || CHAT_TYPES;
|
||||
|
||||
while(i--) {
|
||||
const msg = inst.buffer[i];
|
||||
if ( msg && msg.type === ct.RoomState && msg.state ) {
|
||||
this.chat.context.updateContext({
|
||||
chat_state: msg.state
|
||||
});
|
||||
this.updateChatState(msg.state);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}*/
|
||||
|
||||
inst.props.setMessageBufferAPI({
|
||||
addUpdateHandler: inst.addUpdateHandler,
|
||||
|
@ -1105,6 +1110,19 @@ export default class ChatHook extends Module {
|
|||
}
|
||||
|
||||
|
||||
updateChatState(state) {
|
||||
const old_state = this.chat.context.get('context.chat_state') || {};
|
||||
if ( deep_equals(state, old_state) )
|
||||
return;
|
||||
|
||||
this.chat.context.updateContext({
|
||||
chat_state: state
|
||||
});
|
||||
|
||||
this.input.updateInput();
|
||||
}
|
||||
|
||||
|
||||
updatePinnedCallouts() {
|
||||
for(const inst of this.PinnedCallout.instances)
|
||||
this.onPinnedCallout(inst);
|
||||
|
@ -1708,9 +1726,7 @@ export default class ChatHook extends Module {
|
|||
current = t.chat.context.get('context.channel');
|
||||
|
||||
if ( channel && (channel === current || channel === `#${current}`) )
|
||||
t.chat.context.updateContext({
|
||||
chat_state: e.state
|
||||
});
|
||||
t.updateChatState(e.state);
|
||||
|
||||
} catch(err) {
|
||||
t.log.capture(err, {extra: e});
|
||||
|
|
|
@ -226,6 +226,15 @@ export default class Input extends Module {
|
|||
this.on('site.css_tweaks:update-chat-css', this.resizeInput, this);
|
||||
}
|
||||
|
||||
updateInput() {
|
||||
for(const inst of this.ChatInput.instances) {
|
||||
if ( inst ) {
|
||||
inst.forceUpdate();
|
||||
this.emit('site:dom-update', 'chat-input', inst);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
resizeInput() {
|
||||
if ( this._resize_waiter )
|
||||
cancelAnimationFrame(this._resize_waiter);
|
||||
|
|
|
@ -49,7 +49,7 @@ export default class ChatLine extends Module {
|
|||
|
||||
this.WhisperLine = this.fine.define(
|
||||
'whisper-line',
|
||||
n => n.props && n.props.message && n.props.reportOutgoingWhisperRendered
|
||||
n => n.props && n.props.message && has(n.props, 'reportOutgoingWhisperRendered')
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
@ -38,6 +38,12 @@ export default class MenuButton extends SiteModule {
|
|||
changed: () => this.update()
|
||||
});
|
||||
|
||||
this.ModBar = this.fine.define(
|
||||
'mod-view-bar',
|
||||
n => n.actions && n.updateRoot && n.childContext,
|
||||
['mod-view']
|
||||
);
|
||||
|
||||
this.SunlightDash = this.fine.define(
|
||||
'sunlight-dash',
|
||||
n => n.getIsChannelEditor && n.getIsChannelModerator && n.getIsAdsEnabled && n.getIsSquadStreamsEnabled,
|
||||
|
@ -188,6 +194,9 @@ export default class MenuButton extends SiteModule {
|
|||
|
||||
for(const inst of this.SunlightDash.instances)
|
||||
this.updateButton(inst);
|
||||
|
||||
for(const inst of this.ModBar.instances)
|
||||
this.updateButton(inst);
|
||||
}
|
||||
|
||||
|
||||
|
@ -208,6 +217,10 @@ export default class MenuButton extends SiteModule {
|
|||
this.SunlightDash.on('mount', this.updateButton, this);
|
||||
this.SunlightDash.on('update', this.updateButton, this);
|
||||
|
||||
this.ModBar.ready(() => this.update());
|
||||
this.ModBar.on('mount', this.updateButton, this);
|
||||
this.ModBar.on('update', this.updateButton, this);
|
||||
|
||||
this.on(':clicked', () => this.important_update = false);
|
||||
|
||||
this.once(':clicked', this.loadMenu);
|
||||
|
@ -222,6 +235,7 @@ export default class MenuButton extends SiteModule {
|
|||
const root = this.fine.getChildNode(inst);
|
||||
let is_squad = false,
|
||||
is_sunlight = false,
|
||||
is_mod = false,
|
||||
container = root && root.querySelector('.top-nav__menu');
|
||||
|
||||
if ( ! container ) {
|
||||
|
@ -246,10 +260,16 @@ export default class MenuButton extends SiteModule {
|
|||
is_sunlight = true;
|
||||
}
|
||||
|
||||
if ( ! container && inst.childContext ) {
|
||||
container = root && root.querySelector('.modview-dock > div:last-child');
|
||||
if ( container )
|
||||
is_mod = true;
|
||||
}
|
||||
|
||||
if ( ! container )
|
||||
return;
|
||||
|
||||
if ( ! is_squad ) {
|
||||
if ( ! is_squad && ! is_mod ) {
|
||||
let user_stuff = null;
|
||||
try {
|
||||
user_stuff = container.querySelector(':scope > .tw-justify-content-end:last-child');
|
||||
|
@ -270,7 +290,7 @@ export default class MenuButton extends SiteModule {
|
|||
extra_pill = this.formatExtraPill();
|
||||
|
||||
el = (<div
|
||||
class={`ffz-top-nav tw-align-self-center tw-flex-grow-0 tw-flex-nowrap tw-flex-shrink-0 tw-relative ${is_sunlight ? 'tw-mg-l-05 tw-mg-r-2' : 'tw-mg-x-05'}`}
|
||||
class={`ffz-top-nav ${is_mod ? 'ffz-mod-view-button tw-relative tw-mg-b-1' : `tw-align-self-center tw-flex-grow-0 tw-flex-nowrap tw-flex-shrink-0 tw-relative ${is_sunlight ? 'tw-mg-l-05 tw-mg-r-2' : 'tw-mg-x-05'}`}`}
|
||||
>
|
||||
<div class="tw-inline-flex tw-relative tw-tooltip-wrapper">
|
||||
{btn = (<button
|
||||
|
@ -284,7 +304,7 @@ export default class MenuButton extends SiteModule {
|
|||
</span>
|
||||
</div>
|
||||
</button>)}
|
||||
{this.has_error && (<div class="tw-absolute tw-balloon tw-balloon--down tw-balloon--lg tw-balloon--right tw-block">
|
||||
{this.has_error && (<div class={`tw-absolute tw-balloon tw-balloon--lg tw-block ${is_mod ? 'tw-balloon--up tw-balloon--left' : 'tw-balloon--down tw-balloon--right'}`}>
|
||||
<div class="tw-border-radius-large tw-c-background-base tw-c-text-inherit tw-elevation-4 tw-pd-1">
|
||||
<div class="tw-flex tw-align-items-center">
|
||||
<div class="tw-flex-grow-1">
|
||||
|
@ -301,7 +321,7 @@ export default class MenuButton extends SiteModule {
|
|||
</div>
|
||||
</div>
|
||||
</div>)}
|
||||
{! this.has_error && (<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
|
||||
{! this.has_error && (<div class={`tw-tooltip ${is_mod ? 'tw-balloon--up tw-balloon--left' : 'tw-balloon--down tw-balloon--right'}`}>
|
||||
{this.i18n.t('site.menu_button', 'FrankerFaceZ Control Center')}
|
||||
{this.has_update && (<div class="tw-mg-t-1">
|
||||
{this.i18n.t('site.menu_button.update-desc', 'There is an update available. Please refresh your page.')}
|
||||
|
@ -340,7 +360,10 @@ export default class MenuButton extends SiteModule {
|
|||
</div>)}
|
||||
</div>);
|
||||
|
||||
container.insertBefore(el, container.lastElementChild);
|
||||
if ( is_mod )
|
||||
container.insertBefore(el, container.firstElementChild);
|
||||
else
|
||||
container.insertBefore(el, container.lastElementChild);
|
||||
|
||||
if ( this._ctx_open )
|
||||
this.renderContext(null, btn);
|
||||
|
@ -380,7 +403,8 @@ export default class MenuButton extends SiteModule {
|
|||
event.preventDefault();
|
||||
}
|
||||
|
||||
const container = btn.parentElement.parentElement;
|
||||
const container = btn.parentElement.parentElement,
|
||||
is_mod = container.classList.contains('ffz-mod-view-button');
|
||||
let ctx = container.querySelector('.ffz--menu-context');
|
||||
if ( ctx ) {
|
||||
if ( ctx._ffz_destroy )
|
||||
|
@ -436,7 +460,7 @@ export default class MenuButton extends SiteModule {
|
|||
}
|
||||
|
||||
|
||||
ctx = (<div class="tw-absolute tw-balloon tw-balloon--down tw-balloon--lg tw-balloon--right tw-block ffz--menu-context">
|
||||
ctx = (<div class={`tw-absolute tw-balloon tw-balloon--lg ${is_mod ? 'tw-balloon--up tw-balloon--left' : 'tw-balloon--down tw-balloon--right'} tw-block ffz--menu-context`}>
|
||||
<div class="tw-border-radius-large tw-c-background-base tw-c-text-inherit tw-elevation-4">
|
||||
<div class="tw-c-text-base tw-elevation-1 tw-flex tw-flex-shrink-0 tw-pd-x-1 tw-pd-y-05 tw-popover-header">
|
||||
<div class="tw-flex tw-flex-column tw-justify-content-center tw-mg-l-05 tw-popover-header__icon-slot--left">
|
||||
|
|
|
@ -10,7 +10,9 @@ import {createElement, on, off} from 'utilities/dom';
|
|||
export const PLAYER_ROUTES = [
|
||||
'front-page', 'user', 'video', 'user-video', 'user-clip', 'user-videos',
|
||||
'user-clips', 'user-collections', 'user-events', 'user-followers',
|
||||
'user-following', 'dash', 'squad', 'command-center', 'dash-stream-manager'];
|
||||
'user-following', 'dash', 'squad', 'command-center', 'dash-stream-manager',
|
||||
'mod-view'
|
||||
];
|
||||
|
||||
const HAS_COMPRESSOR = window.AudioContext && window.DynamicsCompressorNode != null;
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue