lightcordwarez
/
BetterDiscordApp-v2
mirror of https://github.com/JsSucks/BetterDiscordApp
1
0
Fork 0
Code Issues 3 Releases Wiki Activity

Merge pull request #17 from JsSucks/ui 

Merge
This commit is contained in:
Alexei Stukov 2018-01-19 04:21:01 +02:00 committed by GitHub
parent 9fc2eb559a ec50f750aa
commit eac7f62911
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 216 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
client/package.json
View File

@ -22,10 +22,14 @@
"babel-preset-react": "^6.24.1",
"babel-loader": "^7.1.2",
"moment": "^2.20.1",
"jquery": "^3.2.1"
"jquery": "^3.2.1",
"vue": "^2.5.13",
"vue-loader": "^13.7.0",
"vue-template-compiler": "^2.5.13",
"css-loader": "^0.28.9"
},
"scripts": {
"build": "webpack --progress --colors",
"watch": "webpack --progress --colors --watch"
}
}
}
}

8
client/src/index.js
View File

@ -10,13 +10,19 @@
'use strict';
const { Global, Logger, Utils, PluginManager, BDIpc, WebpackModules, SocketProxy } = require('./modules');
const { Global, Logger, Utils, PluginManager, BDIpc, WebpackModules, SocketProxy, Events } = require('./modules');
//const { UI } = require('./modules/ui/index.jsx');
class BetterDiscord {
constructor() {
window.bdUtils = Utils;
window.wpm = WebpackModules;
Events.on('global-ready', e => {
const { UI } = require('./modules/ui/vueui.js');
this.ui = new UI();
});
// this.UI = new UI();
}
}

13
client/src/modules/global.js
View File

@ -11,12 +11,14 @@
const { Module } = require('./modulebase');
const { Events } = require('./events');
const { BDIpc } = require('./bdipc');
const { WebpackModules } = require('./webpackmodules');
class Global extends Module {
constructor(args) {
super(args);
this.first();
window.gl = this;
}
bindings() {
@ -29,6 +31,13 @@ class Global extends Module {
(async () => {
const config = await BDIpc.send('getConfig');
this.setState(config);
/* const getReact = await WebpackModules.getModuleByProps(('createElement', 'cloneElement'));
this.React = getReact[0].exports;
window.React = this.React;
const getReactDom = await WebpackModules.getModuleByProps(('render', 'findDOMNode'));
this.reactDOM = getReactDom[0].exports;*/
// this.setState(Object.assign(config, { React, reactDOM }));
Events.emit('global-ready');
})();
if (window.__bd) {
@ -51,6 +60,10 @@ class Global extends Module {
return this.state[name];
}
getLoadedModule(name) {
return this[name];
}
}
const _instance = new Global();

44
client/src/modules/ui/components/bdbutton.vue Normal file
View File

@ -0,0 +1,44 @@
<template>
<div class="bd-settings-button">
<div class="bd-settings-button-btn"></div>
</div>
</template>
<script>
export default {
}
</script>
<style>
.guilds-wrapper {
padding-top: 50px !important;
}
.bd-settings-button {
position: absolute;
z-index: 90001;
top: 22px;
width: 75px;
height: 48px;
left: 0;
background: #2f3136;
box-shadow: 0 1px 0 rgba(0,0,0,.2), 0 2px 0 rgba(0,0,0,.06);
}
.bd-settings-button .bd-settings-button-btn {
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FscXVlXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjAwMCAyMDAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyMDAwIDIwMDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxnPjxwYXRoIGZpbGw9IiMzRTgyRTUiIGQ9Ik0xNDAyLjIsNjMxLjdjLTkuNy0zNTMuNC0yODYuMi00OTYtNjQyLjYtNDk2SDY4LjR2NzE0LjFsNDQyLDM5OFY0OTAuN2gyNTdjMjc0LjUsMCwyNzQuNSwzNDQuOSwwLDM0NC45SDU5Ny42djMyOS41aDE2OS44YzI3NC41LDAsMjc0LjUsMzQ0LjgsMCwzNDQuOGgtNjk5djM1NC45aDY5MS4yYzM1Ni4zLDAsNjMyLjgtMTQyLjYsNjQyLjYtNDk2YzAtMTYyLjYtNDQuNS0yODQuMS0xMjIuOS0zNjguNkMxMzU3LjcsOTE1LjgsMTQwMi4yLDc5NC4zLDE0MDIuMiw2MzEuN3oiLz48cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNMTI2Mi41LDEzNS4yTDEyNjIuNSwxMzUuMmwtNzYuOCwwYzI2LjYsMTMuMyw1MS43LDI4LjEsNzUsNDQuM2M3MC43LDQ5LjEsMTI2LjEsMTExLjUsMTY0LjYsMTg1LjNjMzkuOSw3Ni42LDYxLjUsMTY1LjYsNjQuMywyNjQuNmwwLDEuMnYxLjJjMCwxNDEuMSwwLDU5Ni4xLDAsNzM3LjF2MS4ybDAsMS4yYy0yLjcsOTktMjQuMywxODgtNjQuMywyNjQuNmMtMzguNSw3My44LTkzLjgsMTM2LjItMTY0LjYsMTg1LjNjLTIyLjYsMTUuNy00Ni45LDMwLjEtNzIuNiw0My4xaDcyLjVjMzQ2LjIsMS45LDY3MS0xNzEuMiw2NzEtNTY3LjlWNzE2LjdDMTkzMy41LDMxMi4yLDE2MDguNywxMzUuMiwxMjYyLjUsMTM1LjJ6Ii8+PC9nPjwvc3ZnPg==);
background-size: 50% 50%;
background-repeat: no-repeat;
background-position: center;
width: 100%;
height: 100%;
z-index: 90002;
cursor: pointer;
filter: grayscale(100%);
opacity: .5;
transition: all .4s ease-in-out;
}
.bd-settings-button .bd-settings-button-btn:hover {
filter: none;
opacity: 1;
}
</style>

35
client/src/modules/ui/renderer.jsx Normal file
View File

@ -0,0 +1,35 @@
/**
* BetterDiscord Client Renderer
* 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.
*/
const { WebpackModules } = require('../');
class Renderer {
static async render(component, root) {
if (!this.React) this.React = await this.getReact();
if (!this.reactDom) this.reactDom = await this.getReactDom();
const React = this.React;
window.React = React;
this.reactDom.render(component, root);
}
static async getReact() {
const getReact = await WebpackModules.getModuleByProps(('createElement', 'cloneElement'));
return getReact[0].exports;
}
static async getReactDom() {
const getReactDom = await WebpackModules.getModuleByProps(('render', 'findDOMNode'));
return getReactDom[0].exports;
}
}
module.exports = { Renderer };

33
client/src/modules/ui/vueui.js Normal file
View File

@ -0,0 +1,33 @@
/**
* BetterDiscord Client UI Module
* 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.
*/
const $ = require('jquery');
const Vue = require('vue');
const BdButton = (require('./components/bdbutton.vue')).default;
class UI {
constructor() {
$('body').append($('<div/>', {
class: 'bd-settingsbutton',
id: 'bd-settingsbutton'
}));
this.vueInstance = new Vue.default({
el: '#bd-settingsbutton',
template: '<BdButton/>',
components: { BdButton }
});
}
}
module.exports = { UI }

82
client/src/modules/webpackmodules.js
View File

@ -8,30 +8,63 @@
* LICENSE file in the root directory of this source tree.
*/
const KnownModules = {
'React': ('createElement', 'cloneElement'),
'react-dom': ('render', 'findDOMNode')
};
const Cache = {};
class WebpackModules {
static async getModuleByProps(props) {
const modules = await this.getAllModules();
return new Promise((resolve, reject) => {
const rm = [];
for (let index in modules) {
if (!modules.hasOwnProperty(index)) continue;
const module = modules[index];
const { exports } = module;
static getModuleByNameSync(name, first, fallback) {
//TODO return not first from cache?
if (Cache.hasOwnProperty(name)) return Cache[name];
if (KnownModules.hasOwnProperty(name)) fallback = KnownModules[name];
if (!fallback) return null;
return Cache[name] = this.getModuleByPropsSync(fallback, first);
}
if (!exports || typeof exports !== 'object') continue;
if (!(props in exports)) continue;
rm.push(module);
// resolve(module);
// break;
}
resolve(rm);
reject(null);
});
static getModuleByPropsSync(props, first) {
const modules = this.getAllModulesSync();
const rm = [];
for (let index in modules) {
if (!modules.hasOwnProperty(index)) continue;
const module = modules[index];
const { exports } = module;
if (!exports || typeof exports !== 'object') continue;
if (!(props in exports)) continue;
rm.push(module);
}
return first ? rm[0].exports : rm;
}
static async getModuleByName(name, first, fallback) {
if (Cache.hasOwnProperty(name)) return Cache[name];
if (KnownModules.hasOwnProperty(name)) fallback = KnownModules[name];
if (!fallback) return null;
return Cache[name] = await this.getModuleByProps(fallback, first);
}
static async getModuleByProps(props, first) {
const modules = await this.getAllModules();
const rm = [];
for (let index in modules) {
if (!modules.hasOwnProperty(index)) continue;
const module = modules[index];
const { exports } = module;
if (!exports || typeof exports !== 'object') continue;
if (!(props in exports)) continue;
rm.push(module);
}
return first ? rm[0].exports : rm;
}
/*This will most likely not work for most modules*/
static async getModuleByName(name) {
/* static async getModuleByName(name) {
const modules = await this.getAllModules();
return new Promise((resolve, reject) => {
for (let index in modules) {
@ -51,6 +84,19 @@ class WebpackModules {
reject(null);
});
}*/
static getAllModulesSync() {
const id = 'bd-webpackmodulessync';
const __webpack_require__ = window['webpackJsonp'](
[],
{
[id]: (module, exports, __webpack_require__) => exports.default = __webpack_require__
},
[id]).default;
delete __webpack_require__.m[id];
delete __webpack_require__.c[id];
return __webpack_require__.c;
}
static async getAllModules() {

15
client/webpack.config.js
View File

@ -7,10 +7,16 @@ const jsLoader = {
exclude: /node_modules/,
loader: 'babel-loader',
query: {
// presets: ['es2015', 'react']
presets: ['react']
}
}
const vueLoader = {
test: /\.(vue)$/,
exclude: /node_modules/,
loader: 'vue-loader'
}
module.exports = {
entry: './src/index.js',
output: {
@ -18,10 +24,15 @@ module.exports = {
filename: 'betterdiscord.client.js'
},
module: {
loaders: [jsLoader]
loaders: [jsLoader, vueLoader]
},
externals: {
'electron': 'window.require("electron")'
},
resolve: {
alias: {
vue$: path.resolve('node_modules', 'vue', 'dist', 'vue.esm.js')
}
}
/* resolve: {
alias: {