Refactor UserProfileModals badges

This commit is contained in:
Samuel Elliott 2018-04-01 22:44:01 +01:00
parent 68beee12d3
commit d98f152009
No known key found for this signature in database
GPG Key ID: 8420C7CDE43DC4D6
7 changed files with 64 additions and 70 deletions

View File

@ -17,6 +17,7 @@ export { default as Vendor } from './vendor';
export * from './webpackmodules';
export * from './patcher';
export * from './reactcomponents';
export { default as Module } from './module';
export { default as EventListener } from './eventlistener';
export { default as SocketProxy } from './socketproxy';
export { default as EventHook } from './eventhook';

View File

@ -229,7 +229,7 @@ export class ReactComponents {
return;
}
if (!reflect.component.displayName) reflect.component.displayName = name;
Logger.info('ReactComponents', [`Found important component ${name} with reflection`, reflect.component, reflect]);
Logger.info('ReactComponents', [`Found important component ${name} with reflection`, reflect]);
this.push(reflect.component);
clearInterval(importantInterval);
}, 50);
@ -240,7 +240,7 @@ export class ReactComponents {
listeners: []
});
return new Promise(resolve => {
this.listeners.find(l => l.id === name).listeners.push(c => resolve(c));
this.listeners.find(l => l.id === name).listeners.push(resolve);
});
}

View File

@ -1,7 +1,11 @@
.bd-profile-badges-wrap {
display: flex;
display: inline-flex;
margin-top: 8px;
flex: 1 1 auto;
+ [class*="profileBadges"] {
display: inline-flex;
}
}
.bd-profile-badges {

View File

@ -24,49 +24,39 @@ export default class {
server: DiscordApi.currentGuild,
channel: DiscordApi.currentChannel
};
window.addEventListener('keyup', e => Events.emit('gkh:keyup', e));
this.autoManip = new AutoManip();
const defer = setInterval(() => {
if (!this.profilePopupModule) return;
clearInterval(defer);
MonkeyPatch('BdUI', this.profilePopupModule).after('open', (context, [userid]) => Events.emit('ui-event', {
event: 'profile-popup-open',
data: { userid }
}));
}, 100);
const ehookInterval = setInterval(() => {
if (!remote.BrowserWindow.getFocusedWindow()) return;
clearInterval(ehookInterval);
remote.BrowserWindow.getFocusedWindow().webContents.on('did-navigate-in-page', (e, url, isMainFrame) => {
const { currentGuild, currentChannel } = DiscordApi;
if (!this.pathCache.server) {
Events.emit('server-switch', { server: currentGuild, channel: currentChannel });
this.pathCache.server = currentGuild;
this.pathCache.channel = currentChannel;
return;
}
if (!this.pathCache.channel) {
Events.emit('channel-switch', currentChannel);
this.pathCache.server = currentGuild;
this.pathCache.channel = currentChannel;
return;
}
if (currentGuild &&
currentGuild.id &&
this.pathCache.server &&
this.pathCache.server.id !== currentGuild.id) {
if (currentGuild && currentGuild.id && this.pathCache.server && this.pathCache.server.id !== currentGuild.id) {
Events.emit('server-switch', { server: currentGuild, channel: currentChannel });
this.pathCache.server = currentGuild;
this.pathCache.channel = currentChannel;
return;
}
if (currentChannel &&
currentChannel.id &&
this.pathCache.channel &&
this.pathCache.channel.id !== currentChannel.id) Events.emit('channel-switch', currentChannel);
if (currentChannel && currentChannel.id && this.pathCache.channel && this.pathCache.channel.id !== currentChannel.id)
Events.emit('channel-switch', currentChannel);
this.pathCache.server = currentGuild;
this.pathCache.channel = currentChannel;
@ -74,10 +64,6 @@ export default class {
}, 100);
}
static get profilePopupModule() {
return WebpackModules.getModuleByProps(['fetchMutualFriends', 'setSection']);
}
static injectUi() {
DOM.createElement('div', null, 'bd-settings').appendTo(DOM.bdBody);
DOM.createElement('div', null, 'bd-modals').appendTo(DOM.bdModals);

View File

@ -9,7 +9,7 @@
*/
<template>
<div :class="{'bd-profile-badges-wrap': !hasBadges}">
<div class="bd-profile-badges-wrap">
<div class="bd-profile-badges">
<div v-if="developer" v-tooltip="'BetterDiscord Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="click"></div>
<div v-else-if="webdev" v-tooltip="'BetterDiscord Web Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="click"></div>
@ -23,7 +23,7 @@
import { shell } from 'electron';
export default {
props: ['webdev', 'developer', 'contributor', 'hasBadges'],
props: ['webdev', 'developer', 'contributor'],
methods: {
click() {
if (this.developer) return shell.openExternal('https://github.com/JsSucks/BetterDiscordApp');

View File

@ -8,60 +8,21 @@
* LICENSE file in the root directory of this source tree.
*/
import { EventListener, ReactComponents, ReactHelpers, MonkeyPatch } from 'modules';
import { Module, ReactComponents, ReactHelpers, MonkeyPatch, WebpackModules } from 'modules';
import { Reflection } from 'ui';
import { ClientLogger as Logger } from 'common';
import { Utils, ClientLogger as Logger } from 'common';
import DOM from './dom';
import { BdBadge, BdMessageBadge } from './components/bd';
import VueInjector from './vueinjector';
import contributors from '../data/contributors';
export default class extends EventListener {
export default class extends Module {
init() {
this.patchMessage();
this.patchChannelMember();
this.patchNameTag();
}
bindings() {
this.uiEvent = this.uiEvent.bind(this);
}
get eventBindings() {
return [
{ id: 'ui-event', callback: this.uiEvent }
];
}
uiEvent(e) {
const { event, data } = e;
if (event !== 'profile-popup-open') return;
const { userid } = data;
if (!userid) return;
this.inject(userid);
}
inject(userid) {
const c = contributors.find(c => c.id === userid);
if (!c) return;
setTimeout(() => {
let hasBadges = false;
let root = document.querySelector('[class*="profileBadges"]');
if (root) {
hasBadges = true;
} else {
root = document.querySelector('[class*="headerInfo"]');
}
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);
this.patchUserProfileModals();
}
get contributors() {
@ -182,7 +143,8 @@ export default class extends EventListener {
}
injectMessageBadges(element) {
for (const beo of element.getElementsByClassName('bd-badge-outer')) this.injectMessageBadge(beo);
for (const beo of element.getElementsByClassName('bd-badge-outer'))
this.injectMessageBadge(beo);
}
injectMessageBadge(root) {
@ -204,4 +166,34 @@ export default class extends EventListener {
root.classList.add('bd-has-badge');
}
/**
* Patches UserProfileModals to inject profile badges into the modal once opened.
* TODO: just patch the modal component
*/
async patchUserProfileModals() {
const UserProfileModals = WebpackModules.getModuleByName('UserProfileModals');
MonkeyPatch('BdUI', UserProfileModals).after('open', async (context, [userid]) => {
const c = contributors.find(c => c.id === userid);
if (!c) return;
const root = await Utils.until(() => document.querySelector('[class*="headerInfo"]'));
const el = DOM.createElement('div', null, 'bdprofilebadges');
root.insertBefore(el.element, root.firstChild.nextSibling);
this.injectProfileBadge(userid, el.element);
});
}
injectProfileBadge(userid, root) {
const c = contributors.find(c => c.id === userid);
if (!c) return;
VueInjector.inject(root, {
components: { BdBadge },
data: { c },
template: '<BdBadge :developer="c.developer" :webdev="c.webdev" :contributor="c.contributor" />',
});
}
}

View File

@ -159,6 +159,17 @@ export class Utils {
enumerable: true
});
}
static async until(check, time = 0) {
let value, i;
do {
// Wait for the next tick
await new Promise(resolve => setTimeout(resolve, time));
value = check(i);
i++;
} while (!value);
return value;
}
}
export class FileUtils {