From f1f23fa220c52c419722f760d0247d9f06801983 Mon Sep 17 00:00:00 2001 From: Jiiks Date: Sun, 24 Feb 2019 13:03:15 +0200 Subject: [PATCH] Initial BDEdit addition. No logic yet. --- core/src/main.js | 11 ++-- core/src/modules/editor.js | 93 +++++++++++++++++++++++++++++++++ core/src/modules/index.js | 1 + editor/src/Editor.vue | 22 +++++++- editor/src/styles/index.scss | 20 +++++++ editor/src/styles/titlebar.scss | 71 +++++++++++++++++++++++++ editor/src/styles/vars.scss | 2 + package-lock.json | 2 +- package.json | 2 +- 9 files changed, 216 insertions(+), 8 deletions(-) create mode 100644 core/src/modules/editor.js create mode 100644 editor/src/styles/titlebar.scss create mode 100644 editor/src/styles/vars.scss diff --git a/core/src/main.js b/core/src/main.js index 29494434..5b4caf58 100644 --- a/core/src/main.js +++ b/core/src/main.js @@ -21,7 +21,8 @@ const TEST_ARGS = () => { 'paths': { 'client': path.resolve(_basePath, 'client', 'dist'), 'core': path.resolve(_basePath, 'core', 'dist'), - 'data': path.resolve(_baseDataPath, 'data') + 'data': path.resolve(_baseDataPath, 'data'), + 'editor': path.resolve(_basePath, 'editor', 'dist') } } } @@ -33,7 +34,7 @@ import deepmerge from 'deepmerge'; import ContentSecurityPolicy from 'csp-parse'; import keytar from 'keytar'; -import { FileUtils, BDIpc, Config, WindowUtils, CSSEditor, Database } from './modules'; +import { FileUtils, BDIpc, Config, WindowUtils, CSSEditor, Editor, Database } from './modules'; const packageJson = require(path.resolve(__dirname, 'package.json')); const sparkplug = path.resolve(__dirname, 'sparkplug.js'); @@ -63,7 +64,8 @@ class Comms { BDIpc.on('bd-sendToDiscord', (event, m) => this.sendToDiscord(m.channel, m.message), true); // BDIpc.on('bd-openCssEditor', (event, options) => this.bd.csseditor.openEditor(options), true); - BDIpc.on('bd-sendToCssEditor', (event, m) => this.sendToCssEditor(m.channel, m.message), true); + // BDIpc.on('bd-sendToCssEditor', (event, m) => this.sendToCssEditor(m.channel, m.message), true); + BDIpc.on('bd-openCssEditor', (event, options) => this.bd.editor.openEditor(options), true); BDIpc.on('bd-native-open', (event, options) => { dialog.showOpenDialog(OriginalBrowserWindow.fromWebContents(event.ipcEvent.sender), options, filenames => { @@ -148,7 +150,8 @@ export class BetterDiscord { get comms() { return this._comms ? this._comms : (this._commas = new Comms(this)); } get database() { return this._db ? this._db : (this._db = new Database(this.config.getPath('data'))); } get config() { return this._config ? this._config : (this._config = new Config(this._args)); } - get window() { return this.windowUtils ? this.windowUtils.window : undefined; } + get window() { return this.windowUtils ? this.windowUtils.window : undefined; } + get editor() { return this._editor ? this._editor : (this._editor = new Editor(this, this.config.getPath('editor'))); } constructor(args) { if (TESTS) args = TEST_ARGS(); diff --git a/core/src/modules/editor.js b/core/src/modules/editor.js new file mode 100644 index 00000000..0f4b46e7 --- /dev/null +++ b/core/src/modules/editor.js @@ -0,0 +1,93 @@ +/** + * BetterDiscord Editor 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. +*/ + +import path from 'path'; +import { BrowserWindow } from 'electron'; + +import Module from './modulebase'; +import { WindowUtils } from './utils'; +import BDIpc from './bdipc'; + +export default class Editor extends Module { + + constructor(bd, path) { + super(); + this.editorPath = path; + this.bd = bd; + } + + /** + * Opens an editor. + * @return {Promise} + */ + openEditor(options) { + return new Promise((resolve, reject) => { + if (this.editor) { + if (this.editor.isFocused()) return; + + this.editor.focus(); + this.editor.flashFrame(true); + return resolve(true); + } + + options = Object.assign({}, this.options, options); + + this.editor = new BrowserWindow(options); + this.editor.loadURL('about:blank'); + this.editor.setSheetOffset(33); + this.editorUtils = new WindowUtils({ window: this.editor }); + + this.editor.on('close', () => { + this.bd.windowUtils.send('bd-save-csseditor-bounds', this.editor.getBounds()); + this.editor = null; + }); + + this.editor.once('ready-to-show', () => { + this.editor.show(); + }); + + this.editor.webContents.on('did-finish-load', () => { + this.editorUtils.injectScript(path.join(this.editorPath, 'editor.js')); + resolve(true); + }); + }) + } + + /** + * Sends data to the editor. + * @param {String} channel + * @param {Any} data + */ + send(channel, data) { + if (!this.editor) throw { message: 'The CSS editor is not open.' }; + return BDIpc.send(this.editor, channel, data); + } + + /** + * Sets the CSS editor's always on top flag. + */ + set alwaysOnTop(state) { + if (!this.editor) return; + this.editor.setAlwaysOnTop(state); + } + + /** + * Default options to pass to BrowserWindow. + */ + get options() { + return { + width: 800, + height: 600, + show: false, + frame: false + }; + } + +} diff --git a/core/src/modules/index.js b/core/src/modules/index.js index 5f922a23..4a56e948 100644 --- a/core/src/modules/index.js +++ b/core/src/modules/index.js @@ -2,4 +2,5 @@ export { default as BDIpc } from './bdipc'; export { Utils, FileUtils, WindowUtils } from './utils'; export { default as Config } from './config'; export { default as CSSEditor } from './csseditor'; +export { default as Editor } from './editor'; export { default as Database } from './database'; diff --git a/editor/src/Editor.vue b/editor/src/Editor.vue index 1406c147..e226b8e7 100644 --- a/editor/src/Editor.vue +++ b/editor/src/Editor.vue @@ -1,12 +1,30 @@ diff --git a/editor/src/styles/index.scss b/editor/src/styles/index.scss index e69de29b..8ec713ef 100644 --- a/editor/src/styles/index.scss +++ b/editor/src/styles/index.scss @@ -0,0 +1,20 @@ +@import './vars.scss'; +@import './titlebar.scss'; + +html, body { + margin: 0; + padding: 0; + display: flex; + max-height: 100%; + height: 100%; + width: 100%; + background: #2c383e; + min-width: 700px; + min-height: 400px; +} + +.container { + display: flex; + flex-grow: 1; + flex-direction: column; +} diff --git a/editor/src/styles/titlebar.scss b/editor/src/styles/titlebar.scss new file mode 100644 index 00000000..b837087a --- /dev/null +++ b/editor/src/styles/titlebar.scss @@ -0,0 +1,71 @@ +.titlebar { + display: flex; + height: 25px; + padding: 4px 5px; + background: #292b2f; + border-bottom: 1px solid hsla(218,5%,47%,.3); + user-select: none; + cursor: default; + + .icon { + width: 31px; + height: 25px; + + .inner { + width: 25px; + height: 25px; + background-image: $bdicon; + background-size: 22px 22px; + background-repeat: no-repeat; + background-position: center; + } + } + + .title { + color: #bac9d2; + font-family: Whitney,Helvetica Neue,Helvetica,Arial,sans-serif; + line-height: 25px; + font-size: 15px; + } + + .controls { + margin: 0 0 0 2px; + font-size: 0; + + button { + -webkit-app-region: no-drag; + border-radius: 3px; + width: 25px; + font-size: 12px; + font-weight: 600; + background: #36393f; + color: #bac9d2; + font-family: Whitney,Helvetica Neue,Helvetica,Arial,sans-serif; + transition: background-color .2s ease, color .2s ease; + cursor: default; + border: 0; + height: 25px; + z-index: 900062; + padding: 0; + margin: 0 0 0 4px; + + &:hover { + background: #44474e; + color: #FFF; + } + + &.active { + background: #3a71c1; + } + } + } + + .draggable { + top: 0; + left: 0; + right: 63px; + position: absolute; + height: 33px; + -webkit-app-region: drag; + } +} diff --git a/editor/src/styles/vars.scss b/editor/src/styles/vars.scss new file mode 100644 index 00000000..202ab708 --- /dev/null +++ b/editor/src/styles/vars.scss @@ -0,0 +1,2 @@ +$logoSmallGw: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkltYWdlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPi5zdDB7ZGlzcGxheTpub25lO30uc3Qxe2Rpc3BsYXk6aW5saW5lO2ZpbGw6IzAyMDAzNTtzdHJva2U6IzAwMDAwMDtzdHJva2UtbWl0ZXJsaW1pdDoxMDt9LnN0MntmaWxsOiMzRUNDOUU7fS5zdDN7ZmlsbDojRkZGRkZGO308L3N0eWxlPjxnIGlkPSJMYXllcl8yIiBjbGFzcz0ic3QwIj48cmVjdCB4PSItNjQiIHk9Ii0zMiIgY2xhc3M9InN0MSIgd2lkdGg9IjYxOCIgaGVpZ2h0PSI1NzIiLz48L2c+PGcgaWQ9IkxheWVyXzEiIHhtbG5zOnZlY3Rvcm5hdG9yPSJodHRwOi8vdmVjdG9ybmF0b3IuaW8iPjxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik03MCwxOC44Yy0xMy43LDAtMjcuMywxMy43LTI3LjMsMjcuM3YyMzMuNkM0Mi43LDM5Ny43LDEzNy45LDQ5MywyNTYsNDkzYzI5LjcsMCw1OC02LjEsODMuNi0xN1YzNDEuNWMtMTksMjUuNi00OS4zLDQyLjItODMuNiw0Mi4yYy01Ny42LDAtMTA0LjEtNDYuNS0xMDQuMS0xMDQuMVY0Ni4xYzAtMTMuNy0xMy43LTI3LjMtMjcuMy0yNy4zSDcweiIvPjxwYXRoIGNsYXNzPSJzdDMiIGQ9Ik0zODcuNCwxOC44Yy0xMy43LDAtMjcuMywxMy43LTI3LjMsMjcuM3Y0Ny4zQzMyOS4zLDc2LjIsMjkzLjksNjYuMywyNTYsNjYuM2MtMjkuOCwwLTU3LjksNi4zLTgzLjYsMTcuM3YxMzQuMmMxOS0yNS42LDQ5LjMtNDIuMiw4My42LTQyLjJjNTcuNiwwLDEwNC4xLDQ2LjUsMTA0LjEsMTA0LjF2MTg2LjJjNjUuMi0zNi40LDEwOS4yLTEwNiwxMDkuMi0xODYuMlY0Ni4xYzAtMTguOC0xMy43LTI3LjMtMjcuMy0yNy4zSDM4Ny40eiIvPjwvZz48L3N2Zz4=); +$bdicon: $logoSmallGw; diff --git a/package-lock.json b/package-lock.json index 81231f81..3d4e2421 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1588,7 +1588,7 @@ } }, "bdedit": { - "version": "github:JsSucks/BDEdit#1ddc18aa4ae980cd0d50618ba4ffa73721a6819e", + "version": "github:JsSucks/bdedit#1ddc18aa4ae980cd0d50618ba4ffa73721a6819e", "dev": true, "requires": { "ace-builds": "1.4.3" diff --git a/package.json b/package.json index 32024844..b137bf70 100644 --- a/package.json +++ b/package.json @@ -18,6 +18,7 @@ "dependencies": { "asar": "^0.14.6", "csp-parse": "github:macropodhq/csp-parse", + "bdedit": "github:JsSucks/bdedit", "deepmerge": "^2.2.1", "fs-extra": "^7.0.0", "keytar": "^4.3.0", @@ -33,7 +34,6 @@ "babel-preset-env": "^1.7.0", "babel-preset-es2015": "^6.24.1", "babel-preset-react": "^6.24.1", - "bdedit": "github:JsSucks/BDEdit", "codemirror": "^5.39.2", "combokeys": "^3.0.0", "css-loader": "^0.28.11",