github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2025-01-19 18:12:59 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Editor driver support

Browse Source
This commit is contained in:
Alexander Skvortsov 2021-02-04 23:17:31 -05:00 committed by Alexander Skvortsov
parent 0ea9ef1c48
commit 3bdfbf9349
2 changed files with 25 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
extensions/markdown/js/src/forum/components/MarkdownToolbar.js
View File

@ -6,9 +6,7 @@ export default class MarkdownToolbar extends Component {
oncreate(vnode) {
super.oncreate(vnode);
const field = document.getElementById(this.attrs.for);
field.addEventListener('keydown', this.shortcut.bind(this));
this.attrs.setShortcutHandler(this.shortcut.bind(this));
}
view(vnode) {

36
extensions/markdown/js/src/forum/index.js
View File

@ -7,26 +7,37 @@
* https://github.com/github/markdown-toolbar-element/blob/master/LICENSE
*/
import { extend } from 'flarum/extend';
import { extend, override } from 'flarum/extend';
import TextEditor from 'flarum/components/TextEditor';
import BasicEditorDriver from 'flarum/utils/BasicEditorDriver';
import MarkdownArea from 'mdarea';
import MarkdownToolbar from './components/MarkdownToolbar';
import MarkdownButton from './components/MarkdownButton';
app.initializers.add('flarum-markdown', function(app) {
let shortcutHandler = () => { };
app.initializers.add('flarum-markdown', function (app) {
let index = 1;
extend(TextEditor.prototype, 'oninit', function() {
this.textareaId = 'textarea'+(index++);
extend(TextEditor.prototype, 'oninit', function () {
this.textareaId = 'textarea' + (index++);
});
extend(TextEditor.prototype, 'view', function(vdom) {
vdom.children[0].attrs.id = this.textareaId;
extend(TextEditor.prototype, 'buildEditorParams', function (params) {
params.textareaId = this.textareaId;
});
extend(TextEditor.prototype, 'oncreate', function() {
this.editor = new MarkdownArea(this.$('textarea')[0], {
extend(BasicEditorDriver.prototype, 'build', function (_, dom, params) {
this.el.id = params.textareaId;
// We can't bind shortcutHandler directly in case `build`
// runs before MarkdownToolbar's `oninit`.
this.el.addEventListener('keydown', function (e) {
return shortcutHandler(...arguments);
});
this.mdarea = new MarkdownArea(this.el, {
keyMap: {
indent: ['Ctrl+m'],
outdent: ['Ctrl+M'],
@ -35,15 +46,16 @@ app.initializers.add('flarum-markdown', function(app) {
});
});
extend(TextEditor.prototype, 'onremove', function () {
this.editor.destroy();
override(BasicEditorDriver.prototype, 'destroy', function (original) {
this.mdarea.destroy();
original();
});
extend(TextEditor.prototype, 'toolbarItems', function(items) {
extend(TextEditor.prototype, 'toolbarItems', function (items) {
const tooltip = name => app.translator.trans(`flarum-markdown.forum.composer.${name}_tooltip`);
items.add('markdown', (
<MarkdownToolbar for={this.textareaId}>
<MarkdownToolbar for={this.textareaId} setShortcutHandler={handler => shortcutHandler = handler}>
<MarkdownButton title={tooltip('header')} icon="fas fa-heading" style={{ prefix: '### ' }} />
<MarkdownButton title={tooltip('bold')} icon="fas fa-bold" style={{ prefix: '**', suffix: '**', trimFirst: true }} hotkey="b" />
<MarkdownButton title={tooltip('italic')} icon="fas fa-italic" style={{ prefix: '_', suffix: '_', trimFirst: true }} hotkey="i" />