2018-03-07 00:37:14 +01:00
|
|
|
/**
|
|
|
|
* BetterDiscord Emote Module
|
|
|
|
* Copyright (c) 2015-present Jiiks/JsSucks - https://github.com/Jiiks / https://github.com/JsSucks
|
|
|
|
* All rights reserved.
|
|
|
|
* https://betterdiscord.net
|
|
|
|
*
|
|
|
|
* This source code is licensed under the MIT license found in the
|
|
|
|
* LICENSE file in the root directory of this source tree.
|
|
|
|
*/
|
2018-03-21 21:47:46 +01:00
|
|
|
|
2018-08-16 13:33:22 +02:00
|
|
|
import BuiltinModule from './BuiltinModule';
|
2018-03-22 03:13:32 +01:00
|
|
|
import path from 'path';
|
2018-08-19 19:34:32 +02:00
|
|
|
import { request } from 'vendor';
|
|
|
|
|
2019-03-10 18:45:20 +01:00
|
|
|
import { Utils, FileUtils, ClientLogger as Logger } from 'common';
|
2018-08-25 16:45:52 +02:00
|
|
|
import { DiscordApi, Settings, Globals, Reflection, ReactComponents, Database } from 'modules';
|
|
|
|
import { DiscordContextMenu } from 'ui';
|
2018-03-21 21:47:46 +01:00
|
|
|
|
2018-08-16 13:33:22 +02:00
|
|
|
import Emote from './EmoteComponent.js';
|
2018-08-17 16:05:23 +02:00
|
|
|
import Autocomplete from '../ui/components/common/Autocomplete.vue';
|
|
|
|
|
|
|
|
import GlobalAc from '../ui/autocomplete';
|
|
|
|
|
|
|
|
const EMOTE_SOURCES = [
|
|
|
|
'https://static-cdn.jtvnw.net/emoticons/v1/:id/1.0',
|
|
|
|
'https://cdn.frankerfacez.com/emoticon/:id/1',
|
|
|
|
'https://cdn.betterttv.net/emote/:id/1x'
|
2018-08-23 00:44:46 +02:00
|
|
|
];
|
2018-03-07 00:37:14 +01:00
|
|
|
|
2018-08-16 13:33:22 +02:00
|
|
|
export default new class EmoteModule extends BuiltinModule {
|
2018-03-22 03:13:32 +01:00
|
|
|
|
2018-08-25 16:43:29 +02:00
|
|
|
/* Getters */
|
|
|
|
|
|
|
|
get moduleName() { return 'EmoteModule' }
|
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
/**
|
|
|
|
* @returns {String} Path to local emote database
|
|
|
|
*/
|
2018-08-16 13:33:22 +02:00
|
|
|
get dbpath() { return path.join(Globals.getPath('data'), 'emotes.json') }
|
2018-08-19 19:34:32 +02:00
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
/**
|
|
|
|
* @returns {Map} Cached raw emote database
|
|
|
|
*/
|
2018-08-16 13:33:22 +02:00
|
|
|
get database() { return this._db || (this._db = new Map()) }
|
2018-03-31 02:17:42 +02:00
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
/**
|
|
|
|
* @returns {Array} Favourite emotes
|
|
|
|
*/
|
2018-08-16 13:33:22 +02:00
|
|
|
get favourites() { return this._favourites || (this._favourites = []) }
|
2018-06-12 21:56:40 +02:00
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
/**
|
|
|
|
* @returns {Array} Most used emotes
|
|
|
|
*/
|
2018-08-19 20:00:53 +02:00
|
|
|
get mostUsed() { return this._mostUsed || (this._mostUsed = []) }
|
|
|
|
|
2018-08-16 13:33:22 +02:00
|
|
|
get settingPath() { return ['emotes', 'default', 'enable'] }
|
2018-06-12 21:56:40 +02:00
|
|
|
|
2018-08-16 13:33:22 +02:00
|
|
|
async enabled() {
|
2018-08-22 15:31:49 +02:00
|
|
|
// Add favourite button to context menu
|
2018-08-22 23:16:39 +02:00
|
|
|
this.favCm = DiscordContextMenu.add(target => [
|
2018-08-22 15:31:49 +02:00
|
|
|
{
|
|
|
|
text: 'Favourite',
|
|
|
|
type: 'toggle',
|
2018-08-23 00:44:46 +02:00
|
|
|
checked: target && target.alt && this.isFavourite(target.alt.replace(/;/g, '')),
|
2018-08-22 16:17:37 +02:00
|
|
|
onChange: (checked, target) => {
|
|
|
|
const { alt } = target;
|
2018-08-22 17:49:20 +02:00
|
|
|
if (!alt) return false;
|
|
|
|
|
2018-08-23 00:44:46 +02:00
|
|
|
const emote = alt.replace(/;/g, '');
|
2018-08-22 17:49:20 +02:00
|
|
|
|
2018-08-23 00:44:46 +02:00
|
|
|
if (!checked) return this.removeFavourite(emote), false;
|
|
|
|
return this.addFavourite(emote), true;
|
2018-08-22 16:17:37 +02:00
|
|
|
}
|
2018-08-22 15:31:49 +02:00
|
|
|
}
|
2018-08-23 00:44:46 +02:00
|
|
|
], target => target.closest('.bd-emote'));
|
2018-08-17 16:05:23 +02:00
|
|
|
|
2018-08-16 13:33:22 +02:00
|
|
|
if (!this.database.size) {
|
|
|
|
await this.loadLocalDb();
|
2018-03-31 05:37:26 +02:00
|
|
|
}
|
2018-03-31 02:17:42 +02:00
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
// Read favourites and most used from database
|
2018-08-23 00:44:46 +02:00
|
|
|
await this.loadUserData();
|
2018-08-25 16:43:29 +02:00
|
|
|
}
|
2018-08-20 01:35:51 +02:00
|
|
|
|
2018-08-25 16:43:29 +02:00
|
|
|
async disabled() {
|
|
|
|
DiscordContextMenu.remove(this.favCm);
|
2018-03-31 02:17:42 +02:00
|
|
|
}
|
|
|
|
|
2018-08-25 16:43:29 +02:00
|
|
|
/* Methods */
|
|
|
|
|
2018-08-23 00:44:46 +02:00
|
|
|
/**
|
|
|
|
* Adds an emote to favourites.
|
|
|
|
* @param {Object|String} emote
|
|
|
|
* @return {Promise}
|
|
|
|
*/
|
2018-08-22 17:49:20 +02:00
|
|
|
addFavourite(emote) {
|
2018-08-23 00:44:46 +02:00
|
|
|
if (this.isFavourite(emote)) return;
|
|
|
|
if (typeof emote === 'string') emote = this.findByName(emote, true);
|
2018-08-22 17:49:20 +02:00
|
|
|
this.favourites.push(emote);
|
2018-08-23 00:44:46 +02:00
|
|
|
return this.saveUserData();
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Removes an emote from favourites.
|
|
|
|
* @param {Object|String} emote
|
|
|
|
* @return {Promise}
|
|
|
|
*/
|
|
|
|
removeFavourite(emote) {
|
|
|
|
if (!this.isFavourite(emote)) return;
|
|
|
|
Utils.removeFromArray(this.favourites, e => e.name === emote || e.name === emote.name, true);
|
|
|
|
return this.saveUserData();
|
2018-08-22 17:49:20 +02:00
|
|
|
}
|
|
|
|
|
2018-08-23 00:44:46 +02:00
|
|
|
/**
|
|
|
|
* Checks if an emote is in favourites.
|
|
|
|
* @param {Object|String} emote
|
|
|
|
* @return {Boolean}
|
|
|
|
*/
|
|
|
|
isFavourite(emote) {
|
|
|
|
return !!this.favourites.find(e => e.name === emote || e.name === emote.name);
|
2018-03-31 02:17:42 +02:00
|
|
|
}
|
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
/**
|
|
|
|
* Load emotes from local database
|
|
|
|
*/
|
|
|
|
async loadLocalDb() {
|
|
|
|
const emotes = await FileUtils.readJsonFromFile(this.dbpath);
|
|
|
|
for (const [index, emote] of emotes.entries()) {
|
|
|
|
const { type, id, src, value } = emote;
|
|
|
|
if (index % 10000 === 0) await Utils.wait();
|
2018-08-16 13:33:22 +02:00
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
this.database.set(id, { id: emote.value.id || value, type });
|
2018-03-07 00:37:14 +01:00
|
|
|
}
|
2019-03-10 18:45:20 +01:00
|
|
|
|
|
|
|
Logger.log('EmoteModule', ['Loaded emote database']);
|
2018-03-13 23:34:03 +01:00
|
|
|
}
|
|
|
|
|
2018-08-23 00:44:46 +02:00
|
|
|
async loadUserData() {
|
|
|
|
const userData = await Database.findOne({ type: 'builtin', id: 'EmoteModule' });
|
|
|
|
if (!userData) return;
|
|
|
|
|
|
|
|
if (userData.hasOwnProperty('favourites')) this._favourites = userData.favourites;
|
|
|
|
if (userData.hasOwnProperty('mostused')) this._mostUsed = userData.mostused;
|
|
|
|
}
|
|
|
|
|
|
|
|
async saveUserData() {
|
|
|
|
await Database.insertOrUpdate({ type: 'builtin', id: 'EmoteModule' }, {
|
|
|
|
type: 'builtin',
|
|
|
|
id: 'EmoteModule',
|
|
|
|
favourites: this.favourites,
|
|
|
|
mostused: this.mostUsed
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2018-08-25 16:43:29 +02:00
|
|
|
/**
|
|
|
|
* Add/update emote to most used
|
|
|
|
* @param {Object} emote emote to add/update
|
|
|
|
* @return {Promise}
|
|
|
|
*/
|
|
|
|
addToMostUsed(emote) {
|
|
|
|
const isMostUsed = this.mostUsed.find(mu => mu.key === emote.name);
|
|
|
|
if (isMostUsed) {
|
|
|
|
isMostUsed.useCount += 1;
|
|
|
|
} else {
|
|
|
|
this.mostUsed.push({
|
|
|
|
key: emote.name,
|
|
|
|
id: emote.id,
|
|
|
|
type: emote.type,
|
|
|
|
useCount: 1
|
|
|
|
});
|
|
|
|
}
|
|
|
|
// Save most used to database
|
|
|
|
// TODO only save first n
|
|
|
|
return this.saveUserData();
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Find an emote by name
|
|
|
|
* @param {String} name Emote name
|
|
|
|
* @param {Boolean} simple Simple object or Emote instance
|
|
|
|
* @returns {Object|Emote}
|
|
|
|
*/
|
|
|
|
findByName(name, simple = false) {
|
|
|
|
const emote = this.database.get(name);
|
|
|
|
if (!emote) return null;
|
|
|
|
return this.parseEmote(name, emote, simple);
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Parse emote object
|
|
|
|
* @param {String} name Emote name
|
|
|
|
* @param {Object} emote Emote object
|
|
|
|
* @param {Boolean} simple Simple object or Emote instance
|
|
|
|
* @returns {Object|Emote}
|
|
|
|
*/
|
|
|
|
parseEmote(name, emote, simple = false) {
|
|
|
|
const { type, id } = emote;
|
|
|
|
if (type < 0 || type > 2) return null;
|
|
|
|
return simple ? { type, id, name } : new Emote(type, id, name);
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Search for anything else
|
|
|
|
* @param {any} regex
|
|
|
|
* @param {any} limit
|
|
|
|
*/
|
|
|
|
search(regex, limit = 10) {
|
|
|
|
if (typeof regex === 'string') regex = new RegExp(regex, 'i');
|
|
|
|
const matching = [];
|
|
|
|
|
|
|
|
for (const [key, value] of this.database.entries()) {
|
|
|
|
if (matching.length >= limit) break;
|
|
|
|
if (regex.test(key)) matching.push({ key, value })
|
|
|
|
}
|
|
|
|
|
|
|
|
return matching;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Patches */
|
|
|
|
async applyPatches() {
|
|
|
|
this.patchMessageContent();
|
|
|
|
this.patchSendAndEdit();
|
2019-03-11 18:56:29 +01:00
|
|
|
this.patchSpoiler();
|
2019-03-10 22:29:17 +01:00
|
|
|
|
|
|
|
const MessageAccessories = await ReactComponents.getComponent('MessageAccessories');
|
|
|
|
this.patch(MessageAccessories.component.prototype, 'render', this.afterRenderMessageAccessories, 'after');
|
|
|
|
MessageAccessories.forceUpdateAll();
|
2018-08-25 16:43:29 +02:00
|
|
|
}
|
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
/**
|
|
|
|
* Patches MessageContent render method
|
|
|
|
*/
|
2018-08-16 13:33:22 +02:00
|
|
|
async patchMessageContent() {
|
2019-03-10 17:58:24 +01:00
|
|
|
const MessageContent = await ReactComponents.getComponent('MessageContent');
|
2018-11-26 06:22:15 +01:00
|
|
|
this.childPatch(MessageContent.component.prototype, 'render', ['props', 'children'], this.afterRenderMessageContent);
|
2018-08-16 13:33:22 +02:00
|
|
|
MessageContent.forceUpdateAll();
|
2018-03-13 23:34:03 +01:00
|
|
|
}
|
|
|
|
|
2018-08-25 16:43:29 +02:00
|
|
|
/**
|
|
|
|
* Patches MessageActions send and edit
|
|
|
|
*/
|
|
|
|
patchSendAndEdit() {
|
|
|
|
const { MessageActions } = Reflection.modules;
|
|
|
|
this.patch(MessageActions, 'sendMessage', this.handleSendMessage, 'instead');
|
|
|
|
this.patch(MessageActions, 'editMessage', this.handleEditMessage, 'instead');
|
|
|
|
}
|
|
|
|
|
2019-03-11 18:56:29 +01:00
|
|
|
async patchSpoiler() {
|
|
|
|
const Spoiler = await ReactComponents.getComponent('Spoiler');
|
|
|
|
this.childPatch(Spoiler.component.prototype, 'render', ['props', 'children', 'props', 'children'], this.afterRenderSpoiler);
|
|
|
|
Spoiler.forceUpdateAll();
|
|
|
|
}
|
|
|
|
|
|
|
|
afterRenderSpoiler(component, args, retVal) {
|
|
|
|
const markup = Utils.findInReactTree(retVal, filter =>
|
|
|
|
filter &&
|
|
|
|
filter.className &&
|
|
|
|
filter.className.includes('inlineContent'));
|
|
|
|
if (!markup) return;
|
|
|
|
|
|
|
|
markup.children = this.processMarkup(markup.children);
|
|
|
|
}
|
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
/**
|
|
|
|
* Handle message render
|
|
|
|
*/
|
2018-08-16 13:33:22 +02:00
|
|
|
afterRenderMessageContent(component, args, retVal) {
|
|
|
|
const markup = Utils.findInReactTree(retVal, filter =>
|
|
|
|
filter &&
|
|
|
|
filter.className &&
|
|
|
|
filter.className.includes('markup') &&
|
|
|
|
filter.children.length >= 2);
|
|
|
|
if (!markup) return;
|
|
|
|
markup.children[1] = this.processMarkup(markup.children[1]);
|
2018-03-07 00:37:14 +01:00
|
|
|
}
|
2018-03-10 04:29:04 +01:00
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
/**
|
|
|
|
* Handle send message
|
|
|
|
*/
|
2019-03-10 22:29:17 +01:00
|
|
|
async handleSendMessage(MessageActions, args, orig) {
|
2018-08-19 19:34:32 +02:00
|
|
|
if (!args.length) return orig(...args);
|
|
|
|
const { content } = args[1];
|
|
|
|
if (!content) return orig(...args);
|
|
|
|
|
2019-03-10 22:29:17 +01:00
|
|
|
Logger.log('EmoteModule', ['Sending message', MessageActions, args, orig]);
|
|
|
|
|
2018-08-19 19:34:32 +02:00
|
|
|
const emoteAsImage = Settings.getSetting('emotes', 'default', 'emoteasimage').value &&
|
|
|
|
(DiscordApi.currentChannel.type === 'DM' || DiscordApi.currentChannel.checkPermissions(DiscordApi.modules.DiscordPermissions.ATTACH_FILES));
|
|
|
|
|
|
|
|
if (!emoteAsImage || content.split(' ').length > 1) {
|
|
|
|
args[1].content = args[1].content.split(' ').map(word => {
|
|
|
|
const isEmote = /;(.*?);/g.exec(word);
|
2018-08-19 20:00:53 +02:00
|
|
|
if (isEmote) {
|
|
|
|
const emote = this.findByName(isEmote[1], true);
|
|
|
|
if (!emote) return word;
|
|
|
|
this.addToMostUsed(emote);
|
2019-03-10 22:29:17 +01:00
|
|
|
return emote ? `;${isEmote[1]};` : word;
|
2018-08-19 20:00:53 +02:00
|
|
|
}
|
|
|
|
return word;
|
2018-08-19 19:34:32 +02:00
|
|
|
}).join(' ');
|
|
|
|
return orig(...args);
|
|
|
|
}
|
|
|
|
|
|
|
|
const isEmote = /;(.*?);/g.exec(content);
|
|
|
|
if (!isEmote) return orig(...args);
|
|
|
|
|
|
|
|
const emote = this.findByName(isEmote[1]);
|
|
|
|
if (!emote) return orig(...args);
|
2018-08-19 20:00:53 +02:00
|
|
|
this.addToMostUsed(emote);
|
2018-08-19 19:34:32 +02:00
|
|
|
|
2018-08-24 18:05:27 +02:00
|
|
|
const FileActions = Reflection.module.byProps('makeFile');
|
|
|
|
const Uploader = Reflection.module.byProps('instantBatchUpload');
|
2018-08-19 19:34:32 +02:00
|
|
|
|
|
|
|
request.get(emote.props.src, { encoding: 'binary' }).then(res => {
|
|
|
|
const arr = new Uint8Array(new ArrayBuffer(res.length));
|
|
|
|
for (let i = 0; i < res.length; i++) arr[i] = res.charCodeAt(i);
|
|
|
|
const suffix = arr[0] === 71 && arr[1] === 73 && arr[2] === 70 ? '.gif' : '.png';
|
2018-08-22 14:50:20 +02:00
|
|
|
Uploader.upload(args[0], FileActions.makeFile(arr, `${emote.name}.bdemote${suffix}`));
|
2018-08-19 19:34:32 +02:00
|
|
|
});
|
2018-03-10 04:29:04 +01:00
|
|
|
}
|
2018-03-22 03:13:32 +01:00
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
/**
|
|
|
|
* Handle edit message
|
|
|
|
*/
|
|
|
|
handleEditMessage(component, args, orig) {
|
|
|
|
if (!args.length) return orig(...args);
|
|
|
|
const { content } = args[2];
|
|
|
|
if (!content) return orig(...args);
|
|
|
|
args[2].content = args[2].content.split(' ').map(word => {
|
|
|
|
const isEmote = /;(.*?);/g.exec(word);
|
2019-03-10 22:29:17 +01:00
|
|
|
return isEmote ? `;${isEmote[1]};` : word;
|
2018-08-20 02:26:56 +02:00
|
|
|
}).join(' ');
|
|
|
|
return orig(...args);
|
|
|
|
}
|
2018-05-29 17:58:57 +02:00
|
|
|
|
2018-08-22 15:20:26 +02:00
|
|
|
/**
|
2019-03-10 22:29:17 +01:00
|
|
|
* Handle MessageAccessories render
|
2018-08-22 15:20:26 +02:00
|
|
|
*/
|
2019-03-10 22:29:17 +01:00
|
|
|
afterRenderMessageAccessories(component, args, retVal) {
|
|
|
|
if (!component.props || !component.props.message) return;
|
|
|
|
if (!component.props.message.attachments || component.props.message.attachments.length !== 1) return;
|
2018-08-22 15:20:26 +02:00
|
|
|
|
2019-03-10 22:29:17 +01:00
|
|
|
const filename = component.props.message.attachments[0].filename;
|
|
|
|
const match = filename.match(/([^/]*)\.bdemote\.(gif|png)$/i);
|
|
|
|
if (!match) return;
|
|
|
|
|
|
|
|
const emote = this.findByName(match[1]);
|
2018-08-22 15:20:26 +02:00
|
|
|
if (!emote) return;
|
2019-03-10 22:29:17 +01:00
|
|
|
|
|
|
|
emote.jumboable = true;
|
|
|
|
retVal.props.children[2] = emote.render();
|
2018-08-22 15:20:26 +02:00
|
|
|
}
|
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
/**
|
|
|
|
* Inject emotes into markup
|
|
|
|
*/
|
|
|
|
processMarkup(markup) {
|
|
|
|
const newMarkup = [];
|
|
|
|
if (!(markup instanceof Array)) return markup;
|
2018-08-22 15:20:26 +02:00
|
|
|
|
2018-08-20 02:26:56 +02:00
|
|
|
const jumboable = !markup.some(child => {
|
|
|
|
if (typeof child !== 'string') return false;
|
|
|
|
return / \w+/g.test(child);
|
|
|
|
});
|
|
|
|
|
|
|
|
for (const child of markup) {
|
|
|
|
if (typeof child !== 'string') {
|
|
|
|
if (typeof child === 'object') {
|
|
|
|
const isEmoji = Utils.findInReactTree(child, 'emojiName');
|
|
|
|
if (isEmoji) child.props.children.props.jumboable = jumboable;
|
|
|
|
}
|
|
|
|
newMarkup.push(child);
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
|
2019-03-10 22:29:17 +01:00
|
|
|
if (!/;(\w+);/g.test(child)) {
|
2018-08-20 02:26:56 +02:00
|
|
|
newMarkup.push(child);
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
|
|
|
|
const words = child.split(/([^\s]+)([\s]|$)/g).filter(f => f !== '');
|
|
|
|
|
|
|
|
let s = '';
|
|
|
|
for (const word of words) {
|
2019-03-10 22:29:17 +01:00
|
|
|
const isemote = /;(.*?);/g.exec(word);
|
2018-08-20 02:26:56 +02:00
|
|
|
if (!isemote) {
|
|
|
|
s += word;
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
|
|
|
|
const emote = this.findByName(isemote[1]);
|
|
|
|
if (!emote) {
|
|
|
|
s += word;
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
|
|
|
|
newMarkup.push(s);
|
|
|
|
s = '';
|
|
|
|
|
|
|
|
emote.jumboable = jumboable;
|
|
|
|
newMarkup.push(emote.render());
|
|
|
|
}
|
|
|
|
if (s !== '') newMarkup.push(s);
|
2018-08-16 13:33:22 +02:00
|
|
|
}
|
2018-08-20 02:26:56 +02:00
|
|
|
if (newMarkup.length === 1) return newMarkup[0];
|
|
|
|
return newMarkup;
|
2018-05-29 17:58:57 +02:00
|
|
|
}
|
|
|
|
|
2018-03-07 00:37:14 +01:00
|
|
|
}
|