Base for CSS Editor

This commit is contained in:
Jiiks 2018-01-17 13:28:52 +02:00
parent 20abc525d3
commit ef7009f5a1
8 changed files with 648 additions and 4 deletions

View File

@ -10,13 +10,14 @@
'use strict';
const { Global, Logger, Utils, PluginManager, BDIpc, WebpackModules, SocketProxy } = require('./modules');
const { Global, Logger, Utils, PluginManager, BDIpc, WebpackModules, SocketProxy, CssEditor } = require('./modules');
class BetterDiscord {
constructor() {
window.bdUtils = Utils;
window.wpm = WebpackModules;
window.cssEditor = CssEditor;
}
}

View File

@ -0,0 +1,29 @@
/**
* BetterDiscord CSS Editor
* 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 { Module } = require('./modulebase');
const { BDIpc } = require('./bdipc');
class CssEditor extends Module {
setInitialState() {
this.state = {
css: ''
}
window.cssEditor = this;
}
show() {
BDIpc.send('openCssEditor', {});
}
}
const _instance = new CssEditor();
module.exports = { 'CssEditor': _instance }

View File

@ -5,4 +5,5 @@ export { Pluging } from './plugin';
export { BDIpc } from './bdipc';
export { WebpackModules } from './webpackmodules';
export { Events } from './events';
export { SocketProxy } from './discordsocket';
export { SocketProxy } from './discordsocket';
export { CssEditor } from './csseditor';

View File

@ -23,7 +23,7 @@ const __DEV = {
const __pluginPath = path.resolve(__dirname, '..', '..', 'tests', 'plugins');
const __themePath = path.resolve(__dirname, '..', '..', 'tests', 'themes');
const { Utils, FileUtils, BDIpc, Config, WindowUtils } = require('./modules');
const { Utils, FileUtils, BDIpc, Config, WindowUtils, CSSEditor } = require('./modules');
const { BrowserWindow } = require('electron');
const Common = {};
@ -51,6 +51,10 @@ class Comms {
o.reply(Common.Config.config);
});
BDIpc.on('bd-openCssEditor', o => {
o.reply(CSSEditor.openEditor());
});
BDIpc.on('bd-readFile', this.readFile);
BDIpc.on('bd-readJson', o => this.readFile(o, true));
}

View File

@ -0,0 +1,52 @@
/**
* BetterDiscord CSSEditor 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 path = require('path');
const { BrowserWindow } = require('electron');
const { Module } = require('./modulebase');
class CSSEditor extends Module {
openEditor() {
if (this.editor && this.editor.open) {
this.editor.focus();
this.editor.flashFrame(true);
return true;
}
this.editor = new BrowserWindow(this.options);
this.editor.loadURL(`file://${this.editorPath}/index.html`);
this.editor.open = true;
this.editor.webContents.on('close', () => {
this.editor.open = false;
});
return true;
}
//TODO user options from config
get options() {
return {
width: 800,
height: 600,
frame: false
};
}
//TODO Currently uses a development path
get editorPath() {
return path.resolve(__dirname, '..', '..', '..', 'tests', 'csseditor');
}
}
module.exports = { 'CSSEditor': new CSSEditor() };

View File

@ -1,3 +1,4 @@
export { BDIpc } from './bdipc';
export { Utils, FileUtils, WindowUtils } from './utils';
export { Config } from './config';
export { Config } from './config';
export { CSSEditor } from './csseditor';

108
tests/csseditor/index.html Normal file
View File

@ -0,0 +1,108 @@
<html>
<head>
<title>CSS Editor</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/codemirror.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/theme/material.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/addon/scroll/simplescrollbars.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.18.2/addon/dialog/dialog.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/addon/hint/show-hint.min.css" />
<link rel="stylesheet" href="./main.css" />
</head>
<body>
<div class="container">
<button titlge="Close CSS Editor" class="close" onClick="closeWindow()">X</button>
<button title="Toggle always on top" class="aot" onClick="toggleAot(this)">P</button>
<div class="titlebg"></div>
<div class="titlebar">
<span class="icon"></span>
<span id="windowtitle" class="title">CSS Editor</span>
</div>
<div id="eehint"><span>Your external editor is proxied to this window</span></div>
<div id="cm-container"></div>
<div id="alert">
Saved!
</div>
<div id="spinner">
<div class="valign">Loading Please Wait</div>
</div>
<div id="hints">
<h3>Keybinds</h3>
<table>
<tr>
<td>Exit:</td>
<td>ESC</td>
</tr>
<tr>
<td>Save:</td>
<td>Ctrl/Cmd + S</td>
</tr>
<tr>
<td>Update:</td>
<td>Ctrl/Cmd + H</td>
</tr>
</table>
</div>
<div id="cmhints">
<h3>CM Keybinds</h3>
<table>
<tr>
<td>Search:</td>
<td>Ctrl/Cmd + F</td>
</tr>
<tr>
<td>Find Next:</td>
<td>Ctrl/Cmd + G</td>
</tr>
<tr>
<td>Find Previous</td>
<td>Ctrl-Shift/Cmd-Option + G</td>
</tr>
<tr>
<td>Replace</td>
<td>Ctrl-Shift/Cmd-Option + F</td>
</tr>
<tr>
<td>Replace All</td>
<td>Ctrl-Shift/Cmd-Option-Shift + R</td>
</tr>
<tr>
<td>Persistent Search:</td>
<td>Alt + F</td>
</tr>
<tr>
<td>Jump To Line:</td>
<td>Alt + G</td>
</tr>
</table>
</div>
<div class="controls">
<button id="btnSave" onClick="save()">Save</button>
<button id="btnUpdate" onClick="update()">Update</button>
<div id="cbLiveUpdate" class="checkbox-container" onClick="toggleOption(this, 'live-update')">
<div class="checkbox"></div>
<span>Live Update</span>
</div>
<div id="cbAutoSave" class="checkbox-container" onClick="toggleOption(this, 'auto-save')">
<div class="checkbox"></div>
<span>Auto Save</span>
</div>
<div id="cbExtEditor" class="checkbox-container" onClick="toggleOption(this, 'external-editor')">
<div class="checkbox"></div>
<span>Use External Editor</span>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/codemirror.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/mode/css/css.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/addon/scroll/simplescrollbars.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/addon/search/search.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/addon/search/searchcursor.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/addon/search/jump-to-line.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/addon/dialog/dialog.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/addon/hint/show-hint.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.23.0/addon/hint/css-hint.min.js"></script>
<script src="./main.js"></script>
</body>
</html>

448
tests/csseditor/main.css Normal file

File diff suppressed because one or more lines are too long