mirror of
https://github.com/FrankerFaceZ/FrankerFaceZ.git
synced 2025-06-27 21:05:53 +00:00
4.20.31
* Changed: Set the default chat reply style to Twitch's own, now that messages can be selected. * Fixed: Update the chat replies support for Twitch's default style. * Fixed: Badge tool-tips not working for certain chat messages with additional formatting. (Closes #887) * Fixed: FFZ hiding the `Watch Full Video` button on clips pages if the option to hide the native live viewer count is enabled. (Closes #883) * API Added: `threads` icon.
This commit is contained in:
SirStendec
parent
8fb51dc06b
commit
e7228d2795
19 changed files with 79 additions and 59 deletions
|
|
@ -759,6 +759,20 @@
|
|||
"css": "reply",
|
||||
"code": 61714,
|
||||
"src": "fontawesome"
|
||||
},
|
||||
{
|
||||
"uid": "d4413cf47ed064b48fcd5bf727826be1",
|
||||
"css": "threads",
|
||||
"code": 59460,
|
||||
"src": "custom_icons",
|
||||
"selected": true,
|
||||
"svg": {
|
||||
"path": "M550 400H650V500H550V400ZM450 400H350V500H450V400ZM500 900L350 750H250A100 100 0 0 1 150 650V250A100 100 0 0 1 250 150H750A100 100 0 0 1 850 250V650A100 100 0 0 1 750 750H650L500 900ZM391.4 650L500 758.6 608.6 650H750V250H250V650H391.4Z",
|
||||
"width": 1000
|
||||
},
|
||||
"search": [
|
||||
"threads"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"name": "frankerfacez",
|
||||
"author": "Dan Salvato LLC",
|
||||
"version": "4.20.30",
|
||||
"version": "4.20.31",
|
||||
"description": "FrankerFaceZ is a Twitch enhancement suite.",
|
||||
"license": "Apache-2.0",
|
||||
"scripts": {
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -142,6 +142,8 @@
|
|||
|
||||
<glyph glyph-name="link" unicode="" d="M813 171q0 23-16 38l-116 116q-16 16-38 16-24 0-40-18 1-1 10-10t12-12 9-11 7-14 2-15q0-23-16-38t-38-16q-8 0-15 2t-14 7-11 9-12 12-10 10q-19-17-19-40 0-23 16-38l115-116q15-15 38-15 22 0 38 15l82 81q16 16 16 37z m-393 394q0 22-15 38l-115 115q-16 16-38 16-22 0-38-15l-82-82q-16-15-16-37 0-22 16-38l116-116q15-15 38-15 23 0 40 17-2 2-11 11t-12 12-8 10-7 14-2 16q0 22 15 38t38 15q9 0 16-2t14-7 11-8 12-12 10-11q18 17 18 41z m500-394q0-66-48-113l-82-81q-46-47-113-47-68 0-114 48l-115 115q-46 47-46 114 0 68 49 116l-49 49q-48-49-116-49-67 0-114 47l-116 116q-47 47-47 114t47 113l82 82q47 46 114 46 67 0 114-47l115-116q46-46 46-113 0-69-49-117l49-49q48 49 116 49 67 0 114-47l116-116q47-47 47-114z" horiz-adv-x="928.6" />
|
||||
|
||||
<glyph glyph-name="threads" unicode="" d="M550 450h100v-100h-100v100z m-100 0h-100v-100h100v100z m50-500l-150 150h-100a100 100 0 0 0-100 100v400a100 100 0 0 0 100 100h500a100 100 0 0 0 100-100v-400a100 100 0 0 0-100-100h-100l-150-150z m-109 250l109-109 109 109h141v400h-500v-400h141z" horiz-adv-x="1000" />
|
||||
|
||||
<glyph glyph-name="volume-off" unicode="" d="M0 551l305 0 345 282 0-965-345 279-229 0z m713-283q0 4 2 6l76 76-76 76q-2 2-2 6t2 6l53 53q2 2 5 2t6-2l76-76 77 76q4 2 6 2t5-2l55-53q2-2 2-6t-2-6l-76-76 76-76q2-4 2-7t-2-5l-55-54q-2-2-5-2t-6 2l-77 78-76-78q-2-2-5-2t-6 2l-53 54q-2 2-2 6z" horiz-adv-x="1000" />
|
||||
|
||||
<glyph glyph-name="move" unicode="" d="M1000 350q0-14-11-25l-142-143q-11-11-26-11t-25 11-10 25v72h-215v-215h72q14 0 25-10t11-25-11-25l-143-143q-10-11-25-11t-25 11l-143 143q-11 10-11 25t11 25 25 10h72v215h-215v-72q0-14-10-25t-25-11-25 11l-143 143q-11 11-11 25t11 25l143 143q10 11 25 11t25-11 10-25v-72h215v215h-72q-14 0-25 10t-11 25 11 26l143 142q11 11 25 11t25-11l143-142q11-11 11-26t-11-25-25-10h-72v-215h215v72q0 14 10 25t25 11 26-11l142-143q11-10 11-25z" horiz-adv-x="1000" />
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 42 KiB After Width: | Height: | Size: 42 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -346,9 +346,12 @@ export default class Badges extends Module {
|
|||
this.tooltips.types.badge = (target, tip) => {
|
||||
tip.add_class = 'ffz__tooltip--badges';
|
||||
|
||||
const show_previews = this.parent.context.get('tooltip.badge-images'),
|
||||
container = target.parentElement.parentElement,
|
||||
room_id = container.dataset.roomId,
|
||||
const show_previews = this.parent.context.get('tooltip.badge-images');
|
||||
let container = target.parentElement.parentElement;
|
||||
if ( ! container.dataset.roomId )
|
||||
container = target.closest('[data-room-id]');
|
||||
|
||||
const room_id = container.dataset.roomId,
|
||||
room_login = container.dataset.room,
|
||||
data = JSON.parse(target.dataset.badgeData),
|
||||
out = [];
|
||||
|
|
|
|||
|
|
@ -110,7 +110,7 @@ export default class Metadata extends Module {
|
|||
|
||||
setup(data) {
|
||||
return {
|
||||
live: data.channel?.live_since != null,
|
||||
live: data.channel?.live && data.channel?.live_since != null,
|
||||
count: data.getViewerCount()
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -251,15 +251,15 @@ export default class ChatHook extends Module {
|
|||
// Settings
|
||||
|
||||
this.settings.add('chat.replies.style', {
|
||||
default: 2,
|
||||
default: 1,
|
||||
ui: {
|
||||
path: 'Chat > Appearance >> Replies',
|
||||
title: 'Style',
|
||||
description: `Twitch's default style makes entire messages clickable and adds a button to the right. FrankerFaceZ uses an In-Line Chat Action and does not make messages clickable.`,
|
||||
description: `Twitch's default style makes adds a floating button to the right and displays a notice above messages that are replies. FrankerFaceZ uses an In-Line Chat Action (that can be removed in Chat > Actions > In-Line) and uses an in-line mention to denote replies.`,
|
||||
component: 'setting-select-box',
|
||||
data: [
|
||||
{value: 0, title: 'Disabled'},
|
||||
{value: 1, title: 'Vanilla Twitch'},
|
||||
{value: 1, title: 'Twitch (Default)'},
|
||||
{value: 2, title: 'FrankerFaceZ'}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -506,7 +506,7 @@ other {# messages were deleted by a moderator.}
|
|||
] : user_block)
|
||||
];
|
||||
|
||||
let cls = `chat-line__message${show_class ? ' ffz--deleted-message' : ''}${twitch_clickable ? ' tw-relative' : ''}${twitch_clickable && can_reply ? ' tw-pd-r-3' : ''}`,
|
||||
let cls = `chat-line__message${show_class ? ' ffz--deleted-message' : ''}${twitch_clickable ? ' tw-relative' : ''}`,
|
||||
out = (tokens.length || ! msg.ffz_type) ? [
|
||||
this.props.showTimestamps && e('span', {
|
||||
className: 'chat-line__timestamp'
|
||||
|
|
@ -550,29 +550,37 @@ other {# messages were deleted by a moderator.}
|
|||
] : null;
|
||||
|
||||
if ( twitch_clickable ) {
|
||||
let btn = null;
|
||||
if ( can_reply )
|
||||
btn = e('div', {
|
||||
className: 'chat-line__reply-icon tw-absolute tw-c-text-alt-2 tw-right-0 tw-top-0 ffz-tooltip ffz-tooltip--no-mouse',
|
||||
'data-title': t.i18n.t('chat.actions.reply', 'Reply to Message')
|
||||
}, [
|
||||
e('div', {
|
||||
className: 'chat-line__reply-icon-background tw-border-bottom-left-radius-medium tw-border-top-right-radius-medium tw-c-background-alt-2'
|
||||
}),
|
||||
e('figure', {className: 'ffz-i-reply'})
|
||||
]);
|
||||
let icon, title;
|
||||
if ( can_reply ) {
|
||||
icon = e('figure', {className: 'ffz-i-reply'});
|
||||
title = t.i18n.t('chat.actions.reply', 'Reply to Message');
|
||||
} else {
|
||||
icon = e('figure', {className: 'ffz-i-threads'});
|
||||
title = t.i18n.t('chat.actions.reply.thread', 'Open Thread');
|
||||
}
|
||||
|
||||
out = [
|
||||
e('button', {
|
||||
className: 'ffz--reply-container chat-line__reply-button-container tw-interactive tw-link tw-link--button',
|
||||
'data-test-selector': 'chat-reply-button',
|
||||
onClick: this.ffz_open_reply
|
||||
}, e('div', {className: 'chat-line__reply-button'}, btn)),
|
||||
|
||||
e('div', {className: 'chat-line__message-container tw-relative'}, [
|
||||
e('div', {
|
||||
className: 'chat-line__message-highlight tw-absolute tw-border-radius-medium tw-top-0 tw-bottom-0 tw-right-0 tw-left-0',
|
||||
'data-test-selector': 'chat-message-highlight'
|
||||
}),
|
||||
e('div', {
|
||||
className: 'chat-line__message-container tw-relative'
|
||||
}, [
|
||||
this.renderReplyLine(),
|
||||
out
|
||||
])
|
||||
]),
|
||||
e('div', {
|
||||
className: 'chat-line__reply-icon tw-absolute tw-border-radius-medium tw-c-background-base tw-elevation-1'
|
||||
}, e('button', {
|
||||
className: '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-inline-flex tw-interactive tw-justify-content-center tw-overflow-hidden tw-relative ffz-tooltip ffz-tooltip--no-mouse',
|
||||
'data-test-selector': 'chat-reply-button',
|
||||
'aria-label': title,
|
||||
'data-title': title,
|
||||
onClick: this.ffz_open_reply
|
||||
}, e('span', {
|
||||
className: 'tw-button-icon__icon'
|
||||
}, icon)))
|
||||
];
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
.ffz--meta-tray {
|
||||
& > :first-child > :first-child {
|
||||
& > :first-child > :first-child:not(.tw-core-button) {
|
||||
display: none !important;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -59,22 +59,9 @@
|
|||
pointer-events: none;
|
||||
}
|
||||
|
||||
.ffz--reply-container {
|
||||
height: 100% !important;
|
||||
width: 100% !important;
|
||||
left: 0 !important;
|
||||
right: 0 !important;
|
||||
|
||||
.chat-line__reply-icon {
|
||||
padding: 0;
|
||||
|
||||
figure {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: 0.25rem;
|
||||
right: 0.25rem;
|
||||
}
|
||||
}
|
||||
.chat-line__reply-icon {
|
||||
right: 0.5rem !important;
|
||||
top: -1rem !important;
|
||||
}
|
||||
|
||||
.ffz--reply-mention {
|
||||
|
|
|
|||
|
|
@ -101,5 +101,6 @@ export default [
|
|||
"location",
|
||||
"link",
|
||||
"volume-off",
|
||||
"reply"
|
||||
"reply",
|
||||
"threads"
|
||||
];
|
||||
|
|
@ -67,6 +67,7 @@
|
|||
.ffz-i-chat:before { content: '\e841'; } /* '' */
|
||||
.ffz-i-location:before { content: '\e842'; } /* '' */
|
||||
.ffz-i-link:before { content: '\e843'; } /* '' */
|
||||
.ffz-i-threads:before { content: '\e844'; } /* '' */
|
||||
.ffz-i-volume-off:before { content: '\e845'; } /* '' */
|
||||
.ffz-i-move:before { content: '\f047'; } /* '' */
|
||||
.ffz-i-link-ext:before { content: '\f08e'; } /* '' */
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -67,6 +67,7 @@
|
|||
.ffz-i-chat { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-location { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-link { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-threads { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-volume-off { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-move { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-link-ext { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
|
|
|
|||
|
|
@ -78,6 +78,7 @@
|
|||
.ffz-i-chat { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-location { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-link { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-threads { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-volume-off { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-move { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.ffz-i-link-ext { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
@font-face {
|
||||
font-family: 'ffz-fontello';
|
||||
src: url('../font/ffz-fontello.eot?74161598');
|
||||
src: url('../font/ffz-fontello.eot?74161598#iefix') format('embedded-opentype'),
|
||||
url('../font/ffz-fontello.woff2?74161598') format('woff2'),
|
||||
url('../font/ffz-fontello.woff?74161598') format('woff'),
|
||||
url('../font/ffz-fontello.ttf?74161598') format('truetype'),
|
||||
url('../font/ffz-fontello.svg?74161598#ffz-fontello') format('svg');
|
||||
src: url('../font/ffz-fontello.eot?89863637');
|
||||
src: url('../font/ffz-fontello.eot?89863637#iefix') format('embedded-opentype'),
|
||||
url('../font/ffz-fontello.woff2?89863637') format('woff2'),
|
||||
url('../font/ffz-fontello.woff?89863637') format('woff'),
|
||||
url('../font/ffz-fontello.ttf?89863637') format('truetype'),
|
||||
url('../font/ffz-fontello.svg?89863637#ffz-fontello') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
|
@ -15,7 +15,7 @@
|
|||
@media screen and (-webkit-min-device-pixel-ratio:0) {
|
||||
@font-face {
|
||||
font-family: 'ffz-fontello';
|
||||
src: url('../font/ffz-fontello.svg?74161598#ffz-fontello') format('svg');
|
||||
src: url('../font/ffz-fontello.svg?89863637#ffz-fontello') format('svg');
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
|
@ -123,6 +123,7 @@
|
|||
.ffz-i-chat:before { content: '\e841'; } /* '' */
|
||||
.ffz-i-location:before { content: '\e842'; } /* '' */
|
||||
.ffz-i-link:before { content: '\e843'; } /* '' */
|
||||
.ffz-i-threads:before { content: '\e844'; } /* '' */
|
||||
.ffz-i-volume-off:before { content: '\e845'; } /* '' */
|
||||
.ffz-i-move:before { content: '\f047'; } /* '' */
|
||||
.ffz-i-link-ext:before { content: '\f08e'; } /* '' */
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue