oss/FrankerFaceZ
oss/FrankerFaceZ
1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-06-28 15:27:43 +00:00
Code Wiki Activity

Add chat font settings. Update changelog. Remove old credits file and old, moved theme.scss. Fix FFZ menu rendering in Firefox/Edge.

Browse source
This commit is contained in:
SirStendec 2017-11-14 18:48:56 -05:00
parent 1e9953a0a8
commit bb26260e23
6 changed files with 68 additions and 2552 deletions
Download patch file Download diff file Expand all files Collapse all files

8
changelog.html
View file

@ -1,3 +1,11 @@
<div class="list-header">4.0.0-beta1.3<span>@63206f4ff1c95b591873</span> <time datetime="2017-11-13">(2017-11-13)</time></div>
<ul class="chat-menu-content menu-side-padding">
<li>Added: Appearance > Theme > Gray Theme (no Purple)</li>
<li>Added: Chat > Appearance > Font Family</li>
<li>Added: Chat > Appearance > Font Size</li>
<li>Fixed: Chat not working if the username has a capital letter in it.</li>
</ul>
<div class="list-header">4.0.0-beta1.3<span>@b86de82715b14711a01c</span> <time datetime="2017-11-13">(2017-11-13)</time></div>
<ul class="chat-menu-content menu-side-padding">
<li>Added: Freeze Chat Scrolling</li>

20
credits.html
View file

@ -1,20 +0,0 @@
<div class="list-header">Awesome People</div>
<ul class="chat-menu-content menu-side-padding">
<li><a href="//twitch.tv/fugi" target="_blank">Fugi</a> - Wrote the Chat Delay feature.</li>
<li><a href="//twitch.tv/daxterspeed" target="_blank">DaxterSpeed</a> - Wrote a method for adjusting username colors.</li>
<li><a href="//twitch.tv/riking27" target="_blank">Riking</a> - Wrote a large part of the socket server system.</li>
<li><a href="//twitch.tv/walle303" target="_blank">walle303</a> - Wrote a chat command to rename group chats. Also reported a bug or two.</li>
</ul>
<div class="list-header">Awesome Resources</div>
<ul class="chat-menu-content menu-side-padding">
<li><a href="https://cbenni.com/" target="_blank">CBenni's logviewer</a> - Chat moderation logs for Twitch</li>
<li><a href="https://letsencrypt.org/" target="_blank">Let's Encrypt</a> - Free and Automated SSL for Everyone</li>
<li><a href="https://isthereanydeal.com/" target="_blank">IsThereAnyDeal</a> - Competitive pricing information for videogames</li>
<li><a href="https://github.com/eligrey/FileSaver.js" target="_blank">FileSaver.js</a> - saveAs() implementation</li>
<li><a href="http://objectpath.org/" target="_blank">ObjectPath</a> - Lightweight query language for JSON</li>
<li><a href="https://github.com/twitter/twemoji" target="_blank">Twitter Emoji for Everyone</a> - Twitter's Emoji</li>
<li><a href="https://github.com/googlei18n/noto-emoji" target="_blank">Noto Emoji</a> - Google's Noto Emoji</li>
<li><a href="http://emojione.com/" target="_blank">EmojiOne</a> - An open source emoji project</li>
</ul>

1
src/modules/main_menu/components/home-page.vue
View file

@ -39,7 +39,6 @@
<ul class="mg-b-2">
<li>Dark Theme (Pls No Purple)</li>
<li>Chat Pause on Hover</li>
<li>Badge Customization</li>
<li>Emoji Rendering</li>
<li>Emotes Menu</li>

2
src/modules/main_menu/components/main-menu.vue
View file

@ -26,7 +26,7 @@
</span>
</button>
</header>
<section class="border-t full-height full-width flex flex--nowrap">
<section class="border-t full-height full-width flex flex-nowrap overflow-hidden">
<nav class="ffz-vertical-nav c-background-alt-2 border-r full-height flex flex-column flex-shrink-0 flex-nowrap">
<header class="border-b pd-1">
<profile-selector

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

@ -99,6 +99,33 @@ export default class ChatHook extends Module {
}
});
this.settings.add('chat.font-size', {
default: 12,
ui: {
path: 'Chat > Appearance >> General',
title: 'Font Size',
description: 'How large should text in chat be, in pixels.',
component: 'setting-text-box',
process(val) {
val = parseInt(val, 10);
if ( isNaN(val) || ! isFinite(val) || val <= 0 )
return 12;
return val;
}
}
});
this.settings.add('chat.font-family', {
default: '',
ui: {
path: 'Chat > Appearance >> General',
title: 'Font Family',
description: 'Set the font used for displaying chat messages.',
component: 'setting-text-box'
}
});
this.settings.add('chat.bits.show-pinned', {
default: true,
ui: {
@ -167,8 +194,28 @@ export default class ChatHook extends Module {
}
updateChatWidth() {
const width = this.chat.context.get('chat.width');
updateChatCSS() {
const width = this.chat.context.get('chat.width'),
size = this.chat.context.get('chat.font-size'),
font = this.chat.context.get('chat.font-family');
if ( size === 12 )
this.css_tweaks.style.delete('chat-font-size');
else {
const lh = Math.round((20/12) * size);
this.css_tweaks.style.set('chat-font-size',`.chat-list{font-size:${size}px;line-height:${lh}px}`);
}
if ( ! font )
this.css_tweaks.style.delete('chat-font-family');
else {
let val = font;
if ( font.indexOf(' ') !== -1 && val.indexOf(',') === -1 && val.indexOf('"') === -1 && val.indexOf("'") === -1 )
val = `"${val}"`;
this.css_tweaks.style.set('chat-font-family', `.chat-list{font-family:${val}}`);
}
if ( width === 340 )
this.css_tweaks.style.delete('chat-width');
else
@ -186,7 +233,9 @@ export default class ChatHook extends Module {
onEnable() {
this.chat.context.on('changed:chat.width', this.updateChatWidth, this);
this.chat.context.on('changed:chat.width', this.updateChatCSS, this);
this.chat.context.on('changed:chat.font-size', this.updateChatCSS, this);
this.chat.context.on('changed:chat.font-family', this.updateChatCSS, this);
this.chat.context.on('changed:chat.bits.stack', this.updateChatLines, this);
this.chat.context.on('changed:chat.adjustment-mode', this.updateColors, this);
this.chat.context.on('changed:chat.adjustment-contrast', this.updateColors, this);
@ -209,7 +258,7 @@ export default class ChatHook extends Module {
this.css_tweaks.toggle('chat-rows', this.chat.context.get('chat.lines.alternate'));
this.css_tweaks.toggle('chat-padding', this.chat.context.get('chat.lines.padding'));
this.updateChatWidth();
this.updateChatCSS();
this.updateColors();
this.updateLineBorders();
@ -296,7 +345,7 @@ export default class ChatHook extends Module {
'data-room-id': this.props.channelID,
'data-room': room,
'data-user-id': user.userID,
'data-user': user.userLogin,
'data-user': user.userLogin && user.userLogin.toLowerCase(),
//onClick: () => this.setState({renderDebug: ((this.state.renderDebug||0) + 1) % 3})
}, [
@ -379,7 +428,7 @@ export default class ChatHook extends Module {
const original = this._wrapped;
if ( original ) {
// Check that the message is relevant to this channel.
if ( original.channel && original.channel.slice(1) !== this.channelLogin )
if ( original.channel && this.channelLogin && original.channel.slice(1) !== this.channelLogin.toLowerCase() )
return;
const c = e.channel = original.channel;
@ -433,9 +482,9 @@ export default class ChatHook extends Module {
return;
container.dataset.roomId = inst.props.channelID;
container.dataset.room = inst.props.channelLogin;
container.dataset.room = inst.props.channelLogin && inst.props.channelLogin.toLowerCase();
container.dataset.userId = tc.user.userID;
container.dataset.user = tc.user.userLogin;
container.dataset.user = tc.user.userLogin && tc.user.userLogin.toLowerCase();
if ( tc.user.color ) {
const user_el = container.querySelector('.chat-author__display-name');
@ -472,7 +521,7 @@ export default class ChatHook extends Module {
if ( ! props.channelID )
return null;
const room = thing._ffz_room = this.chat.getRoom(props.channelID, props.channelLogin, false, true);
const room = thing._ffz_room = this.chat.getRoom(props.channelID, props.channelLogin && props.channelLogin.toLowerCase(), false, true);
room.ref(thing);
return room;
}
@ -521,7 +570,7 @@ export default class ChatHook extends Module {
this.chat.context.updateContext({
moderator: props.isCurrentUserModerator,
channel: props.channelLogin,
channel: props.channelLogin && props.channelLogin.toLowerCase(),
channelID: props.channelID,
ui: {
theme: props.theme

2520
styles/theme.scss
View file

File diff suppressed because it is too large Load diff