oss/FrankerFaceZ
oss/FrankerFaceZ
1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-08-07 23:00:54 +00:00
Code Wiki Activity

Clean up some code with eslint. Add eslintrc. Fix the FFZ:AP fix for jQuery only existing on some pages. Start renaming functions toCamelCase. Add old style RGB Loop color processing. Clean up Chat Freeze a bit.

Browse source
This commit is contained in:
SirStendec 2017-11-16 15:54:58 -05:00
parent a887425602
commit 7708caebb5
11 changed files with 333 additions and 171 deletions
Download patch file Download diff file Expand all files Collapse all files

93
.eslintrc.js Normal file
View file

@ -0,0 +1,93 @@
module.exports = {
"env": {
"browser": true,
"es6": true
},
"extends": "eslint:recommended",
"parserOptions": {
"ecmaVersion": 8,
"sourceType": "module"
},
"globals": {
"import": false,
"require": false,
"__webpack_hash__": false
},
"rules": {
"accessor-pairs": ["error"],
"block-scoped-var": ["error"],
"class-methods-use-this": ["error"],
"for-direction": ["error"],
"guard-for-in": ["warn"],
"no-alert": ["error"],
"no-await-in-loop": ["error"],
"no-caller": ["error"],
"no-catch-shadow": ["error"],
"no-invalid-this": ["error"],
"no-iterator": ["error"],
"no-labels": ["error"],
"no-lone-blocks": ["error"],
"no-octal-escape": ["error"],
"no-proto": ["warn"],
"no-return-await": ["error"],
"no-self-compare": ["error"],
"no-sequences": ["error"],
"no-shadow-restricted-names": ["error"],
"no-template-curly-in-string": ["warn"],
"no-throw-literal": ["error"],
"no-undef-init": ["error"],
"no-unmodified-loop-condition": ["error"],
"no-use-before-define": ["error", {
"functions": false,
"classes": false
}],
"no-useless-call": ["warn"],
"no-useless-concat": ["warn"],
"no-useless-return": ["warn"],
"no-void": ["error"],
"no-warning-comments": ["warn"],
"no-with": ["error"],
"radix": ["error"],
"require-await": ["warn"],
"valid-jsdoc": ["warn"],
"yoda": ["warn"],
"arrow-body-style": ["warn", "as-needed"],
"arrow-parens": ["warn", "as-needed"],
"arrow-spacing": ["warn"],
"generator-star-spacing": ["warn"],
"no-duplicate-imports": ["error"],
"no-useless-computed-key": ["error"],
"no-useless-constructor": ["error"],
"no-useless-rename": ["error"],
"no-var": ["error"],
"object-shorthand": ["warn"],
"prefer-arrow-callback": ["warn", {"allowUnboundThis": true}],
"prefer-const": ["warn", {"ignoreReadBeforeAssign": true}],
"prefer-rest-params": ["warn"],
"prefer-spread": ["error"],
"prefer-template": ["warn"],
"rest-spread-spacing": ["error", "never"],
"yield-star-spacing": ["warn"],
"indent": [
"error",
"tab",
{
"SwitchCase": 1
}
],
"linebreak-style": [
"error",
"unix"
],
"quotes": [
"error",
"single",
{
"avoidEscape": true,
"allowTemplateLiterals": true
}
]
}
};

41
src/api.js
View file

@ -20,12 +20,12 @@ export default class ApiModule extends Module {
if ( ! this._known_apis ) { if ( ! this._known_apis ) {
this._known_apis = {}; this._known_apis = {};
var stored_val = localStorage.getItem("ffz_known_apis"); const stored_val = localStorage.getItem(`ffz_known_apis`);
if ( stored_val !== null ) if ( stored_val !== null )
try { try {
this._known_apis = JSON.parse(stored_val); this._known_apis = JSON.parse(stored_val);
} catch(err) { } catch(err) {
this.error("Error loading Known APIs", err); this.log.error(`Error loading known APIs`, err);
} }
} }
} }
@ -78,7 +78,7 @@ export class LegacyAPI extends EventEmitter {
this.users = {}; this.users = {};
this.name = name || `Extension#${this.id}`; this.name = name || `Extension#${this.id}`;
this.name_key = name_key || this.name.replace(/[^A-Z0-9_\-]/g, '').toLowerCase(); this.name_key = name_key || this.name.replace(/[^A-Z0-9_-]/g, '').toLowerCase();
if ( /^[0-9]/.test(this.name_key) ) if ( /^[0-9]/.test(this.name_key) )
this.name_key = `_${this.name_key}`; this.name_key = `_${this.name_key}`;
@ -97,9 +97,9 @@ export class LegacyAPI extends EventEmitter {
this.parent.log.error(`Ext #${this.id} (${this.name_key}): ${msg}`, error); this.parent.log.error(`Ext #${this.id} (${this.name_key}): ${msg}`, error);
} }
register_metadata(key, data) { } register_metadata(key, data) { } // eslint-disable-line
unregister_metadata(key, data) { } unregister_metadata(key, data) { } // eslint-disable-line
update_metadata(key, full_update) { } update_metadata(key, full_update) { } // eslint-disable-line
_load_set(real_id, set_id, data) { _load_set(real_id, set_id, data) {
@ -119,7 +119,7 @@ export class LegacyAPI extends EventEmitter {
}); });
this.emote_sets[set_id] = emote_set; this.emote_sets[set_id] = emote_set;
this.parent.emotes.load_set_data(real_id, emote_set); this.parent.emotes.loadSetData(real_id, emote_set);
return emote_set; return emote_set;
} }
@ -232,23 +232,23 @@ export class LegacyAPI extends EventEmitter {
} }
add_badge() { } add_badge() { } // eslint-disable-line
remove_badge() { } remove_badge() { } // eslint-disable-line
user_add_badge() { } user_add_badge() { } // eslint-disable-line
user_remove_badge() { } user_remove_badge() { } // eslint-disable-line
room_add_user_badge() { } room_add_user_badge() { } // eslint-disable-line
room_remove_user_badge() { } room_remove_user_badge() { } // eslint-disable-line
user_add_set(username, set_id) { user_add_set(username, set_id) { // eslint-disable-line
} }
user_remove_set(username, set_id) { user_remove_set(username, set_id) { // eslint-disable-line
} }
retokenize_messages() { } retokenize_messages() { } // eslint-disable-line
register_chat_filter(filter) { register_chat_filter(filter) {
@ -260,20 +260,19 @@ export class LegacyAPI extends EventEmitter {
} }
iterate_chat_views(func) { } iterate_chat_views(func) { } // eslint-disable-line
iterate_rooms(func) { iterate_rooms(func) {
if ( func === undefined ) if ( func === undefined )
func = this.emit.bind(this, 'room-add'); func = this.emit.bind(this, 'room-add');
const chat = this.parent.resolve('chat'); const chat = this.parent.resolve('chat');
for(const room_id in chat.rooms) for(const room_id in chat.rooms)
func(room_id); if ( has(chat.rooms, room_id) )
func(room_id);
} }
register_on_room_callback(callback, dont_iterate) { register_on_room_callback(callback, dont_iterate) {
const thing = room_id => { const thing = room_id => callback(room_id, this.register_room_set.bind(this, room_id));
return callback(room_id, this.register_room_set.bind(this, room_id));
}
thing.original_func = callback; thing.original_func = callback;
callback.__wrapped = thing; callback.__wrapped = thing;

5
src/main.js
View file

@ -126,7 +126,8 @@ window.ffz = new FrankerFaceZ();
FrankerFaceZ.chat_commands = {}; FrankerFaceZ.chat_commands = {};
FrankerFaceZ.settings_info = {}; FrankerFaceZ.settings_info = {};
FrankerFaceZ.utils = { FrankerFaceZ.utils = {
process_int(a,b,c) { return a } process_int: a => a
} }
window.App = true; window.App = true;
jQuery.noty = {themes: {}}; if ( window.jQuery )
window.jQuery.noty = {themes: {}};

39
src/modules/chat/emotes.js
View file

@ -69,7 +69,7 @@ export default class Emotes extends Module {
onEnable() { onEnable() {
// Just in case there's a weird load order going on. // Just in case there's a weird load order going on.
this.on('site:enabled', this.refresh_twitch_inventory); this.on('site:enabled', this.loadTwitchInventory);
this.style = new ManagedStyle('emotes'); this.style = new ManagedStyle('emotes');
@ -85,9 +85,9 @@ export default class Emotes extends Module {
} }
} }
this.load_global_sets(); this.loadGlobalSets();
this.load_emoji_data(); this.loadEmojiData();
this.refresh_twitch_inventory(); this.loadTwitchInventory();
} }
@ -114,14 +114,14 @@ export default class Emotes extends Module {
// FFZ Emote Sets // FFZ Emote Sets
// ======================================================================== // ========================================================================
async load_global_sets(tries = 0) { async loadGlobalSets(tries = 0) {
let response, data; let response, data;
try { try {
response = await fetch(`${API_SERVER}/v1/set/global`) response = await fetch(`${API_SERVER}/v1/set/global`)
} catch(err) { } catch(err) {
tries++; tries++;
if ( tries < 10 ) if ( tries < 10 )
return setTimeout(() => this.load_global_sets(tries), 500 * tries); return setTimeout(() => this.loadGlobalSets(tries), 500 * tries);
this.log.error('Error loading global emote sets.', err); this.log.error('Error loading global emote sets.', err);
return false; return false;
@ -144,15 +144,15 @@ export default class Emotes extends Module {
for(const set_id in sets) for(const set_id in sets)
if ( has(sets, set_id) ) { if ( has(sets, set_id) ) {
this.global_sets.push('ffz-global', set_id); this.global_sets.push('ffz-global', set_id);
this.load_set_data(set_id, sets[set_id]); this.loadSetData(set_id, sets[set_id]);
} }
if ( data.users ) if ( data.users )
this.load_set_users(data.users); this.loadSetUsers(data.users);
} }
load_set_users(data) { loadSetUsers(data) {
for(const set_id in data) for(const set_id in data)
if ( has(data, set_id) ) { if ( has(data, set_id) ) {
const emote_set = this.emote_sets[set_id], const emote_set = this.emote_sets[set_id],
@ -170,7 +170,7 @@ export default class Emotes extends Module {
} }
load_set_data(set_id, data) { loadSetData(set_id, data) {
const old_set = this.emote_sets[set_id]; const old_set = this.emote_sets[set_id];
if ( ! data ) { if ( ! data ) {
if ( old_set ) if ( old_set )
@ -271,8 +271,8 @@ export default class Emotes extends Module {
// Emoji // Emoji
// ======================================================================== // ========================================================================
load_emoji_data() { loadEmojiData() {
this.log.debug('Unimplemented: load_emoji_data'); this.log.debug('Unimplemented: loadEmojiData');
} }
@ -280,7 +280,7 @@ export default class Emotes extends Module {
// Twitch Data Lookup // Twitch Data Lookup
// ======================================================================== // ========================================================================
async refresh_twitch_inventory() { async loadTwitchInventory() {
const user = this.resolve('site').getUser(); const user = this.resolve('site').getUser();
if ( ! user ) if ( ! user )
return; return;
@ -292,19 +292,26 @@ export default class Emotes extends Module {
'Client-ID': CLIENT_ID, 'Client-ID': CLIENT_ID,
'Authorization': `OAuth ${user.authToken}` 'Authorization': `OAuth ${user.authToken}`
} }
}).then(r => r.json()); }).then(r => {
if ( r.ok )
return r.json();
throw r.status;
});
} catch(err) { } catch(err) {
this.log.error('Error loading Twitch inventory.', err); this.log.error('Error loading Twitch inventory.', err);
return; return;
} }
this.twitch_inventory_sets = data.emoticon_sets ? Object.keys(data.emoticon_sets) : []; this.twitch_inventory_sets = data.emoticon_sets ? Object.keys(data.emoticon_sets) : [];
this.log.info('Twitch Inventory Sets:', this.twitch_inventory_sets); this.log.info('Twitch Inventory Sets:', this.twitch_inventory_sets);
} }
twitch_emote_to_set(emote_id, callback) { getTwitchEmoteSet(emote_id, callback) {
const tes = this.__twitch_emote_to_set; const tes = this.__twitch_emote_to_set;
if ( isNaN(emote_id) || ! isFinite(emote_id) ) if ( isNaN(emote_id) || ! isFinite(emote_id) )
@ -326,7 +333,7 @@ export default class Emotes extends Module {
} }
twitch_set_to_channel(set_id, callback) { getTwitchSetChannel(set_id, callback) {
const tes = this.__twitch_set_to_channel; const tes = this.__twitch_set_to_channel;
if ( isNaN(set_id) || ! isFinite(set_id) ) if ( isNaN(set_id) || ! isFinite(set_id) )
return null; return null;

7
src/modules/chat/index.js
View file

@ -156,7 +156,8 @@ export default class Chat extends Module {
{value: 0, title: 'Unchanged'}, {value: 0, title: 'Unchanged'},
{value: 1, title: 'HSL Luma'}, {value: 1, title: 'HSL Luma'},
{value: 2, title: 'Luv Luma'}, {value: 2, title: 'Luv Luma'},
{value: 3, title: 'HSL Loop (BTTV-Like)'} {value: 3, title: 'HSL Loop (BTTV-Like)'},
{value: 4, title: 'RGB Loop (Deprecated)'}
] ]
} }
}); });
@ -491,8 +492,8 @@ export default class Chat extends Module {
// ==== // ====
get_link_info(url, no_promises) { get_link_info(url, no_promises) {
let info = this._link_info[url], let info = this._link_info[url];
expires = info && info[1]; const expires = info && info[1];
if ( expires && Date.now() > expires ) if ( expires && Date.now() > expires )
info = this._link_info[url] = null; info = this._link_info[url] = null;

6
src/modules/chat/room.js
View file

@ -7,7 +7,7 @@
import {API_SERVER, IS_WEBKIT} from 'utilities/constants'; import {API_SERVER, IS_WEBKIT} from 'utilities/constants';
import {EventEmitter} from 'utilities/events'; import {EventEmitter} from 'utilities/events';
import {createElement as e, ManagedStyle} from 'utilities/dom'; import {ManagedStyle} from 'utilities/dom';
import {has, SourcedSet} from 'utilities/object'; import {has, SourcedSet} from 'utilities/object';
const WEBKIT = IS_WEBKIT ? '-webkit-' : ''; const WEBKIT = IS_WEBKIT ? '-webkit-' : '';
@ -126,7 +126,7 @@ export default class Room extends EventEmitter {
} }
const d = data.room, const d = data.room,
id = '' + d.twitch_id; id = `${d.twitch_id}`;
if ( ! this._id ) { if ( ! this._id ) {
this._id = id; this._id = id;
@ -149,7 +149,7 @@ export default class Room extends EventEmitter {
if ( data.sets ) if ( data.sets )
for(const set_id in data.sets) for(const set_id in data.sets)
if ( has(data.sets, set_id) ) if ( has(data.sets, set_id) )
this.manager.emotes.load_set_data(set_id, data.sets[set_id]); this.manager.emotes.loadSetData(set_id, data.sets[set_id]);
// TODO: User data. // TODO: User data.

4
src/modules/chat/tokenizers.js
View file

@ -462,8 +462,8 @@ export const AddonEmotes = {
if ( provider === 'twitch' ) { if ( provider === 'twitch' ) {
const emote_id = parseInt(target.dataset.id, 10), const emote_id = parseInt(target.dataset.id, 10),
set_id = this.emotes.twitch_emote_to_set(emote_id, tip.rerender), set_id = this.emotes.getTwitchEmoteSet(emote_id, tip.rerender),
emote_set = set_id != null && this.emotes.twitch_set_to_channel(set_id, tip.rerender); emote_set = set_id != null && this.emotes.getTwitchSetChannel(set_id, tip.rerender);
preview = `//static-cdn.jtvnw.net/emoticons/v1/${emote_id}/4.0?_=preview`; preview = `//static-cdn.jtvnw.net/emoticons/v1/${emote_id}/4.0?_=preview`;

14
src/settings/index.js
View file

@ -168,18 +168,18 @@ export default class SettingsManager extends Module {
// list rather than just getting the keys from the ID map // list rather than just getting the keys from the ID map
// because the ID map is an object and coerces its strings // because the ID map is an object and coerces its strings
// to keys. // to keys.
old_ids = new Set(old_profiles.map(x => x.id)); old_ids = new Set(old_profiles.map(x => x.id)),
let changed = false,
moved_ids = new Set, moved_ids = new Set,
new_ids = new Set, new_ids = new Set,
changed_ids = new Set; changed_ids = new Set,
const raw_profiles = this.provider.get('profiles', [ raw_profiles = this.provider.get('profiles', [
SettingsProfile.Moderation, SettingsProfile.Moderation,
SettingsProfile.Default SettingsProfile.Default
]); ]);
let changed = false;
for(const profile_data of raw_profiles) { for(const profile_data of raw_profiles) {
const id = profile_data.id, const id = profile_data.id,
old_profile = old_profile_ids[id], old_profile = old_profile_ids[id],

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

@ -17,35 +17,35 @@ import SettingsMenu from './settings_menu';
const ChatTypes = (e => { const ChatTypes = (e => {
/*e[e.Post = 0] = "Post", /*e[e.Post = 0] = 'Post';
e[e.Action = 1] = "Action", e[e.Action = 1] = 'Action';
e[e.PostWithMention = 2] = "PostWithMention", e[e.PostWithMention = 2] = 'PostWithMention';
e[e.Ban = 3] = "Ban", e[e.Ban = 3] = 'Ban';
e[e.Timeout = 4] = "Timeout", e[e.Timeout = 4] = 'Timeout';
e[e.AutoModRejectedPrompt = 5] = "AutoModRejectedPrompt", e[e.AutoModRejectedPrompt = 5] = 'AutoModRejectedPrompt';
e[e.AutoModMessageRejected = 6] = "AutoModMessageRejected", e[e.AutoModMessageRejected = 6] = 'AutoModMessageRejected';
e[e.AutoModMessageAllowed = 7] = "AutoModMessageAllowed", e[e.AutoModMessageAllowed = 7] = 'AutoModMessageAllowed';
e[e.AutoModMessageDenied = 8] = "AutoModMessageDenied", e[e.AutoModMessageDenied = 8] = 'AutoModMessageDenied';
e[e.Connected = 9] = "Connected", e[e.Connected = 9] = 'Connected';
e[e.Disconnected = 10] = "Disconnected",*/ e[e.Disconnected = 10] = 'Disconnected';*/
e[e.Reconnect = 11] = "Reconnect"; e[e.Reconnect = 11] = 'Reconnect';
/*e[e.Hosting = 12] = "Hosting", /*e[e.Hosting = 12] = 'Hosting';
e[e.Unhost = 13] = "Unhost", e[e.Unhost = 13] = 'Unhost';
e[e.Subscription = 14] = "Subscription", e[e.Subscription = 14] = 'Subscription';
e[e.Resubscription = 15] = "Resubscription", e[e.Resubscription = 15] = 'Resubscription';
e[e.SubGift = 16] = "SubGift", e[e.SubGift = 16] = 'SubGift';
e[e.Clear = 17] = "Clear", e[e.Clear = 17] = 'Clear';
e[e.SubscriberOnlyMode = 18] = "SubscriberOnlyMode", e[e.SubscriberOnlyMode = 18] = 'SubscriberOnlyMode';
e[e.FollowerOnlyMode = 19] = "FollowerOnlyMode", e[e.FollowerOnlyMode = 19] = 'FollowerOnlyMode';
e[e.SlowMode = 20] = "SlowMode", e[e.SlowMode = 20] = 'SlowMode';
e[e.RoomMods = 21] = "RoomMods",*/ e[e.RoomMods = 21] = 'RoomMods';*/
e[e.RoomState = 22] = "RoomState"; e[e.RoomState = 22] = 'RoomState';
/*e[e.Raid = 23] = "Raid", /*e[e.Raid = 23] = 'Raid';
e[e.Unraid = 24] = "Unraid", e[e.Unraid = 24] = 'Unraid';
e[e.Notice = 25] = "Notice", e[e.Notice = 25] = 'Notice';
e[e.Info = 26] = "Info",*/ e[e.Info = 26] = 'Info';*/
e[e.BadgesUpdated = 27] = "BadgesUpdated"; e[e.BadgesUpdated = 27] = 'BadgesUpdated';
//e[e.Purchase = 28] = "Purchase"; //e[e.Purchase = 28] = 'Purchase';
return e; return e;
})({}); })({});
@ -374,7 +374,7 @@ export default class ChatHook extends Module {
this.buffer = buf.slice(removed % 2 === 0 ? target : Math.max(target - 10, last)); this.buffer = buf.slice(removed % 2 === 0 ? target : Math.max(target - 10, last));
} else } else
// Make a shallow copy of the array because other code expects it to change. // Make a shallow copy of the array because other code expects it to change.
this.buffer = buf.slice(target); this.buffer = buf.slice(0);
this._isDirty = false; this._isDirty = false;
return this.buffer; return this.buffer;

84
src/sites/twitch-twilight/modules/chat/scroller.js
View file

@ -52,7 +52,6 @@ export default class Scroller extends Module {
this.freeze = this.chat.context.get('chat.scroller.freeze'); this.freeze = this.chat.context.get('chat.scroller.freeze');
this.chat.context.on('changed:chat.scroller.freeze', val => { this.chat.context.on('changed:chat.scroller.freeze', val => {
const old_freeze = this.freeze;
this.freeze = val; this.freeze = val;
for(const inst of this.ChatScroller.instances) { for(const inst of this.ChatScroller.instances) {
@ -101,13 +100,13 @@ export default class Scroller extends Module {
const f = t.freeze, const f = t.freeze,
reason = f === 2 ? t.i18n.t('key.ctrl', 'Ctrl Key') : reason = f === 2 ? t.i18n.t('key.ctrl', 'Ctrl Key') :
f === 3 ? t.i18n.t('key.meta', 'Meta Key') : f === 3 ? t.i18n.t('key.meta', 'Meta Key') :
f === 4 ? t.i18n.t('key.alt', 'Alt Key') : f === 4 ? t.i18n.t('key.alt', 'Alt Key') :
f === 5 ? t.i18n.t('key.shift', 'Shift Key') : f === 5 ? t.i18n.t('key.shift', 'Shift Key') :
f === 6 ? t.i18n.t('key.ctrl_mouse', 'Ctrl or Mouse') : f === 6 ? t.i18n.t('key.ctrl_mouse', 'Ctrl or Mouse') :
f === 7 ? t.i18n.t('key.meta_mouse', 'Meta or Mouse') : f === 7 ? t.i18n.t('key.meta_mouse', 'Meta or Mouse') :
f === 8 ? t.i18n.t('key.alt_mouse', 'Alt or Mouse') : f === 8 ? t.i18n.t('key.alt_mouse', 'Alt or Mouse') :
f === 9 ? t.i18n.t('key.shift_mouse', 'Shift or Mouse') : f === 9 ? t.i18n.t('key.shift_mouse', 'Shift or Mouse') :
t.i18n.t('key.mouse', 'Mouse Movement'); t.i18n.t('key.mouse', 'Mouse Movement');
this._ffz_freeze_indicator.firstElementChild.textContent = t.i18n.t( this._ffz_freeze_indicator.firstElementChild.textContent = t.i18n.t(
'chat.paused', 'chat.paused',
@ -117,6 +116,7 @@ export default class Scroller extends Module {
} }
cls.prototype.ffzShowFrozen = function() { cls.prototype.ffzShowFrozen = function() {
this._ffz_freeze_visible = true;
let el = this._ffz_freeze_indicator; let el = this._ffz_freeze_indicator;
if ( ! el ) { if ( ! el ) {
const node = t.fine.getHostNode(this); const node = t.fine.getHostNode(this);
@ -139,6 +139,7 @@ export default class Scroller extends Module {
} }
cls.prototype.ffzHideFrozen = function() { cls.prototype.ffzHideFrozen = function() {
this._ffz_freeze_visible = false;
if ( this._ffz_freeze_indicator ) if ( this._ffz_freeze_indicator )
this._ffz_freeze_indicator.classList.add('hide'); this._ffz_freeze_indicator.classList.add('hide');
} }
@ -152,7 +153,7 @@ export default class Scroller extends Module {
this.ffz_frozen = true; this.ffz_frozen = true;
this.setState({ffzFrozen: true}); this.setState({ffzFrozen: true});
this.ffzShowFrozen(); //this.ffzShowFrozen();
} }
cls.prototype.ffzUnfreeze = function() { cls.prototype.ffzUnfreeze = function() {
@ -166,7 +167,30 @@ export default class Scroller extends Module {
if ( this.state.isAutoScrolling ) if ( this.state.isAutoScrolling )
this.scrollToBottom(); this.scrollToBottom();
this.ffzHideFrozen(); //this.ffzHideFrozen();
}
cls.prototype.ffzInstallHandler = function() {
if ( this._ffz_handleScroll )
return;
this._ffz_handleScroll = this.handleScrollEvent;
const t = this;
this.handleScrollEvent = function(e) {
// If we're frozen because of FFZ, do not allow a mouse click to update
// the auto-scrolling state. That just gets annoying.
if ( e.type === 'mousedown' && t.ffz_frozen )
return;
return t._ffz_handleScroll(e);
}
const scroller = this.scroll && this.scroll.scrollContent;
if ( scroller ) {
scroller.removeEventListener('mousedown', this._ffz_handleScroll);
scroller.addEventListener('mousedown', this.handleScrollEvent);
}
} }
@ -207,6 +231,8 @@ export default class Scroller extends Module {
if ( ! node ) if ( ! node )
return; return;
this._ffz_freeze_visible = false;
if ( this._ffz_freeze_indicator ) { if ( this._ffz_freeze_indicator ) {
node.removeChild(this._ffz_freeze_indicator); node.removeChild(this._ffz_freeze_indicator);
this._ffz_freeze_indicator = null; this._ffz_freeze_indicator = null;
@ -232,10 +258,10 @@ export default class Scroller extends Module {
cls.prototype.ffzKey = function(e) { cls.prototype.ffzKey = function(e) {
if (e.altKey === this.ffz_alt && if (e.altKey === this.ffz_alt &&
e.shiftKey === this.ffz_shift && e.shiftKey === this.ffz_shift &&
e.ctrlKey === this.ffz_ctrl && e.ctrlKey === this.ffz_ctrl &&
e.metaKey === this.ffz_meta) e.metaKey === this.ffz_meta)
return; return;
this.ffz_alt = e.altKey; this.ffz_alt = e.altKey;
this.ffz_shift = e.shiftKey; this.ffz_shift = e.shiftKey;
@ -266,12 +292,12 @@ export default class Scroller extends Module {
// If nothing of interest has happened, stop. // If nothing of interest has happened, stop.
if (e.altKey === this.ffz_alt && if (e.altKey === this.ffz_alt &&
e.shiftKey === this.ffz_shift && e.shiftKey === this.ffz_shift &&
e.ctrlKey === this.ffz_ctrl && e.ctrlKey === this.ffz_ctrl &&
e.metaKey === this.ffz_meta && e.metaKey === this.ffz_meta &&
e.screenY === this.ffz_sy && e.screenY === this.ffz_sy &&
e.screenX === this.ffz_sx) e.screenX === this.ffz_sx)
return; return;
this.ffz_alt = e.altKey; this.ffz_alt = e.altKey;
this.ffz_shift = e.shiftKey; this.ffz_shift = e.shiftKey;
@ -291,7 +317,7 @@ export default class Scroller extends Module {
} }
cls.prototype.ffzMouseLeave = function(e) { cls.prototype.ffzMouseLeave = function() {
this.ffz_outside = true; this.ffz_outside = true;
if ( this._ffz_outside ) if ( this._ffz_outside )
clearTimeout(this._ffz_outside); clearTimeout(this._ffz_outside);
@ -306,15 +332,29 @@ export default class Scroller extends Module {
this.ChatScroller.on('mount', this.onMount, this); this.ChatScroller.on('mount', this.onMount, this);
this.ChatScroller.on('unmount', this.onUnmount, this); this.ChatScroller.on('unmount', this.onUnmount, this);
this.ChatScroller.on('update', inst => {
const should_show = inst.ffz_freeze_enabled && inst.state.ffzFrozen && inst.state.isAutoScrolling,
changed = should_show !== inst._ffz_freeze_visible;
if ( changed )
if ( should_show )
inst.ffzShowFrozen();
else
inst.ffzHideFrozen();
});
} }
onMount(inst) { onMount(inst) {
inst.ffzInstallHandler();
if ( this.freeze !== 0 ) if ( this.freeze !== 0 )
inst.ffzEnableFreeze(); inst.ffzEnableFreeze();
} }
onUnmount(inst) { onUnmount(inst) { // eslint-disable-line class-methods-use-this
inst.ffzDisableFreeze(); inst.ffzDisableFreeze();
} }
} }

151
src/utilities/color.js
View file

@ -1,5 +1,4 @@
'use strict'; 'use strict';
/* eslint-disable */
import {has} from 'utilities/object'; import {has} from 'utilities/object';
@ -179,21 +178,21 @@ RGBAColor.fromHex = function(code, alpha = 1) {
} }
RGBAColor.fromHSVA = function(h, s, v, a) { RGBAColor.fromHSVA = function(h, s, v, a) {
let r, g, b, let r, g, b;
i = Math.floor(h * 6), const i = Math.floor(h * 6),
f = h * 6 - i, f = h * 6 - i,
p = v * (1 - s), p = v * (1 - s),
q = v * (1 - f * s), q = v * (1 - f * s),
t = v * (1 - (1 - f) * s); t = v * (1 - (1 - f) * s);
switch(i % 6) { switch(i % 6) {
case 0: r = v, g = t, b = p; break; case 0: r = v; g = t; b = p; break;
case 1: r = q, g = v, b = p; break; case 1: r = q; g = v; b = p; break;
case 2: r = p, g = v, b = t; break; case 2: r = p; g = v; b = t; break;
case 3: r = p, g = q, b = v; break; case 3: r = p; g = q; b = v; break;
case 4: r = t, g = p, b = v; break; case 4: r = t; g = p; b = v; break;
case 5: r = v, g = p, b = q; case 5: r = v; g = p; b = q;
} }
return new RGBAColor( return new RGBAColor(
@ -237,13 +236,13 @@ RGBAColor.fromHSLA = function(h, s, l, a) {
RGBAColor.prototype.toHSVA = function() { return HSVAColor.fromRGBA(this.r, this.g, this.b, this.a); } RGBAColor.prototype.toHSVA = function() { return HSVAColor.fromRGBA(this.r, this.g, this.b, this.a); }
RGBAColor.prototype.toHSLA = function() { return HSLAColor.fromRGBA(this.r, this.g, this.b, this.a); } RGBAColor.prototype.toHSLA = function() { return HSLAColor.fromRGBA(this.r, this.g, this.b, this.a); }
RGBAColor.prototype.toCSS = function() { return "rgb" + (this.a !== 1 ? "a" : "") + "(" + Math.round(this.r) + "," + Math.round(this.g) + "," + Math.round(this.b) + (this.a !== 1 ? "," + this.a : "") + ")"; } RGBAColor.prototype.toCSS = function() { return `rgb${this.a !== 1 ? 'a' : ''}(${Math.round(this.r)},${Math.round(this.g)},${Math.round(this.b)}${this.a !== 1 ? `,${this.a}` : ''})`; }
RGBAColor.prototype.toXYZA = function() { return XYZAColor.fromRGBA(this.r, this.g, this.b, this.a); } RGBAColor.prototype.toXYZA = function() { return XYZAColor.fromRGBA(this.r, this.g, this.b, this.a); }
RGBAColor.prototype.toLUVA = function() { return this.toXYZA().toLUVA(); } RGBAColor.prototype.toLUVA = function() { return this.toXYZA().toLUVA(); }
RGBAColor.prototype.toHex = function() { RGBAColor.prototype.toHex = function() {
var rgb = this.b | (this.g << 8) | (this.r << 16); const rgb = this.b | (this.g << 8) | (this.r << 16);
return '#' + (0x1000000 + rgb).toString(16).slice(1); return `#${(0x1000000 + rgb).toString(16).slice(1)}`;
} }
@ -253,7 +252,7 @@ RGBAColor.prototype.get_Y = function() {
RGBAColor.prototype.luminance = function() { RGBAColor.prototype.luminance = function() {
var r = bit2linear(this.r / 255), const r = bit2linear(this.r / 255),
g = bit2linear(this.g / 255), g = bit2linear(this.g / 255),
b = bit2linear(this.b / 255); b = bit2linear(this.b / 255);
@ -262,7 +261,7 @@ RGBAColor.prototype.luminance = function() {
RGBAColor.prototype.brighten = function(amount) { RGBAColor.prototype.brighten = function(amount) {
amount = typeof amount === "number" ? amount : 1; amount = typeof amount === `number` ? amount : 1;
amount = Math.round(255 * (amount / 100)); amount = Math.round(255 * (amount / 100));
return new RGBAColor( return new RGBAColor(
@ -274,43 +273,47 @@ RGBAColor.prototype.brighten = function(amount) {
} }
RGBAColor.prototype.daltonize = function(type, amount) { RGBAColor.prototype.daltonize = function(type) {
amount = typeof amount === "number" ? amount : 1.0; let cvd;
var cvd; if ( typeof type === 'string' ) {
if ( typeof type === "string" ) {
if ( Color.CVDMatrix.hasOwnProperty(type) ) if ( Color.CVDMatrix.hasOwnProperty(type) )
cvd = Color.CVDMatrix[type]; cvd = Color.CVDMatrix[type];
else else
throw "Invalid CVD matrix."; throw new Error('Invalid CVD matrix');
} else } else
cvd = type; cvd = type;
var cvd_a = cvd[0], cvd_b = cvd[1], cvd_c = cvd[2], const cvd_a = cvd[0], cvd_b = cvd[1], cvd_c = cvd[2],
cvd_d = cvd[3], cvd_e = cvd[4], cvd_f = cvd[5], cvd_d = cvd[3], cvd_e = cvd[4], cvd_f = cvd[5],
cvd_g = cvd[6], cvd_h = cvd[7], cvd_i = cvd[8], cvd_g = cvd[6], cvd_h = cvd[7], cvd_i = cvd[8];
L, M, S, l, m, s, R, G, B, RR, GG, BB; //let L, M, S, l, m, s, R, G, B, RR, GG, BB;
// RGB to LMS matrix conversion // RGB to LMS matrix conversion
L = (17.8824 * this.r) + (43.5161 * this.g) + (4.11935 * this.b); const L = (17.8824 * this.r) + (43.5161 * this.g) + (4.11935 * this.b),
M = (3.45565 * this.r) + (27.1554 * this.g) + (3.86714 * this.b); M = (3.45565 * this.r) + (27.1554 * this.g) + (3.86714 * this.b),
S = (0.0299566 * this.r) + (0.184309 * this.g) + (1.46709 * this.b); S = (0.0299566 * this.r) + (0.184309 * this.g) + (1.46709 * this.b);
// Simulate color blindness // Simulate color blindness
l = (cvd_a * L) + (cvd_b * M) + (cvd_c * S); const l = (cvd_a * L) + (cvd_b * M) + (cvd_c * S),
m = (cvd_d * L) + (cvd_e * M) + (cvd_f * S); m = (cvd_d * L) + (cvd_e * M) + (cvd_f * S),
s = (cvd_g * L) + (cvd_h * M) + (cvd_i * S); s = (cvd_g * L) + (cvd_h * M) + (cvd_i * S);
// LMS to RGB matrix conversion // LMS to RGB matrix conversion
R = (0.0809444479 * l) + (-0.130504409 * m) + (0.116721066 * s); let R = (0.0809444479 * l) + (-0.130504409 * m) + (0.116721066 * s),
G = (-0.0102485335 * l) + (0.0540193266 * m) + (-0.113614708 * s); G = (-0.0102485335 * l) + (0.0540193266 * m) + (-0.113614708 * s),
B = (-0.000365296938 * l) + (-0.00412161469 * m) + (0.693511405 * s); B = (-0.000365296938 * l) + (-0.00412161469 * m) + (0.693511405 * s);
// Isolate invisible colors to color vision deficiency (calculate error matrix) // Isolate invisible colors to color vision deficiency (calculate error matrix)
R = this.r - R; R = this.r - R;
G = this.g - G; G = this.g - G;
B = this.b - B; B = this.b - B;
// Shift colors towards visible spectrum (apply error modifications) // Shift colors towards visible spectrum (apply error modifications)
RR = (0.0 * R) + (0.0 * G) + (0.0 * B); const RR = (0.0 * R) + (0.0 * G) + (0.0 * B),
GG = (0.7 * R) + (1.0 * G) + (0.0 * B); GG = (0.7 * R) + (1.0 * G) + (0.0 * B),
BB = (0.7 * R) + (0.0 * G) + (1.0 * B); BB = (0.7 * R) + (0.0 * G) + (1.0 * B);
// Add compensation to original values // Add compensation to original values
R = Math.min(Math.max(0, RR + this.r), 255); R = Math.min(Math.max(0, RR + this.r), 255);
G = Math.min(Math.max(0, GG + this.g), 255); G = Math.min(Math.max(0, GG + this.g), 255);
@ -334,12 +337,14 @@ HSLAColor.prototype.eq = function(hsl) {
HSLAColor.fromRGBA = function(r, g, b, a) { HSLAColor.fromRGBA = function(r, g, b, a) {
r /= 255; g /= 255; b /= 255; r /= 255; g /= 255; b /= 255;
var max = Math.max(r,g,b), const max = Math.max(r,g,b),
min = Math.min(r,g,b), min = Math.min(r,g,b),
h, s, l = Math.min(Math.max(0, (max+min) / 2), 1), l = Math.min(Math.max(0, (max+min) / 2), 1),
d = Math.min(Math.max(0, max - min), 1); d = Math.min(Math.max(0, max - min), 1);
let h, s;
if ( d === 0 ) if ( d === 0 )
h = s = 0; h = s = 0;
else { else {
@ -361,12 +366,17 @@ HSLAColor.fromRGBA = function(r, g, b, a) {
} }
HSLAColor.prototype.targetLuminance = function (target) { HSLAColor.prototype.targetLuminance = function (target) {
var s = this.s; let s = this.s,
min = 0,
max = 1;
s *= Math.pow(this.l > 0.5 ? -this.l : this.l - 1, 7) + 1; s *= Math.pow(this.l > 0.5 ? -this.l : this.l - 1, 7) + 1;
var min = 0, max = 1, d = (max - min) / 2, mid = min + d; let d = (max - min) / 2,
mid = min + d;
for (; d > 1/65536; d /= 2, mid = min + d) { for (; d > 1/65536; d /= 2, mid = min + d) {
var luminance = RGBAColor.fromHSLA(this.h, s, mid, 1).luminance() const luminance = RGBAColor.fromHSLA(this.h, s, mid, 1).luminance()
if (luminance > target) { if (luminance > target) {
max = mid; max = mid;
} else { } else {
@ -378,7 +388,7 @@ HSLAColor.prototype.targetLuminance = function (target) {
} }
HSLAColor.prototype.toRGBA = function() { return RGBAColor.fromHSLA(this.h, this.s, this.l, this.a); } HSLAColor.prototype.toRGBA = function() { return RGBAColor.fromHSLA(this.h, this.s, this.l, this.a); }
HSLAColor.prototype.toCSS = function() { return "hsl" + (this.a !== 1 ? "a" : "") + "(" + Math.round(this.h*360) + "," + Math.round(this.s*100) + "%," + Math.round(this.l*100) + "%" + (this.a !== 1 ? "," + this.a : "") + ")"; } HSLAColor.prototype.toCSS = function() { return `"hsl${this.a !== 1 ? 'a' : ''}(${Math.round(this.h*360)},${Math.round(this.s*100)}%,${Math.round(this.l*100)}%${this.a !== 1 ? `,${this.a}` : ''})`; }
HSLAColor.prototype.toHSVA = function() { return this.toRGBA().toHSVA(); } HSLAColor.prototype.toHSVA = function() { return this.toRGBA().toHSVA(); }
HSLAColor.prototype.toXYZA = function() { return this.toRGBA().toXYZA(); } HSLAColor.prototype.toXYZA = function() { return this.toRGBA().toXYZA(); }
HSLAColor.prototype.toLUVA = function() { return this.toRGBA().toLUVA(); } HSLAColor.prototype.toLUVA = function() { return this.toRGBA().toLUVA(); }
@ -397,14 +407,15 @@ HSVAColor.prototype.eq = function(hsv) { return hsv.h === this.h && hsv.s === th
HSVAColor.fromRGBA = function(r, g, b, a) { HSVAColor.fromRGBA = function(r, g, b, a) {
r /= 255; g /= 255; b /= 255; r /= 255; g /= 255; b /= 255;
var max = Math.max(r, g, b), const max = Math.max(r, g, b),
min = Math.min(r, g, b), min = Math.min(r, g, b),
d = Math.min(Math.max(0, max - min), 1), d = Math.min(Math.max(0, max - min), 1),
h,
s = max === 0 ? 0 : d / max, s = max === 0 ? 0 : d / max,
v = max; v = max;
let h;
if ( d === 0 ) if ( d === 0 )
h = 0; h = 0;
else { else {
@ -442,7 +453,7 @@ HSVAColor.prototype._a = function(a) { return new HSVAColor(this.h, this.s, this
XYZAColor.prototype.eq = function(xyz) { return xyz.x === this.x && xyz.y === this.y && xyz.z === this.z; } XYZAColor.prototype.eq = function(xyz) { return xyz.x === this.x && xyz.y === this.y && xyz.z === this.z; }
XYZAColor.fromRGBA = function(r, g, b, a) { XYZAColor.fromRGBA = function(r, g, b, a) {
var R = bit2linear(r / 255), const R = bit2linear(r / 255),
G = bit2linear(g / 255), G = bit2linear(g / 255),
B = bit2linear(b / 255); B = bit2linear(b / 255);
@ -455,20 +466,19 @@ XYZAColor.fromRGBA = function(r, g, b, a) {
} }
XYZAColor.fromLUVA = function(l, u, v, alpha) { XYZAColor.fromLUVA = function(l, u, v, alpha) {
var deltaGammaFactor = 1 / (XYZAColor.WHITE.x + 15 * XYZAColor.WHITE.y + 3 * XYZAColor.WHITE.z); const deltaGammaFactor = 1 / (XYZAColor.WHITE.x + 15 * XYZAColor.WHITE.y + 3 * XYZAColor.WHITE.z),
var uDeltaGamma = 4 * XYZAColor.WHITE.x * deltaGammaFactor; uDeltaGamma = 4 * XYZAColor.WHITE.x * deltaGammaFactor,
var vDeltagamma = 9 * XYZAColor.WHITE.y * deltaGammaFactor; vDeltagamma = 9 * XYZAColor.WHITE.y * deltaGammaFactor;
// XYZAColor.EPSILON * XYZAColor.KAPPA = 8 // XYZAColor.EPSILON * XYZAColor.KAPPA = 8
var Y = (l > 8) ? Math.pow((l + 16) / 116, 3) : l / XYZAColor.KAPPA; const Y = (l > 8) ? Math.pow((l + 16) / 116, 3) : l / XYZAColor.KAPPA,
a = 1/3 * (((52 * l) / (u + 13 * l * uDeltaGamma)) - 1),
b = -5 * Y,
c = -1/3,
d = Y * (((39 * l) / (v + 13 * l * vDeltagamma)) - 5),
var a = 1/3 * (((52 * l) / (u + 13 * l * uDeltaGamma)) - 1); X = (d - b) / (a - c),
var b = -5 * Y; Z = X * a + b;
var c = -1/3;
var d = Y * (((39 * l) / (v + 13 * l * vDeltagamma)) - 5);
var X = (d - b) / (a - c);
var Z = X * a + b;
return new XYZAColor(X, Y, Z, alpha === undefined ? 1 : alpha); return new XYZAColor(X, Y, Z, alpha === undefined ? 1 : alpha);
} }
@ -496,25 +506,25 @@ XYZAColor.WHITE = (new RGBAColor(255, 255, 255, 1)).toXYZA();
LUVAColor.prototype.eq = function(luv) { return luv.l === this.l && luv.u === this.u && luv.v === this.v; } LUVAColor.prototype.eq = function(luv) { return luv.l === this.l && luv.u === this.u && luv.v === this.v; }
LUVAColor.fromXYZA = function(X, Y, Z, a) { LUVAColor.fromXYZA = function(X, Y, Z, a) {
var deltaGammaFactor = 1 / (XYZAColor.WHITE.x + 15 * XYZAColor.WHITE.y + 3 * XYZAColor.WHITE.z); const deltaGammaFactor = 1 / (XYZAColor.WHITE.x + 15 * XYZAColor.WHITE.y + 3 * XYZAColor.WHITE.z),
var uDeltaGamma = 4 * XYZAColor.WHITE.x * deltaGammaFactor; uDeltaGamma = 4 * XYZAColor.WHITE.x * deltaGammaFactor,
var vDeltagamma = 9 * XYZAColor.WHITE.y * deltaGammaFactor; vDeltagamma = 9 * XYZAColor.WHITE.y * deltaGammaFactor,
var yGamma = Y / XYZAColor.WHITE.y; yGamma = Y / XYZAColor.WHITE.y;
var deltaDivider = (X + 15 * Y + 3 * Z);
let deltaDivider = (X + 15 * Y + 3 * Z);
if (deltaDivider === 0) { if (deltaDivider === 0) {
deltaDivider = 1; deltaDivider = 1;
} }
var deltaFactor = 1 / deltaDivider; const deltaFactor = 1 / deltaDivider,
var uDelta = 4 * X * deltaFactor; uDelta = 4 * X * deltaFactor,
var vDelta = 9 * Y * deltaFactor; vDelta = 9 * Y * deltaFactor,
var L = (yGamma > XYZAColor.EPSILON) ? 116 * Math.pow(yGamma, 1/3) - 16 : XYZAColor.KAPPA * yGamma; L = (yGamma > XYZAColor.EPSILON) ? 116 * Math.pow(yGamma, 1/3) - 16 : XYZAColor.KAPPA * yGamma,
var u = 13 * L * (uDelta - uDeltaGamma); u = 13 * L * (uDelta - uDeltaGamma),
var v = 13 * L * (vDelta - vDeltagamma); v = 13 * L * (vDelta - vDeltagamma);
return new LUVAColor(L, u, v, a === undefined ? 1 : a); return new LUVAColor(L, u, v, a === undefined ? 1 : a);
} }
@ -627,6 +637,17 @@ export class ColorAdjuster {
const hsl = rgb.toHSLA(); const hsl = rgb.toHSLA();
rgb = hsl._l(Math.min(Math.max(0, 0.9 * hsl.l), 1)).toRGBA(); rgb = hsl._l(Math.min(Math.max(0, 0.9 * hsl.l), 1)).toRGBA();
} }
} else if ( this._mode === 4 ) {
// RGB Loop
let i = 0;
if ( this._dark )
while ( rgb.luminance() < 0.15 && i++ < 127 )
rgb = rgb.brighten();
else
while ( rgb.luminance() > 0.3 && i++ < 127 )
rgb = rgb.brighten(-1);
} }
const out = this._cache[color] = rgb.toHex(); const out = this._cache[color] = rgb.toHex();