oss/FrankerFaceZ
oss/FrankerFaceZ
1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-09-17 10:16:57 +00:00
Code Wiki Activity

4.14.4

Browse source 
* Fixed: Inconsistent localized string for active profiles.
* Fixed: Hide mega-cheer recipient call-outs in chat when the relevant setting is enabled.
* Fixed: Styling of the chat settings menu modifications.
* Fixed: The FFZ menu button in the navigation bar not applying its loading state.
* Fixed: Incompatibility with BetterTTV menu options.
This commit is contained in:
SirStendec 2019-10-14 00:58:00 -04:00
parent 7257e4d2eb
commit c77d2bdd10
18 changed files with 152 additions and 75 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/modules/main_menu/components/profile-selector.vue
View file

@ -64,7 +64,7 @@
class="tw-tooltip-wrapper ffz--profile-row__icon ffz-i-ok tw-absolute"
>
<div class="tw-tooltip tw-tooltip--down tw-tooltip--align-right">
{{ t('setting.profiles.active', 'This profile is active.') }}
{{ t('setting.profiles.active', 'This profile is enabled and active.') }}
</div>
</div>

38
src/sites/twitch-twilight/modules/bttv_compat.js Normal file
View file

@ -0,0 +1,38 @@
'use strict';
// ============================================================================
// BetterTTV Compatibility
// ============================================================================
import Module from 'utilities/module';
const CHAT_EVENTS = [
'chat-input'
];
export default class BTTVCompat extends Module {
constructor(...args) {
super(...args);
this.should_enable = true;
}
onEnable() {
this.on('core:dom-update', this.handleDomUpdate, this);
}
handleDomUpdate(key) {
if ( ! window.BetterTTV?.watcher?.emitLoad )
return;
if ( ! CHAT_EVENTS.includes(key) )
return;
this.log.info('Sending chat reload event to BetterTTV.');
try {
window.BetterTTV.watcher.emitLoad('chat');
} catch(err) {
this.log.error('An error occurred with BetterTTV:', err);
}
}
}

14
src/sites/twitch-twilight/modules/chat/index.js
View file

@ -671,11 +671,16 @@ export default class ChatHook extends Module {
const old_render = cls.prototype.render;
cls.prototype.render = function() {
try {
const callout = this.props?.event?.callout;
if ( callout?.trackingType === 'community_points_reward' && ! t.chat.context.get('chat.points.show-callouts') )
const callout = this.props?.event?.callout,
ctype = callout?.trackingType;
if ( ctype === 'community_points_reward' && ! t.chat.context.get('chat.points.show-callouts') )
return null;
if ( callout?.trackingType === 'prime_gift_bomb' && ! t.chat.context.get('chat.community-chest.show') )
if ( ctype === 'prime_gift_bomb' && ! t.chat.context.get('chat.community-chest.show') )
return null;
if ( ctype === 'megacheer_emote_recipient' && ! t.chat.context.get('chat.bits.show-rewards') )
return null;
} catch(err) {
@ -702,6 +707,9 @@ export default class ChatHook extends Module {
if ( ctype === 'community-points-rewards' && ! t.chat.context.get('chat.points.show-callouts') )
return null;
if ( (ctype === 'mega-recipient-rewards' || ctype === 'mega-benefactor-rewards') && ! t.chat.context.get('chat.bits.show-rewards') )
return null;
} catch(err) {
t.log.capture(err);
t.log.error(err);

90
src/sites/twitch-twilight/modules/chat/settings_menu.jsx
View file

@ -57,7 +57,7 @@ export default class SettingsMenu extends Module {
this.ffzPauseClick = () => this.setState({ffzPauseMenu: ! this.state.ffzPauseMenu});
val.props.children.push(<div class="tw-full-width tw-relative">
<button class="tw-block tw-border-radius-medium tw-full-width tw-interactable tw-interactable--hover-enabled tw-interactable--inverted tw-interactive" onClick={this.ffzSettingsClick}>
<button class="tw-block tw-border-radius-medium tw-full-width tw-interactable tw-interactable--hover-enabled tw-interactable--alpha tw-interactive" onClick={this.ffzSettingsClick}>
<div class="tw-align-items-center tw-flex tw-pd-05 tw-relative">
<div class="tw-flex-grow-1">
{t.i18n.t('site.menu_button', 'FrankerFaceZ Control Center')}
@ -85,7 +85,7 @@ export default class SettingsMenu extends Module {
val.props.children.push(<div class="tw-full-width tw-relative">
<button
class="tw-block tw-border-radius-medium tw-full-width tw-interactable tw-interactable--hover-enabled tw-interactable--inverted tw-interactive"
class="tw-block tw-border-radius-medium tw-full-width tw-interactable tw-interactable--hover-enabled tw-interactable--alpha tw-interactive"
onClick={this.ffzPauseClick}
>
<div class="tw-align-items-center tw-flex tw-pd-05 tw-relative">
@ -110,41 +110,50 @@ export default class SettingsMenu extends Module {
if ( ! this.ffzPauseClick )
this.ffzPauseClick = () => this.setState({ffzPauseMenu: ! this.state.ffzPauseMenu});
return (<div class="tw-absolute tw-balloon tw-balloon--up tw-block">
<div class="tw-border tw-border-radius-medium tw-c-background-base tw-elevation-1">
<div class="chat-settings scrollable-area scrollable-area--suppress-scroll-x" data-simplebar>
<div class="chat-settings__content tw-c-background-base tw-c-text-base tw-pd-2">
<button
class="tw-interactive tw-link tw-link--button tw-link--hover-underline-none"
onClick={this.ffzPauseClick}
>
<span class="tw-c-text-link ffz-i-left-dir">
{t.i18n.t('chat.settings.back', 'Back')}
</span>
</button>
<div class="tw-mg-b-1 tw-mg-t-2">
<p class="tw-c-text-alt-2 tw-upcase">
{t.i18n.t('chat.settings.pause', 'Pause Chat')}
return (<div class="tw-absolute tw-balloon tw-balloon--auto tw-balloon--up tw-block" data-a-target="chat-settings-balloon">
<div class="tw-border-radius-large tw-c-background-base tw-c-text-inherit tw-elevation-2">
<div class="chat-settings__popover">
<div class="chat-settings__header tw-align-items-center tw-c-background-base tw-flex tw-pd-x-1 tw-relative">
<div class="chat-settings__back-icon-container tw-left-0 tw-mg-r-05">
<button
class="tw-align-items-center tw-align-middle tw-border-bottom-left-radius-medium tw-border-bottom-right-radius-medium tw-border-top-left-radius-medium tw-border-top-right-radius-medium tw-button-icon tw-core-button tw-core-button--border tw-inline-flex tw-interactive tw-justify-content-center tw-overflow-hidden tw-relative"
data-test-selector="chat-settings-back-button"
aria-label={t.i18n.t('chat.settings.back', 'Back')}
onClick={this.ffzPauseClick}
>
<div class="tw-align-items-center tw-flex tw-flex-grow-0">
<span class="tw-button-icon__icon">
<figure class="ffz-i-left-open" />
</span>
</div>
</button>
</div>
<div class="tw-align-center tw-align-items-center tw-flex tw-flex-grow-1 tw-justify-content-center">
<p class="tw-c-text-alt tw-font-size-5 tw-semibold">
{ t.i18n.t('chat.settings.pause', 'Pause Chat') }
</p>
</div>
<p>
{t.i18n.t('chat.settings.pause-explain', 'FrankerFaceZ overrides the behavior of Pause Chat entirely. Please use FFZ\'s Scrolling settings within the FFZ Control Center under Chat > Behavior.')}
</p>
<div class="tw-mg-t-1">
<button
class="tw-button tw-full-width"
data-page="chat.behavior"
onClick={this.ffzSettingsClick}
>
<span class="tw-button__text">
{t.i18n.t('chat.settings.open-settings', 'Open Control Center')}
</span>
</button>
{t.cant_window && <div class="tw-mg-t-05 tw-c-text-alt-2">
<span class="ffz-i-attention">
{t.i18n.t('popup.error', 'We tried opening a pop-up window and could not. Make sure to allow pop-ups from Twitch.')}
</span>
</div>}
</div>
<div class="chat-settings scrollable-area scrollable-area--suppress-scroll-x" data-simplebar>
<div class="chat-settings__content tw-border-bottom-left-radius-medium tw-border-bottom-right-radius-medium tw-c-background-base tw-c-text-base tw-pd-1">
<div class="tw-pd-x-05">
<div class="tw-border-b tw-mg-b-1 tw-pd-b-1">
<p class="tw-c-text-alt-2">
{ t.i18n.t('chat.settings.pause-explain', 'FrankerFaceZ overrides the behavior of Pause Chat entirely. Please use FFZ\'s Scrolling settings within the FFZ Control Center under Chat > Behavior.') }
</p>
</div>
<button
class="tw-block tw-border-radius-medium tw-full-width tw-interactable tw-interactable--hover-enabled tw-interactable--alpha tw-interactive"
data-page="chat.behavior"
onClick={this.ffzSettingsClick}
>
<div class="tw-align-items-center tw-flex tw-pd-05 tw-relative">
<div class="tw-flex-grow-1">
{t.i18n.t('chat.settings.open-settings', 'Open Control Center')}
</div>
</div>
</button>
</div>
</div>
</div>
</div>
@ -166,14 +175,15 @@ export default class SettingsMenu extends Module {
const old_render = cls.prototype.render;
cls.prototype.render = function() {
const out = old_render.call(this);
const out = old_render.call(this),
children = out?.props?.children?.[0]?.props?.children;
if ( out.props && Array.isArray(out.props.children) ) {
let i = out.props.children.length;
if ( Array.isArray(children) ) {
let i = children.length;
while(i--) {
const thing = out.props.children[i];
const thing = children[i];
if ( thing && thing.props && has(thing.props, 'chatPauseSetting') ) {
out.props.children.splice(i, 1);
children.splice(i, 1);
break;
}
}

39
src/sites/twitch-twilight/modules/menu_button.jsx
View file

@ -7,6 +7,7 @@
import {DEBUG} from 'utilities/constants';
import {SiteModule} from 'utilities/module';
import {createElement, ClickOutside, setChildren} from 'utilities/dom';
import { timeout, sleep } from 'src/utilities/object';
export default class MenuButton extends SiteModule {
constructor(...args) {
@ -23,6 +24,7 @@ export default class MenuButton extends SiteModule {
this._important_update = false;
this._new_settings = 0;
this._error = null;
this._loading = false;
this.settings.add('ffz.show-new-settings', {
default: true,
@ -40,6 +42,18 @@ export default class MenuButton extends SiteModule {
);
}
get loading() {
return this._loading;
}
set loading(val) {
if ( val === this._loading )
return;
this._loading = val;
this.update();
}
get has_error() {
return this._error != null;
}
@ -183,14 +197,12 @@ export default class MenuButton extends SiteModule {
const pill = this.formatPill(),
extra_pill = this.formatExtraPill();
// TODO: Pill.
el = (<div
class="ffz-top-nav tw-align-self-center tw-flex-grow-0 tw-flex-nowrap tw-flex-shrink-0 tw-mg-x-05 tw-relative"
>
<div class="tw-inline-flex tw-relative tw-tooltip-wrapper">
{btn = (<button
class="tw-align-items-center tw-align-middle tw-border-bottom-left-radius-medium tw-border-bottom-right-radius-medium tw-border-top-left-radius-medium tw-border-top-right-radius-medium tw-button-icon tw-core-button tw-core-button--border tw-inline-flex tw-interactive tw-justify-content-center tw-overflow-hidden tw-relative"
class={`tw-align-items-center tw-align-middle tw-border-bottom-left-radius-medium tw-border-bottom-right-radius-medium tw-border-top-left-radius-medium tw-border-top-right-radius-medium tw-button-icon tw-core-button tw-core-button--border tw-inline-flex tw-interactive tw-justify-content-center tw-overflow-hidden tw-relative${this.loading ? ' loading' : ''}`}
onClick={e => this.handleClick(e, btn)} // eslint-disable-line react/jsx-no-bind
onContextMenu={e => this.renderContext(e, btn)} // eslint-disable-line react/jsx-no-bind
>
@ -363,7 +375,7 @@ export default class MenuButton extends SiteModule {
<div class="tw-inline-flex tw-relative tw-tooltip-wrapper">
<button
class="tw-align-items-center tw-align-middle tw-border-radius-medium tw-button-icon tw-button-icon--secondary tw-core-button tw-core-button--border tw-inline-flex tw-interactive tw-justify-content-center tw-overflow-hidden"
onClick={e => this.openSettings(e)} // eslint-disable-line react/jsx-no-bind
onClick={e => {this.openSettings(e, btn); destroy()}} // eslint-disable-line react/jsx-no-bind
>
<span class="tw-button-icon__icon">
<figure class="ffz-i-cog" />
@ -399,7 +411,7 @@ export default class MenuButton extends SiteModule {
}
openSettings() {
openSettings(event, btn) {
const menu = this.resolve('main_menu');
if ( ! menu )
return;
@ -408,7 +420,7 @@ export default class MenuButton extends SiteModule {
if ( menu.showing )
return;
this.emit(':clicked');
this.emit(':clicked', event, btn);
}
@ -417,18 +429,15 @@ export default class MenuButton extends SiteModule {
if ( ! menu )
return;
const cl = btn && btn.classList;
if ( cl )
cl.add('loading');
if ( page )
menu.requestPage(page);
if ( menu.showing )
return;
this.loading = true;
menu.enable(event).then(() => {
if ( cl )
cl.remove('loading');
this.loading = false;
}).catch(err => {
this.log.capture(err);
@ -439,11 +448,9 @@ export default class MenuButton extends SiteModule {
text: 'There was an error loading the FFZ Control Center. Please refresh and try again.'
};
if ( cl )
cl.remove('loading');
this.loading = false;
this.once(':clicked', this.loadMenu);
})
});
}
onDisable() {

3
src/utilities/ffz-icons.js
View file

@ -81,5 +81,6 @@ export default [
"user",
"clip",
"youtube-play",
"minus"
"minus",
"left-open"
];