Refactor Vue injector and sparkplug and move contributors to data

This commit is contained in:
Samuel Elliott 2018-03-20 21:11:11 +00:00
parent 048abaeeed
commit 994faf94d6
No known key found for this signature in database
GPG Key ID: 8420C7CDE43DC4D6
17 changed files with 219 additions and 136 deletions

View File

@ -15,9 +15,6 @@
"url": "https://github.com/Jiiks/BetterDiscordApp.git"
},
"private": false,
"devDependencies": {
},
"scripts": {
"build": "webpack --progress --colors",
"watch": "webpack --progress --colors --watch"

View File

@ -9,11 +9,10 @@
data() {
return {
favourite: false
}
};
},
props: ['src', 'name'],
methods: {
},
methods: {},
beforeMount() {
// Check favourite state
}

View File

@ -131,12 +131,11 @@ export default class {
}
const { bdemoteName, bdemoteSrc } = root.dataset;
if (!bdemoteName || !bdemoteSrc) return;
VueInjector.inject(
root,
DOM.createElement('span'),
{ EmoteComponent },
`<EmoteComponent src="${bdemoteSrc}" name="${bdemoteName}"/>`
);
VueInjector.inject(root, {
components: { EmoteComponent },
data: { src: bdemoteSrc, name: bdemoteName },
template: '<EmoteComponent :src="src" :name="name" />'
}, DOM.createElement('span'));
root.classList.add('bd-is-emote');
}

View File

@ -0,0 +1,65 @@
[
{
"__user": "Jiiks#5000",
"id": "81388395867156480",
"developer": true,
"webdev": true,
"contributor": true
},
{
"__user": "Pohky#0156",
"id": "98003542823944192",
"developer": true,
"webdev": false,
"contributor": true
},
{
"__user": "Hammock#3110",
"id": "138850472541814784",
"developer": false,
"webdev": true,
"contributor": true
},
{
"__user": "Zerebos#7790",
"id": "249746236008169473",
"developer": true,
"webdev": false,
"contributor": true
},
{
"__user": "Pierce#1337",
"id": "125367412370440192",
"developer": true,
"webdev": false,
"contributor": true
},
{
"__user": "Samuel Elliott#2764",
"id": "284056145272766465",
"developer": true,
"webdev": false,
"contributor": true
},
{
"__user": "Lilian Tedone#6223",
"id": "184021060562321419",
"developer": false,
"webdev": false,
"contributor": true
},
{
"__user": "samfun123#8972",
"id": "76052829285916672",
"developer": false,
"webdev": false,
"contributor": true
},
{
"__user": "samogot#4379",
"id": "171005991272316937",
"developer": false,
"webdev": false,
"contributor": true
}
]

View File

@ -91,7 +91,6 @@
{
"id": "css",
"text": "CSS Editor",
"hidden": true,
"settings": [
{
"category": "default",

View File

@ -10,9 +10,10 @@
import { DOM, BdUI, Modals, Reflection } from 'ui';
import BdCss from './styles/index.scss';
import { Patcher, MonkeyPatch, Vendor, Events, CssEditor, Globals, ExtModuleManager, PluginManager, ThemeManager, ModuleManager, WebpackModules, Settings, Database, ReactComponents, ReactAutoPatcher, DiscordApi } from 'modules';
import { Events, CssEditor, Globals, Settings, Database, Updater, ModuleManager, PluginManager, ThemeManager, ExtModuleManager, Vendor, WebpackModules, Patcher, MonkeyPatch, ReactComponents, ReactAutoPatcher, DiscordApi } from 'modules';
import { ClientLogger as Logger, ClientIPC, Utils } from 'common';
import { EmoteModule } from 'builtin';
const ignoreExternal = false;
const DEV = true;
@ -20,29 +21,16 @@ class BetterDiscord {
constructor() {
this._bd = {
DOM,
BdUI,
Modals,
Reflection,
Patcher,
MonkeyPatch,
DOM, BdUI, Modals, Reflection,
Events, CssEditor, Globals, Settings, Database, Updater,
ModuleManager, PluginManager, ThemeManager, ExtModuleManager,
Vendor,
Events,
CssEditor,
Globals,
ExtModuleManager,
PluginManager,
ThemeManager,
ModuleManager,
WebpackModules,
Settings,
Database,
ReactComponents,
DiscordApi,
Logger,
ClientIPC,
Utils,
EmoteModule
WebpackModules, Patcher, MonkeyPatch, ReactComponents, DiscordApi,
EmoteModule,
Logger, ClientIPC, Utils
};
const developermode = Settings.getSetting('core', 'advanced', 'developer-mode');
@ -63,14 +51,16 @@ class BetterDiscord {
await Database.init();
await Settings.loadSettings();
await ModuleManager.initModules();
Modals.showContentManagerErrors();
if (!ignoreExternal) {
await ExtModuleManager.loadAllModules(true);
await PluginManager.loadAllPlugins(true);
await ThemeManager.loadAllThemes(true);
}
if (!Settings.get('core', 'advanced', 'ignore-content-manager-errors'))
Modals.showContentManagerErrors();
Events.emit('ready');
Events.emit('discord-ready');
EmoteModule.observe();
@ -90,7 +80,7 @@ class BetterDiscord {
if (window.BetterDiscord) {
Logger.log('main', 'Attempting to inject again?');
} else {
let instance = null;
let instance;
Events.on('autopatcher', () => instance = new BetterDiscord());
ReactAutoPatcher.autoPatch().then(() => Events.emit('autopatcher'));
}

View File

@ -8,9 +8,10 @@
* LICENSE file in the root directory of this source tree.
*/
import sparkplug from 'sparkplug';
import { ClientIPC } from 'bdipc';
import Module from './module';
import Events from './events';
import { ClientIPC } from 'bdipc';
export default new class extends Module {
@ -31,20 +32,18 @@ export default new class extends Module {
first() {
(async() => {
const config = await ClientIPC.send('getConfig');
this.setState(config);
this.setState({ config });
// This is for Discord to stop error reporting :3
window.BetterDiscord = {
'version': config.version,
'v': config.version
version: config.version,
v: config.version
};
window.jQuery = {};
if (window.__bd) {
this.setState(window.__bd);
window.__bd = {
setWS: this.setWS
}
if (sparkplug.bd) {
this.setState({ bd: sparkplug.bd });
sparkplug.bd.setWS = this.setWS;
}
Events.emit('global-ready');
@ -60,19 +59,43 @@ export default new class extends Module {
}
getObject(name) {
return this.state[name];
return this.config[name] || this.bd[name];
}
get bd() {
return this.state.bd;
}
get localStorage() {
return this.bd.localStorage;
}
get webSocket() {
return this.bd.wsHook;
}
get WebSocket() {
return this.bd.wsOrig;
}
get ignited() {
return this.bd.ignited;
}
get config() {
return this.state.config;
}
get paths() {
return this.config.paths;
}
getPath(id) {
return this.state.paths.find(path => path.id === id).path;
return this.paths.find(path => path.id === id).path;
}
static get paths() {
return this.state.paths;
}
static get version() {
return this.state.version;
get version() {
return this.config.version;
}
}

View File

@ -8,12 +8,14 @@
* LICENSE file in the root directory of this source tree.
*/
/*Module Manager initializes all modules when everything is ready*/
import { ClientLogger as Logger } from 'common';
import { Events, SocketProxy, EventHook, CssEditor } from 'modules';
import { ProfileBadges } from 'ui';
import Updater from './updater';
/**
* Module Manager initializes all modules when everything is ready
*/
export default class {
static get modules() {
@ -31,7 +33,7 @@ export default class {
try {
if (module.init && module.init instanceof Function) module.init();
} catch (err) {
console.log(`Failed to initialize module: ${err}`);
Logger.err('Module Manager', ['Failed to initialize module:', err]);
}
}
return true;

View File

@ -1,19 +1,23 @@
export { default as Events } from './events';
export { default as Settings } from './settings';
export { default as CssEditor } from './csseditor';
export { default as ExtModuleManager } from './extmodulemanager';
export { default as Globals } from './globals';
export { default as Settings } from './settings';
export { default as Database } from './database';
export { default as Updater } from './updater';
export { default as ModuleManager } from './modulemanager';
export { default as PluginManager } from './pluginmanager';
export { default as ThemeManager } from './thememanager';
export { default as Globals } from './globals';
export { default as ExtModuleManager } from './extmodulemanager';
export { default as Permissions } from './permissionmanager';
export { default as EventsWrapper } from './eventswrapper';
export { default as Vendor } from './vendor';
export * from './webpackmodules';
export { default as ModuleManager } from './modulemanager';
export * from './patcher';
export * from './reactcomponents';
export { default as EventListener } from './eventlistener';
export { default as SocketProxy } from './socketproxy';
export { default as EventHook } from './eventhook';
export { default as Permissions } from './permissionmanager';
export { default as Database } from './database';
export { default as EventsWrapper } from './eventswrapper';
export { default as DiscordApi } from './discordapi';
export * from './patcher';
export * from './reactcomponents';

View File

@ -128,13 +128,11 @@ export default class extends EventListener {
if (markup.ets) {
const etsRoot = document.createElement('span');
markup.clone.appendChild(etsRoot);
VueInjector.inject(
etsRoot,
DOM.createElement('span', null, 'test'),
{ EditedTimeStamp },
`<EditedTimeStamp ets="${markup.ets}"/>`,
true
);
VueInjector.inject(etsRoot, {
components: { EditedTimeStamp },
data: { ets: markup.ets },
template: '<EditedTimeStamp :ets="ets" />'
});
}
Events.emit('ui:mutable:.markup', markup.clone);
@ -214,12 +212,10 @@ export default class extends EventListener {
const parent = document.querySelector('[class*="channelTextArea"] > [class*="inner"]');
if (!parent) return;
parent.append(root);
VueInjector.inject(
root,
DOM.createElement('span'),
{ Autocomplete },
`<Autocomplete initial="${e.target.value}"/>`,
true
);
VueInjector.inject(root, {
components: { Autocomplete },
data: { initial: e.target.value },
template: '<Autocomplete :initial="initial" />'
});
}
}

View File

@ -9,11 +9,11 @@
*/
<template>
<div :class="{'bd-profile-badges-wrap': hasBadges == 'false'}">
<div :class="{'bd-profile-badges-wrap': !hasBadges}">
<div class="bd-profile-badges">
<div v-if="developer == 'true'" v-tooltip="'BetterDiscord Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="onClick"></div>
<div v-else-if="webdev == 'true'" v-tooltip="'BetterDiscord Web Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="onClick"></div>
<div v-else-if="contributor == 'true'" v-tooltip="'BetterDiscord Contributor'" class="bd-profile-badge bd-profile-badge-contributor" @click="onClick"></div>
<div v-if="developer" v-tooltip="'BetterDiscord Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="onClick"></div>
<div v-else-if="webdev" v-tooltip="'BetterDiscord Web Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="onClick"></div>
<div v-else-if="contributor" v-tooltip="'BetterDiscord Contributor'" class="bd-profile-badge bd-profile-badge-contributor" @click="onClick"></div>
</div>
</div>
</template>

View File

@ -10,9 +10,9 @@
<template>
<div class="bd-message-badges-wrap">
<div v-if="developer == 'true'" v-tooltip="'BetterDiscord Developer'" class="bd-message-badge bd-message-badge-developer" @click="onClick"></div>
<div v-else-if="webdev == 'true'" v-tooltip="'BetterDiscord Web Developer'" class="bd-message-badge bd-message-badge-developer" @click="onClick"></div>
<div v-else-if="contributor == 'true'" v-tooltip="'BetterDiscord Contributor'" class="bd-message-badge bd-message-badge-contributor" @click="onClick"></div>
<div v-if="developer" v-tooltip="'BetterDiscord Developer'" class="bd-message-badge bd-message-badge-developer" @click="onClick"></div>
<div v-else-if="webdev" v-tooltip="'BetterDiscord Web Developer'" class="bd-message-badge bd-message-badge-developer" @click="onClick"></div>
<div v-else-if="contributor" v-tooltip="'BetterDiscord Contributor'" class="bd-message-badge bd-message-badge-contributor" @click="onClick"></div>
</div>
</template>
<script>

View File

@ -34,6 +34,7 @@
import { EmoteModule } from 'builtin';
import { Events } from 'modules';
import { DOM } from 'ui';
export default {
data() {
return {
@ -44,7 +45,7 @@
open: false,
selectedIndex: 0,
sterm: ''
}
};
},
props: ['initial'],
beforeMount() {

View File

@ -12,6 +12,7 @@ import { EventListener } from 'modules';
import DOM from './dom';
import { BdBadge, BdMessageBadge } from './components/bd';
import VueInjector from './vueinjector';
import contributors from '../data/contributors';
export default class extends EventListener {
@ -55,43 +56,39 @@ export default class extends EventListener {
if (msgGroup.dataset.hasBadges) return;
msgGroup.setAttribute('data-has-badges', true);
if (!msgGroup.dataset.authorId) return;
const c = this.contributors.find(c => c.id === msgGroup.dataset.authorId);
const c = contributors.find(c => c.id === msgGroup.dataset.authorId);
if (!c) return;
const root = document.createElement('span');
const wrapperParent = msgGroup.querySelector('.username-wrapper').parentElement;
if (!wrapperParent || wrapperParent.children.length < 2) return;
wrapperParent.insertBefore(root, wrapperParent.children[1]);
const { developer, contributor, webdev } = c;
VueInjector.inject(
root,
DOM.createElement('div', null, 'bdmessagebadges'),
{ BdMessageBadge },
`<BdMessageBadge developer="${developer}" webdev="${webdev}" contributor="${contributor}"/>`,
true
);
VueInjector.inject(root, {
components: { BdMessageBadge },
data: { developer, contributor, webdev },
template: '<BdMessageBadge :developer="developer" :webdev="webdev" :contributor="contributor" />'
});
}
userlistBadge(e) {
const c = this.contributors.find(c => c.id === e.dataset.userId);
const c = contributors.find(c => c.id === e.dataset.userId);
if (!c) return;
const memberUsername = e.querySelector('.member-username');
if (!memberUsername) return;
const root = document.createElement('span');
memberUsername.append(root);
const { developer, contributor, webdev } = c;
VueInjector.inject(
root,
DOM.createElement('div', null, 'bdmessagebadges'),
{ BdMessageBadge },
`<BdMessageBadge developer="${developer}" webdev="${webdev}" contributor="${contributor}"/>`,
true
);
VueInjector.inject(root, {
components: { BdMessageBadge },
data: { developer, contributor, webdev },
template: '<BdMessageBadge :developer="developer" :webdev="webdev" :contributor="contributor" />'
});
}
inject(userid) {
const c = this.contributors.find(c => c.id === userid);
const c = contributors.find(c => c.id === userid);
if (!c) return;
setTimeout(() => {
let hasBadges = false;
let root = document.querySelector('[class*="profileBadges"]');
@ -103,27 +100,16 @@ export default class extends EventListener {
const { developer, contributor, webdev } = c;
VueInjector.inject(
root,
DOM.createElement('div', null, 'bdprofilebadges'),
{ BdBadge },
`<BdBadge hasBadges="${hasBadges}" developer="${developer}" webdev="${webdev}" contributor="${contributor}"/>`
);
VueInjector.inject(root, {
components: { BdBadge },
data: { hasBadges, c },
template: '<BdBadge :hasBadges="hasBadges" :developer="c.developer" :webdev="c.webdev" :contributor="c.contributor" />',
}, DOM.createElement('div', null, 'bdprofilebadges'));
}, 400);
}
get contributors() {
return [
{ 'id': '81388395867156480', 'webdev': true, 'developer': true, 'contributor': true }, // Jiiks
{ 'id': '98003542823944192', 'webdev': false, 'developer': true, 'contributor': true }, // Pohky
{ 'id': '138850472541814784', 'webdev': true, 'developer': false, 'contributor': true }, // Hammock
{ 'id': '249746236008169473', 'webdev': false, 'developer': true, 'contributor': true }, // Zerebos
{ 'id': '125367412370440192', 'webdev': false, 'developer': true, 'contributor': true }, // Pierce
{ 'id': '284056145272766465', 'webdev': false, 'developer': false, 'contributor': true }, // Samuel Elliott
{ 'id': '184021060562321419', 'webdev': false, 'developer': false, 'contributor': true }, // Lilian Tedone
{ 'id': '76052829285916672', 'webdev': false, 'developer': false, 'contributor': true }, // samfun123
{ 'id': '171005991272316937', 'webdev': false, 'developer': false, 'contributor': true }, // samogot
];
return contributors;
}
}

View File

@ -1,5 +1,5 @@
/**
* BetterDiscord VUE Injector Module
* BetterDiscord Vue Injector Module
* Copyright (c) 2015-present Jiiks/JsSucks - https://github.com/Jiiks / https://github.com/JsSucks
* All rights reserved.
* https://betterdiscord.net
@ -11,7 +11,7 @@
import Vue from './vue';
export default class {
static inject(root, bdnode, components, template, replaceRoot) {
if(!replaceRoot) bdnode.appendTo(root);
@ -22,4 +22,13 @@ export default class {
});
}
static _inject(root, options, bdnode) {
if(bdnode) bdnode.appendTo(root);
const vue = new Vue(options);
vue.$mount(bdnode || root);
return vue;
}
}

View File

@ -32,9 +32,10 @@ module.exports = {
loaders: [jsLoader, vueLoader, scssLoader]
},
externals: {
'electron': 'window.require("electron")',
'fs': 'window.require("fs")',
'path': 'window.require("path")'
electron: 'window.require("electron")',
fs: 'window.require("fs")',
path: 'window.require("path")',
sparkplug: 'require("../../core/dist/sparkplug")'
},
resolve: {
alias: {

View File

@ -1,5 +1,17 @@
/**
* BetterDiscord Sparkplug
* Copyright (c) 2015-present JsSucks - https://github.com/JsSucks
* All rights reserved.
* https://github.com/JsSucks - 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.
*
* This file is evaluated in the renderer process!
*/
(() => {
if (window.__bd && window.__bd.ignited) return;
if (module.exports.bd) return;
console.log('[BetterDiscord|Sparkplug]');
@ -7,12 +19,12 @@
if (!ls) console.warn('[BetterDiscord|Sparkplug] Failed to hook localStorage :(');
const wsOrig = window.WebSocket;
window.__bd = {
const bd = module.exports.bd = {
localStorage: ls,
wsHook: null,
wsOrig,
ignited: true
}
};
class WSHook extends window.WebSocket {
@ -25,14 +37,14 @@
console.info(`[BetterDiscord|WebSocket Proxy] new WebSocket detected, url: ${url}`);
if (!url.includes('gateway.discord.gg')) return;
if (window.__bd.setWS) {
window.__bd.setWS(this);
if (bd.setWS) {
bd.setWS(this);
console.info(`[BetterDiscord|WebSocket Proxy] WebSocket sent to instance`);
return;
}
console.info(`[BetterDiscord|WebSocket Proxy] WebSocket stored to __bd['wsHook']`);
window.__bd.wsHook = this;
console.info(`[BetterDiscord|WebSocket Proxy] WebSocket stored to bd.wsHook`);
bd.wsHook = this;
}
}