mirror of
https://github.com/BookStackApp/BookStack.git
synced 2025-07-28 17:02:04 +03:00
Ran eslint fix on existing codebase
Had to do some manual fixing of the app.js file due to misplaced comments
This commit is contained in:
@ -2,7 +2,6 @@
|
||||
* @param {Editor} editor
|
||||
*/
|
||||
export function listen(editor) {
|
||||
|
||||
// Replace editor content
|
||||
window.$events.listen('editor::replace', ({html}) => {
|
||||
editor.setContent(html);
|
||||
@ -31,4 +30,4 @@ export function listen(editor) {
|
||||
editor.focus();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -1,32 +1,35 @@
|
||||
import {register as registerShortcuts} from "./shortcuts";
|
||||
import {listen as listenForCommonEvents} from "./common-events";
|
||||
import {scrollToQueryString} from "./scrolling";
|
||||
import {listenForDragAndPaste} from "./drop-paste-handling";
|
||||
import {getPrimaryToolbar, registerAdditionalToolbars} from "./toolbars";
|
||||
import {registerCustomIcons} from "./icons";
|
||||
import {register as registerShortcuts} from './shortcuts';
|
||||
import {listen as listenForCommonEvents} from './common-events';
|
||||
import {scrollToQueryString} from './scrolling';
|
||||
import {listenForDragAndPaste} from './drop-paste-handling';
|
||||
import {getPrimaryToolbar, registerAdditionalToolbars} from './toolbars';
|
||||
import {registerCustomIcons} from './icons';
|
||||
|
||||
import {getPlugin as getCodeeditorPlugin} from "./plugin-codeeditor";
|
||||
import {getPlugin as getDrawioPlugin} from "./plugin-drawio";
|
||||
import {getPlugin as getCustomhrPlugin} from "./plugins-customhr";
|
||||
import {getPlugin as getImagemanagerPlugin} from "./plugins-imagemanager";
|
||||
import {getPlugin as getAboutPlugin} from "./plugins-about";
|
||||
import {getPlugin as getDetailsPlugin} from "./plugins-details";
|
||||
import {getPlugin as getTasklistPlugin} from "./plugins-tasklist";
|
||||
import {getPlugin as getCodeeditorPlugin} from './plugin-codeeditor';
|
||||
import {getPlugin as getDrawioPlugin} from './plugin-drawio';
|
||||
import {getPlugin as getCustomhrPlugin} from './plugins-customhr';
|
||||
import {getPlugin as getImagemanagerPlugin} from './plugins-imagemanager';
|
||||
import {getPlugin as getAboutPlugin} from './plugins-about';
|
||||
import {getPlugin as getDetailsPlugin} from './plugins-details';
|
||||
import {getPlugin as getTasklistPlugin} from './plugins-tasklist';
|
||||
|
||||
const style_formats = [
|
||||
{title: "Large Header", format: "h2", preview: 'color: blue;'},
|
||||
{title: "Medium Header", format: "h3"},
|
||||
{title: "Small Header", format: "h4"},
|
||||
{title: "Tiny Header", format: "h5"},
|
||||
{title: "Paragraph", format: "p", exact: true, classes: ''},
|
||||
{title: "Blockquote", format: "blockquote"},
|
||||
{title: 'Large Header', format: 'h2', preview: 'color: blue;'},
|
||||
{title: 'Medium Header', format: 'h3'},
|
||||
{title: 'Small Header', format: 'h4'},
|
||||
{title: 'Tiny Header', format: 'h5'},
|
||||
{
|
||||
title: "Callouts", items: [
|
||||
{title: "Information", format: 'calloutinfo'},
|
||||
{title: "Success", format: 'calloutsuccess'},
|
||||
{title: "Warning", format: 'calloutwarning'},
|
||||
{title: "Danger", format: 'calloutdanger'}
|
||||
]
|
||||
title: 'Paragraph', format: 'p', exact: true, classes: '',
|
||||
},
|
||||
{title: 'Blockquote', format: 'blockquote'},
|
||||
{
|
||||
title: 'Callouts',
|
||||
items: [
|
||||
{title: 'Information', format: 'calloutinfo'},
|
||||
{title: 'Success', format: 'calloutsuccess'},
|
||||
{title: 'Warning', format: 'calloutwarning'},
|
||||
{title: 'Danger', format: 'calloutdanger'},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
@ -37,7 +40,7 @@ const formats = {
|
||||
calloutsuccess: {block: 'p', exact: true, attributes: {class: 'callout success'}},
|
||||
calloutinfo: {block: 'p', exact: true, attributes: {class: 'callout info'}},
|
||||
calloutwarning: {block: 'p', exact: true, attributes: {class: 'callout warning'}},
|
||||
calloutdanger: {block: 'p', exact: true, attributes: {class: 'callout danger'}}
|
||||
calloutdanger: {block: 'p', exact: true, attributes: {class: 'callout danger'}},
|
||||
};
|
||||
|
||||
const color_map = [
|
||||
@ -66,14 +69,13 @@ const color_map = [
|
||||
'#34495E', '',
|
||||
|
||||
'#000000', '',
|
||||
'#ffffff', ''
|
||||
'#ffffff', '',
|
||||
];
|
||||
|
||||
function file_picker_callback(callback, value, meta) {
|
||||
|
||||
// field_name, url, type, win
|
||||
if (meta.filetype === 'file') {
|
||||
/** @type {EntitySelectorPopup} **/
|
||||
/** @type {EntitySelectorPopup} * */
|
||||
const selector = window.$components.first('entity-selector-popup');
|
||||
selector.show(entity => {
|
||||
callback(entity.link, {
|
||||
@ -85,13 +87,12 @@ function file_picker_callback(callback, value, meta) {
|
||||
|
||||
if (meta.filetype === 'image') {
|
||||
// Show image manager
|
||||
/** @type {ImageManager} **/
|
||||
/** @type {ImageManager} * */
|
||||
const imageManager = window.$components.first('image-manager');
|
||||
imageManager.show(function (image) {
|
||||
imageManager.show(image => {
|
||||
callback(image.url, {alt: image.name});
|
||||
}, 'gallery');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
@ -100,21 +101,21 @@ function file_picker_callback(callback, value, meta) {
|
||||
*/
|
||||
function gatherPlugins(options) {
|
||||
const plugins = [
|
||||
"image",
|
||||
"table",
|
||||
"link",
|
||||
"autolink",
|
||||
"fullscreen",
|
||||
"code",
|
||||
"customhr",
|
||||
"autosave",
|
||||
"lists",
|
||||
"codeeditor",
|
||||
"media",
|
||||
"imagemanager",
|
||||
"about",
|
||||
"details",
|
||||
"tasklist",
|
||||
'image',
|
||||
'table',
|
||||
'link',
|
||||
'autolink',
|
||||
'fullscreen',
|
||||
'code',
|
||||
'customhr',
|
||||
'autosave',
|
||||
'lists',
|
||||
'codeeditor',
|
||||
'media',
|
||||
'imagemanager',
|
||||
'about',
|
||||
'details',
|
||||
'tasklist',
|
||||
options.textDirection === 'rtl' ? 'directionality' : '',
|
||||
];
|
||||
|
||||
@ -137,11 +138,11 @@ function gatherPlugins(options) {
|
||||
* Fetch custom HTML head content from the parent page head into the editor.
|
||||
*/
|
||||
function fetchCustomHeadContent() {
|
||||
const headContentLines = document.head.innerHTML.split("\n");
|
||||
const headContentLines = document.head.innerHTML.split('\n');
|
||||
const startLineIndex = headContentLines.findIndex(line => line.trim() === '<!-- Start: custom user content -->');
|
||||
const endLineIndex = headContentLines.findIndex(line => line.trim() === '<!-- End: custom user content -->');
|
||||
if (startLineIndex === -1 || endLineIndex === -1) {
|
||||
return ''
|
||||
return '';
|
||||
}
|
||||
return headContentLines.slice(startLineIndex + 1, endLineIndex).join('\n');
|
||||
}
|
||||
@ -152,7 +153,7 @@ function fetchCustomHeadContent() {
|
||||
* @param {Editor} editor
|
||||
*/
|
||||
function setupBrFilter(editor) {
|
||||
editor.serializer.addNodeFilter('br', function(nodes) {
|
||||
editor.serializer.addNodeFilter('br', nodes => {
|
||||
for (const node of nodes) {
|
||||
if (node.parent && node.parent.name === 'code') {
|
||||
const newline = tinymce.html.Node.create('#text');
|
||||
@ -200,9 +201,9 @@ function getSetupCallback(options) {
|
||||
icon: 'sourcecode',
|
||||
onAction() {
|
||||
editor.execCommand('mceToggleFormat', false, 'code');
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
@ -229,7 +230,6 @@ body {
|
||||
* @return {Object}
|
||||
*/
|
||||
export function build(options) {
|
||||
|
||||
// Set language
|
||||
window.tinymce.addI18n(options.language, options.translationMap);
|
||||
|
||||
@ -241,7 +241,7 @@ export function build(options) {
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
selector: '#html-editor',
|
||||
cache_suffix: '?version=' + version,
|
||||
cache_suffix: `?version=${version}`,
|
||||
content_css: [
|
||||
window.baseUrl('/dist/styles.css'),
|
||||
],
|
||||
@ -263,12 +263,12 @@ export function build(options) {
|
||||
automatic_uploads: false,
|
||||
custom_elements: 'doc-root,code-block',
|
||||
valid_children: [
|
||||
"-div[p|h1|h2|h3|h4|h5|h6|blockquote|code-block]",
|
||||
"+div[pre|img]",
|
||||
"-doc-root[doc-root|#text]",
|
||||
"-li[details]",
|
||||
"+code-block[pre]",
|
||||
"+doc-root[p|h1|h2|h3|h4|h5|h6|blockquote|code-block|div]"
|
||||
'-div[p|h1|h2|h3|h4|h5|h6|blockquote|code-block]',
|
||||
'+div[pre|img]',
|
||||
'-doc-root[doc-root|#text]',
|
||||
'-li[details]',
|
||||
'+code-block[pre]',
|
||||
'+doc-root[p|h1|h2|h3|h4|h5|h6|blockquote|code-block|div]',
|
||||
].join(','),
|
||||
plugins: gatherPlugins(options),
|
||||
contextmenu: false,
|
||||
@ -285,7 +285,7 @@ export function build(options) {
|
||||
color_map,
|
||||
file_picker_callback,
|
||||
paste_preprocess(plugin, args) {
|
||||
const content = args.content;
|
||||
const {content} = args;
|
||||
if (content.indexOf('<img src="file://') !== -1) {
|
||||
args.content = '';
|
||||
}
|
||||
@ -312,4 +312,4 @@ export function build(options) {
|
||||
* @property {int} pageId
|
||||
* @property {Object} translations
|
||||
* @property {Object} translationMap
|
||||
*/
|
||||
*/
|
||||
|
@ -1,4 +1,4 @@
|
||||
import Clipboard from "../services/clipboard";
|
||||
import Clipboard from '../services/clipboard';
|
||||
|
||||
let wrap;
|
||||
let draggedContentEditable;
|
||||
@ -23,8 +23,7 @@ function paste(editor, options, event) {
|
||||
|
||||
const images = clipboard.getImages();
|
||||
for (const imageFile of images) {
|
||||
|
||||
const id = "image-" + Math.random().toString(16).slice(2);
|
||||
const id = `image-${Math.random().toString(16).slice(2)}`;
|
||||
const loadingImage = window.baseUrl('/loading.gif');
|
||||
event.preventDefault();
|
||||
|
||||
@ -57,7 +56,7 @@ function paste(editor, options, event) {
|
||||
*/
|
||||
async function uploadImageFile(file, pageId) {
|
||||
if (file === null || file.type.indexOf('image') !== 0) {
|
||||
throw new Error(`Not an image file`);
|
||||
throw new Error('Not an image file');
|
||||
}
|
||||
|
||||
const remoteFilename = file.name || `image-${Date.now()}.png`;
|
||||
@ -74,7 +73,7 @@ async function uploadImageFile(file, pageId) {
|
||||
* @param {WysiwygConfigOptions} options
|
||||
*/
|
||||
function dragStart(editor, options) {
|
||||
let node = editor.selection.getNode();
|
||||
const node = editor.selection.getNode();
|
||||
|
||||
if (node.nodeName === 'IMG') {
|
||||
wrap = editor.dom.getParent(node, '.mceTemp');
|
||||
@ -96,8 +95,8 @@ function dragStart(editor, options) {
|
||||
* @param {DragEvent} event
|
||||
*/
|
||||
function drop(editor, options, event) {
|
||||
let dom = editor.dom,
|
||||
rng = tinymce.dom.RangeUtils.getCaretRangeFromPoint(event.clientX, event.clientY, editor.getDoc());
|
||||
const {dom} = editor;
|
||||
const rng = tinymce.dom.RangeUtils.getCaretRangeFromPoint(event.clientX, event.clientY, editor.getDoc());
|
||||
|
||||
// Template insertion
|
||||
const templateId = event.dataTransfer && event.dataTransfer.getData('bookstack/template');
|
||||
@ -105,7 +104,7 @@ function drop(editor, options, event) {
|
||||
event.preventDefault();
|
||||
window.$http.get(`/templates/${templateId}`).then(resp => {
|
||||
editor.selection.setRng(rng);
|
||||
editor.undoManager.transact(function () {
|
||||
editor.undoManager.transact(() => {
|
||||
editor.execCommand('mceInsertContent', false, resp.data.html);
|
||||
});
|
||||
});
|
||||
@ -117,7 +116,7 @@ function drop(editor, options, event) {
|
||||
} else if (wrap) {
|
||||
event.preventDefault();
|
||||
|
||||
editor.undoManager.transact(function () {
|
||||
editor.undoManager.transact(() => {
|
||||
editor.selection.setRng(rng);
|
||||
editor.selection.setNode(wrap);
|
||||
dom.remove(wrap);
|
||||
@ -127,7 +126,7 @@ function drop(editor, options, event) {
|
||||
// Handle contenteditable section drop
|
||||
if (!event.isDefaultPrevented() && draggedContentEditable) {
|
||||
event.preventDefault();
|
||||
editor.undoManager.transact(function () {
|
||||
editor.undoManager.transact(() => {
|
||||
const selectedNode = editor.selection.getNode();
|
||||
const range = editor.selection.getRng();
|
||||
const selectedNodeRoot = selectedNode.closest('body > *');
|
||||
@ -153,6 +152,6 @@ function drop(editor, options, event) {
|
||||
*/
|
||||
export function listenForDragAndPaste(editor, options) {
|
||||
editor.on('dragstart', () => dragStart(editor, options));
|
||||
editor.on('drop', event => drop(editor, options, event));
|
||||
editor.on('drop', event => drop(editor, options, event));
|
||||
editor.on('paste', event => paste(editor, options, event));
|
||||
}
|
||||
}
|
||||
|
@ -5,17 +5,15 @@ const icons = {
|
||||
'table-insert-column-before': '<svg width="24" height="24"><path d="M8 19h5V5H8C6.764 5 6.766 3 8 3h11a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H8c-1.229 0-1.236-2 0-2zm7-6v6h4v-6zm0-8v6h4V5ZM3.924 11h2V9c0-1.333 2-1.333 2 0v2h2c1.335 0 1.335 2 0 2h-2v2c0 1.333-2 1.333-2 0v-2h-1.9c-1.572 0-1.113-2-.1-2z"/></svg>',
|
||||
'table-insert-row-above': '<svg width="24" height="24"><path d="M5 8v5h14V8c0-1.235 2-1.234 2 0v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8C3 6.77 5 6.764 5 8zm6 7H5v4h6zm8 0h-6v4h6zM13 3.924v2h2c1.333 0 1.333 2 0 2h-2v2c0 1.335-2 1.335-2 0v-2H9c-1.333 0-1.333-2 0-2h2v-1.9c0-1.572 2-1.113 2-.1z"/></svg>',
|
||||
'table-insert-row-after': '<svg width="24" height="24"><path d="M19 16v-5H5v5c0 1.235-2 1.234-2 0V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v11c0 1.229-2 1.236-2 0zm-6-7h6V5h-6zM5 9h6V5H5Zm6 11.076v-2H9c-1.333 0-1.333-2 0-2h2v-2c0-1.335 2-1.335 2 0v2h2c1.333 0 1.333 2 0 2h-2v1.9c0 1.572-2 1.113-2 .1z"/></svg>',
|
||||
'table': '<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg"><path d="M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5c0-1.1.9-2 2-2ZM5 14v5h6v-5zm14 0h-6v5h6zm0-7h-6v5h6zM5 12h6V7H5Z"/></svg>',
|
||||
table: '<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg"><path d="M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5c0-1.1.9-2 2-2ZM5 14v5h6v-5zm14 0h-6v5h6zm0-7h-6v5h6zM5 12h6V7H5Z"/></svg>',
|
||||
'table-delete-table': '<svg width="24" height="24"><path d="M5 21a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14c0 1.1-.9 2-2 2zm0-2h14V5H5v14z"/><path d="m13.711 15.423-1.71-1.712-1.712 1.712c-1.14 1.14-2.852-.57-1.71-1.712l1.71-1.71-1.71-1.712c-1.143-1.142.568-2.853 1.71-1.71L12 10.288l1.711-1.71c1.141-1.142 2.852.57 1.712 1.71L13.71 12l1.626 1.626c1.345 1.345-.76 2.663-1.626 1.797z" style="fill-rule:nonzero;stroke-width:1.20992"/></svg>',
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* @param {Editor} editor
|
||||
*/
|
||||
export function registerCustomIcons(editor) {
|
||||
|
||||
for (const [name, svg] of Object.entries(icons)) {
|
||||
editor.ui.registry.addIcon(name, svg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -10,8 +10,8 @@ function elemIsCodeBlock(elem) {
|
||||
*/
|
||||
function showPopup(editor, code, language, callback) {
|
||||
window.$components.first('code-editor').open(code, language, (newCode, newLang) => {
|
||||
callback(newCode, newLang)
|
||||
editor.focus()
|
||||
callback(newCode, newLang);
|
||||
editor.focus();
|
||||
});
|
||||
}
|
||||
|
||||
@ -59,7 +59,7 @@ function defineCodeBlockCustomElement(editor) {
|
||||
}
|
||||
|
||||
getLanguage() {
|
||||
const getLanguageFromClassList = (classes) => {
|
||||
const getLanguageFromClassList = classes => {
|
||||
const langClasses = classes.split(' ').filter(cssClass => cssClass.startsWith('language-'));
|
||||
return (langClasses[0] || '').replace('language-', '');
|
||||
};
|
||||
@ -114,12 +114,12 @@ function defineCodeBlockCustomElement(editor) {
|
||||
this.style.height = `${height}px`;
|
||||
|
||||
const container = this.shadowRoot.querySelector('.CodeMirrorContainer');
|
||||
const renderEditor = (Code) => {
|
||||
const renderEditor = Code => {
|
||||
this.editor = Code.wysiwygView(container, this.shadowRoot, content, this.getLanguage());
|
||||
setTimeout(() => this.style.height = null, 12);
|
||||
};
|
||||
|
||||
window.importVersioned('code').then((Code) => {
|
||||
window.importVersioned('code').then(Code => {
|
||||
const timeout = (Date.now() - connectedTime < 20) ? 20 : 0;
|
||||
setTimeout(() => renderEditor(Code), timeout);
|
||||
});
|
||||
@ -135,26 +135,25 @@ function defineCodeBlockCustomElement(editor) {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
win.customElements.define('code-block', CodeBlockElement);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* @param {Editor} editor
|
||||
* @param {String} url
|
||||
*/
|
||||
function register(editor, url) {
|
||||
|
||||
editor.ui.registry.addIcon('codeblock', '<svg width="24" height="24"><path d="M4 3h16c.6 0 1 .4 1 1v16c0 .6-.4 1-1 1H4a1 1 0 0 1-1-1V4c0-.6.4-1 1-1Zm1 2v14h14V5Z"/><path d="M11.103 15.423c.277.277.277.738 0 .922a.692.692 0 0 1-1.106 0l-4.057-3.78a.738.738 0 0 1 0-1.107l4.057-3.872c.276-.277.83-.277 1.106 0a.724.724 0 0 1 0 1.014L7.6 12.012ZM12.897 8.577c-.245-.312-.2-.675.08-.955.28-.281.727-.27 1.027.033l4.057 3.78a.738.738 0 0 1 0 1.107l-4.057 3.872c-.277.277-.83.277-1.107 0a.724.724 0 0 1 0-1.014l3.504-3.412z"/></svg>')
|
||||
editor.ui.registry.addIcon('codeblock', '<svg width="24" height="24"><path d="M4 3h16c.6 0 1 .4 1 1v16c0 .6-.4 1-1 1H4a1 1 0 0 1-1-1V4c0-.6.4-1 1-1Zm1 2v14h14V5Z"/><path d="M11.103 15.423c.277.277.277.738 0 .922a.692.692 0 0 1-1.106 0l-4.057-3.78a.738.738 0 0 1 0-1.107l4.057-3.872c.276-.277.83-.277 1.106 0a.724.724 0 0 1 0 1.014L7.6 12.012ZM12.897 8.577c-.245-.312-.2-.675.08-.955.28-.281.727-.27 1.027.033l4.057 3.78a.738.738 0 0 1 0 1.107l-4.057 3.872c-.277.277-.83.277-1.107 0a.724.724 0 0 1 0-1.014l3.504-3.412z"/></svg>');
|
||||
|
||||
editor.ui.registry.addButton('codeeditor', {
|
||||
tooltip: 'Insert code block',
|
||||
icon: 'codeblock',
|
||||
onAction() {
|
||||
editor.execCommand('codeeditor');
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
editor.ui.registry.addButton('editcodeeditor', {
|
||||
@ -162,7 +161,7 @@ function register(editor, url) {
|
||||
icon: 'edit-block',
|
||||
onAction() {
|
||||
editor.execCommand('codeeditor');
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
editor.addCommand('codeeditor', () => {
|
||||
@ -185,14 +184,14 @@ function register(editor, url) {
|
||||
});
|
||||
|
||||
editor.on('dblclick', event => {
|
||||
let selectedNode = editor.selection.getNode();
|
||||
const selectedNode = editor.selection.getNode();
|
||||
if (elemIsCodeBlock(selectedNode)) {
|
||||
showPopupForCodeBlock(editor, selectedNode);
|
||||
}
|
||||
});
|
||||
|
||||
editor.on('PreInit', () => {
|
||||
editor.parser.addNodeFilter('pre', function(elms) {
|
||||
editor.parser.addNodeFilter('pre', elms => {
|
||||
for (const el of elms) {
|
||||
const wrapper = tinymce.html.Node.create('code-block', {
|
||||
contenteditable: 'false',
|
||||
@ -207,13 +206,13 @@ function register(editor, url) {
|
||||
}
|
||||
});
|
||||
|
||||
editor.parser.addNodeFilter('code-block', function(elms) {
|
||||
editor.parser.addNodeFilter('code-block', elms => {
|
||||
for (const el of elms) {
|
||||
el.attr('contenteditable', 'false');
|
||||
}
|
||||
});
|
||||
|
||||
editor.serializer.addNodeFilter('code-block', function(elms) {
|
||||
editor.serializer.addNodeFilter('code-block', elms => {
|
||||
for (const el of elms) {
|
||||
el.unwrap();
|
||||
}
|
||||
@ -221,12 +220,12 @@ function register(editor, url) {
|
||||
});
|
||||
|
||||
editor.ui.registry.addContextToolbar('codeeditor', {
|
||||
predicate: function (node) {
|
||||
predicate(node) {
|
||||
return node.nodeName.toLowerCase() === 'code-block';
|
||||
},
|
||||
items: 'editcodeeditor',
|
||||
position: 'node',
|
||||
scope: 'node'
|
||||
scope: 'node',
|
||||
});
|
||||
|
||||
editor.on('PreInit', () => {
|
||||
@ -240,4 +239,4 @@ function register(editor, url) {
|
||||
*/
|
||||
export function getPlugin(options) {
|
||||
return register;
|
||||
}
|
||||
}
|
||||
|
@ -1,4 +1,4 @@
|
||||
import DrawIO from "../services/drawio";
|
||||
import DrawIO from '../services/drawio';
|
||||
|
||||
let pageEditor = null;
|
||||
let currentNode = null;
|
||||
@ -16,12 +16,12 @@ function showDrawingManager(mceEditor, selectedNode = null) {
|
||||
pageEditor = mceEditor;
|
||||
currentNode = selectedNode;
|
||||
|
||||
/** @type {ImageManager} **/
|
||||
/** @type {ImageManager} * */
|
||||
const imageManager = window.$components.first('image-manager');
|
||||
imageManager.show(function (image) {
|
||||
imageManager.show(image => {
|
||||
if (selectedNode) {
|
||||
const imgElem = selectedNode.querySelector('img');
|
||||
pageEditor.undoManager.transact(function () {
|
||||
pageEditor.undoManager.transact(() => {
|
||||
pageEditor.dom.setAttrib(imgElem, 'src', image.url);
|
||||
pageEditor.dom.setAttrib(selectedNode, 'drawio-diagram', image.id);
|
||||
});
|
||||
@ -39,10 +39,10 @@ function showDrawingEditor(mceEditor, selectedNode = null) {
|
||||
}
|
||||
|
||||
async function updateContent(pngData) {
|
||||
const id = "image-" + Math.random().toString(16).slice(2);
|
||||
const id = `image-${Math.random().toString(16).slice(2)}`;
|
||||
const loadingImage = window.baseUrl('/loading.gif');
|
||||
|
||||
const handleUploadError = (error) => {
|
||||
const handleUploadError = error => {
|
||||
if (error.status === 413) {
|
||||
window.$events.emit('error', options.translations.serverUploadLimitText);
|
||||
} else {
|
||||
@ -54,10 +54,10 @@ async function updateContent(pngData) {
|
||||
// Handle updating an existing image
|
||||
if (currentNode) {
|
||||
DrawIO.close();
|
||||
let imgElem = currentNode.querySelector('img');
|
||||
const imgElem = currentNode.querySelector('img');
|
||||
try {
|
||||
const img = await DrawIO.upload(pngData, options.pageId);
|
||||
pageEditor.undoManager.transact(function () {
|
||||
pageEditor.undoManager.transact(() => {
|
||||
pageEditor.dom.setAttrib(imgElem, 'src', img.url);
|
||||
pageEditor.dom.setAttrib(currentNode, 'drawio-diagram', img.id);
|
||||
});
|
||||
@ -72,7 +72,7 @@ async function updateContent(pngData) {
|
||||
DrawIO.close();
|
||||
try {
|
||||
const img = await DrawIO.upload(pngData, options.pageId);
|
||||
pageEditor.undoManager.transact(function () {
|
||||
pageEditor.undoManager.transact(() => {
|
||||
pageEditor.dom.setAttrib(id, 'src', img.url);
|
||||
pageEditor.dom.get(id).parentNode.setAttribute('drawio-diagram', img.id);
|
||||
});
|
||||
@ -83,7 +83,6 @@ async function updateContent(pngData) {
|
||||
}, 5);
|
||||
}
|
||||
|
||||
|
||||
function drawingInit() {
|
||||
if (!currentNode) {
|
||||
return Promise.resolve('');
|
||||
@ -101,13 +100,12 @@ function drawingInit() {
|
||||
export function getPlugin(providedOptions) {
|
||||
options = providedOptions;
|
||||
return function(editor, url) {
|
||||
|
||||
editor.addCommand('drawio', () => {
|
||||
const selectedNode = editor.selection.getNode();
|
||||
showDrawingEditor(editor, isDrawing(selectedNode) ? selectedNode : null);
|
||||
});
|
||||
|
||||
editor.ui.registry.addIcon('diagram', `<svg width="24" height="24" fill="${options.darkMode ? '#BBB' : '#000000'}" xmlns="http://www.w3.org/2000/svg"><path d="M20.716 7.639V2.845h-4.794v1.598h-7.99V2.845H3.138v4.794h1.598v7.99H3.138v4.794h4.794v-1.598h7.99v1.598h4.794v-4.794h-1.598v-7.99zM4.736 4.443h1.598V6.04H4.736zm1.598 14.382H4.736v-1.598h1.598zm9.588-1.598h-7.99v-1.598H6.334v-7.99h1.598V6.04h7.99v1.598h1.598v7.99h-1.598zm3.196 1.598H17.52v-1.598h1.598zM17.52 6.04V4.443h1.598V6.04zm-4.21 7.19h-2.79l-.582 1.599H8.643l2.717-7.191h1.119l2.724 7.19h-1.302zm-2.43-1.006h2.086l-1.039-3.06z"/></svg>`)
|
||||
editor.ui.registry.addIcon('diagram', `<svg width="24" height="24" fill="${options.darkMode ? '#BBB' : '#000000'}" xmlns="http://www.w3.org/2000/svg"><path d="M20.716 7.639V2.845h-4.794v1.598h-7.99V2.845H3.138v4.794h1.598v7.99H3.138v4.794h4.794v-1.598h7.99v1.598h4.794v-4.794h-1.598v-7.99zM4.736 4.443h1.598V6.04H4.736zm1.598 14.382H4.736v-1.598h1.598zm9.588-1.598h-7.99v-1.598H6.334v-7.99h1.598V6.04h7.99v1.598h1.598v7.99h-1.598zm3.196 1.598H17.52v-1.598h1.598zM17.52 6.04V4.443h1.598V6.04zm-4.21 7.19h-2.79l-.582 1.599H8.643l2.717-7.191h1.119l2.724 7.19h-1.302zm-2.43-1.006h2.086l-1.039-3.06z"/></svg>`);
|
||||
|
||||
editor.ui.registry.addSplitButton('drawio', {
|
||||
tooltip: 'Insert/edit drawing',
|
||||
@ -123,7 +121,7 @@ export function getPlugin(providedOptions) {
|
||||
type: 'choiceitem',
|
||||
text: 'Drawing manager',
|
||||
value: 'drawing-manager',
|
||||
}
|
||||
},
|
||||
]);
|
||||
},
|
||||
onItemAction(api, value) {
|
||||
@ -131,25 +129,24 @@ export function getPlugin(providedOptions) {
|
||||
const selectedNode = editor.selection.getNode();
|
||||
showDrawingManager(editor, isDrawing(selectedNode) ? selectedNode : null);
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
editor.on('dblclick', event => {
|
||||
let selectedNode = editor.selection.getNode();
|
||||
const selectedNode = editor.selection.getNode();
|
||||
if (!isDrawing(selectedNode)) return;
|
||||
showDrawingEditor(editor, selectedNode);
|
||||
});
|
||||
|
||||
editor.on('SetContent', function () {
|
||||
editor.on('SetContent', () => {
|
||||
const drawings = editor.dom.select('body > div[drawio-diagram]');
|
||||
if (!drawings.length) return;
|
||||
|
||||
editor.undoManager.transact(function () {
|
||||
editor.undoManager.transact(() => {
|
||||
for (const drawing of drawings) {
|
||||
drawing.setAttribute('contenteditable', 'false');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
};
|
||||
}
|
||||
}
|
||||
|
@ -3,7 +3,6 @@
|
||||
* @param {String} url
|
||||
*/
|
||||
function register(editor, url) {
|
||||
|
||||
const aboutDialog = {
|
||||
title: 'About the WYSIWYG Editor',
|
||||
url: window.baseUrl('/help/wysiwyg'),
|
||||
@ -14,16 +13,14 @@ function register(editor, url) {
|
||||
tooltip: 'About the editor',
|
||||
onAction() {
|
||||
tinymce.activeEditor.windowManager.openUrl(aboutDialog);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* @param {WysiwygConfigOptions} options
|
||||
* @return {register}
|
||||
*/
|
||||
export function getPlugin(options) {
|
||||
return register;
|
||||
}
|
||||
}
|
||||
|
@ -3,10 +3,10 @@
|
||||
* @param {String} url
|
||||
*/
|
||||
function register(editor, url) {
|
||||
editor.addCommand('InsertHorizontalRule', function () {
|
||||
let hrElem = document.createElement('hr');
|
||||
let cNode = editor.selection.getNode();
|
||||
let parentNode = cNode.parentNode;
|
||||
editor.addCommand('InsertHorizontalRule', () => {
|
||||
const hrElem = document.createElement('hr');
|
||||
const cNode = editor.selection.getNode();
|
||||
const {parentNode} = cNode;
|
||||
parentNode.insertBefore(hrElem, cNode);
|
||||
});
|
||||
|
||||
@ -15,15 +15,14 @@ function register(editor, url) {
|
||||
tooltip: 'Insert horizontal line',
|
||||
onAction() {
|
||||
editor.execCommand('InsertHorizontalRule');
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* @param {WysiwygConfigOptions} options
|
||||
* @return {register}
|
||||
*/
|
||||
export function getPlugin(options) {
|
||||
return register;
|
||||
}
|
||||
}
|
||||
|
@ -2,10 +2,9 @@
|
||||
* @param {Editor} editor
|
||||
* @param {String} url
|
||||
*/
|
||||
import {blockElementTypes} from "./util";
|
||||
import {blockElementTypes} from './util';
|
||||
|
||||
function register(editor, url) {
|
||||
|
||||
editor.ui.registry.addIcon('details', '<svg width="24" height="24"><path d="M8.2 9a.5.5 0 0 0-.4.8l4 5.6a.5.5 0 0 0 .8 0l4-5.6a.5.5 0 0 0-.4-.8ZM20.122 18.151h-16c-.964 0-.934 2.7 0 2.7h16c1.139 0 1.173-2.7 0-2.7zM20.122 3.042h-16c-.964 0-.934 2.7 0 2.7h16c1.139 0 1.173-2.7 0-2.7z"/></svg>');
|
||||
editor.ui.registry.addIcon('togglefold', '<svg height="24" width="24"><path d="M8.12 19.3c.39.39 1.02.39 1.41 0L12 16.83l2.47 2.47c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41l-3.17-3.17c-.39-.39-1.02-.39-1.41 0l-3.17 3.17c-.4.38-.4 1.02-.01 1.41zm7.76-14.6c-.39-.39-1.02-.39-1.41 0L12 7.17 9.53 4.7c-.39-.39-1.02-.39-1.41 0-.39.39-.39 1.03 0 1.42l3.17 3.17c.39.39 1.02.39 1.41 0l3.17-3.17c.4-.39.4-1.03.01-1.42z"/></svg>');
|
||||
editor.ui.registry.addIcon('togglelabel', '<svg height="18" width="18" viewBox="0 0 24 24"><path d="M21.41,11.41l-8.83-8.83C12.21,2.21,11.7,2,11.17,2H4C2.9,2,2,2.9,2,4v7.17c0,0.53,0.21,1.04,0.59,1.41l8.83,8.83 c0.78,0.78,2.05,0.78,2.83,0l7.17-7.17C22.2,13.46,22.2,12.2,21.41,11.41z M6.5,8C5.67,8,5,7.33,5,6.5S5.67,5,6.5,5S8,5.67,8,6.5 S7.33,8,6.5,8z"/></svg>');
|
||||
@ -15,15 +14,15 @@ function register(editor, url) {
|
||||
tooltip: 'Insert collapsible block',
|
||||
onAction() {
|
||||
editor.execCommand('InsertDetailsBlock');
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
editor.ui.registry.addButton('removedetails', {
|
||||
icon: 'table-delete-table',
|
||||
tooltip: 'Unwrap',
|
||||
onAction() {
|
||||
unwrapDetailsInSelection(editor)
|
||||
}
|
||||
unwrapDetailsInSelection(editor);
|
||||
},
|
||||
});
|
||||
|
||||
editor.ui.registry.addButton('editdetials', {
|
||||
@ -31,7 +30,7 @@ function register(editor, url) {
|
||||
tooltip: 'Edit label',
|
||||
onAction() {
|
||||
showDetailLabelEditWindow(editor);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
editor.on('dblclick', event => {
|
||||
@ -46,15 +45,15 @@ function register(editor, url) {
|
||||
const details = getSelectedDetailsBlock(editor);
|
||||
details.toggleAttribute('open');
|
||||
editor.focus();
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
editor.addCommand('InsertDetailsBlock', function () {
|
||||
editor.addCommand('InsertDetailsBlock', () => {
|
||||
let content = editor.selection.getContent({format: 'html'});
|
||||
const details = document.createElement('details');
|
||||
const summary = document.createElement('summary');
|
||||
const id = 'details-' + Date.now();
|
||||
details.setAttribute('data-id', id)
|
||||
const id = `details-${Date.now()}`;
|
||||
details.setAttribute('data-id', id);
|
||||
details.appendChild(summary);
|
||||
|
||||
if (!content) {
|
||||
@ -76,12 +75,12 @@ function register(editor, url) {
|
||||
});
|
||||
|
||||
editor.ui.registry.addContextToolbar('details', {
|
||||
predicate: function (node) {
|
||||
predicate(node) {
|
||||
return node.nodeName.toLowerCase() === 'details';
|
||||
},
|
||||
items: 'editdetials toggledetails removedetails',
|
||||
position: 'node',
|
||||
scope: 'node'
|
||||
scope: 'node',
|
||||
});
|
||||
|
||||
editor.on('PreInit', () => {
|
||||
@ -135,20 +134,20 @@ function detailsDialog(editor) {
|
||||
buttons: [
|
||||
{
|
||||
type: 'cancel',
|
||||
text: 'Cancel'
|
||||
text: 'Cancel',
|
||||
},
|
||||
{
|
||||
type: 'submit',
|
||||
text: 'Save',
|
||||
primary: true,
|
||||
}
|
||||
},
|
||||
],
|
||||
onSubmit(api) {
|
||||
const {summary} = api.getData();
|
||||
setSummary(editor, summary);
|
||||
api.close();
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
function setSummary(editor, summaryContent) {
|
||||
@ -191,20 +190,20 @@ function unwrapDetailsInSelection(editor) {
|
||||
* @param {Editor} editor
|
||||
*/
|
||||
function setupElementFilters(editor) {
|
||||
editor.parser.addNodeFilter('details', function(elms) {
|
||||
editor.parser.addNodeFilter('details', elms => {
|
||||
for (const el of elms) {
|
||||
ensureDetailsWrappedInEditable(el);
|
||||
}
|
||||
});
|
||||
|
||||
editor.serializer.addNodeFilter('details', function(elms) {
|
||||
editor.serializer.addNodeFilter('details', elms => {
|
||||
for (const el of elms) {
|
||||
unwrapDetailsEditable(el);
|
||||
el.attr('open', null);
|
||||
}
|
||||
});
|
||||
|
||||
editor.serializer.addNodeFilter('doc-root', function(elms) {
|
||||
editor.serializer.addNodeFilter('doc-root', elms => {
|
||||
for (const el of elms) {
|
||||
el.unwrap();
|
||||
}
|
||||
@ -258,11 +257,10 @@ function unwrapDetailsEditable(detailsEl) {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* @param {WysiwygConfigOptions} options
|
||||
* @return {register}
|
||||
*/
|
||||
export function getPlugin(options) {
|
||||
return register;
|
||||
}
|
||||
}
|
||||
|
@ -9,24 +9,23 @@ function register(editor, url) {
|
||||
icon: 'image',
|
||||
tooltip: 'Insert image',
|
||||
onAction() {
|
||||
/** @type {ImageManager} **/
|
||||
/** @type {ImageManager} * */
|
||||
const imageManager = window.$components.first('image-manager');
|
||||
imageManager.show(function (image) {
|
||||
imageManager.show(image => {
|
||||
const imageUrl = image.thumbs.display || image.url;
|
||||
let html = `<a href="${image.url}" target="_blank">`;
|
||||
html += `<img src="${imageUrl}" alt="${image.name}">`;
|
||||
html += '</a>';
|
||||
editor.execCommand('mceInsertContent', false, html);
|
||||
}, 'gallery');
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* @param {WysiwygConfigOptions} options
|
||||
* @return {register}
|
||||
*/
|
||||
export function getPlugin(options) {
|
||||
return register;
|
||||
}
|
||||
}
|
||||
|
@ -6,11 +6,10 @@ function register(editor, url) {
|
||||
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* @param {WysiwygConfigOptions} options
|
||||
* @return {register}
|
||||
*/
|
||||
export function getPlugin(options) {
|
||||
return register;
|
||||
}
|
||||
}
|
||||
|
@ -3,7 +3,6 @@
|
||||
* @param {String} url
|
||||
*/
|
||||
function register(editor, url) {
|
||||
|
||||
// Tasklist UI buttons
|
||||
editor.ui.registry.addIcon('tasklist', '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M22,8c0-0.55-0.45-1-1-1h-7c-0.55,0-1,0.45-1,1s0.45,1,1,1h7C21.55,9,22,8.55,22,8z M13,16c0,0.55,0.45,1,1,1h7 c0.55,0,1-0.45,1-1c0-0.55-0.45-1-1-1h-7C13.45,15,13,15.45,13,16z M10.47,4.63c0.39,0.39,0.39,1.02,0,1.41l-4.23,4.25 c-0.39,0.39-1.02,0.39-1.42,0L2.7,8.16c-0.39-0.39-0.39-1.02,0-1.41c0.39-0.39,1.02-0.39,1.41,0l1.42,1.42l3.54-3.54 C9.45,4.25,10.09,4.25,10.47,4.63z M10.48,12.64c0.39,0.39,0.39,1.02,0,1.41l-4.23,4.25c-0.39,0.39-1.02,0.39-1.42,0L2.7,16.16 c-0.39-0.39-0.39-1.02,0-1.41s1.02-0.39,1.41,0l1.42,1.42l3.54-3.54C9.45,12.25,10.09,12.25,10.48,12.64L10.48,12.64z"/></svg>');
|
||||
editor.ui.registry.addToggleButton('tasklist', {
|
||||
@ -28,7 +27,7 @@ function register(editor, url) {
|
||||
const inList = parentListEl && parentListEl.classList.contains('task-list-item');
|
||||
api.setActive(Boolean(inList));
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
// Tweak existing bullet list button active state to not be active
|
||||
@ -48,32 +47,32 @@ function register(editor, url) {
|
||||
// Instead we quickly jump through an ordered list first if we're within a tasklist.
|
||||
if (elementWithinTaskList(editor.selection.getNode())) {
|
||||
editor.execCommand('InsertOrderedList', null, {
|
||||
'list-item-attributes': {class: null}
|
||||
'list-item-attributes': {class: null},
|
||||
});
|
||||
}
|
||||
|
||||
editor.execCommand('InsertUnorderedList', null, {
|
||||
'list-item-attributes': {class: null}
|
||||
'list-item-attributes': {class: null},
|
||||
});
|
||||
};
|
||||
// Tweak existing number list to not allow classes on child items
|
||||
const existingNumListButton = editor.ui.registry.getAll().buttons.numlist;
|
||||
existingNumListButton.onAction = function() {
|
||||
editor.execCommand('InsertOrderedList', null, {
|
||||
'list-item-attributes': {class: null}
|
||||
'list-item-attributes': {class: null},
|
||||
});
|
||||
};
|
||||
|
||||
// Setup filters on pre-init
|
||||
editor.on('PreInit', () => {
|
||||
editor.parser.addNodeFilter('li', function(nodes) {
|
||||
editor.parser.addNodeFilter('li', nodes => {
|
||||
for (const node of nodes) {
|
||||
if (node.attributes.map.class === 'task-list-item') {
|
||||
parseTaskListNode(node);
|
||||
}
|
||||
}
|
||||
});
|
||||
editor.serializer.addNodeFilter('li', function(nodes) {
|
||||
editor.serializer.addNodeFilter('li', nodes => {
|
||||
for (const node of nodes) {
|
||||
if (node.attributes.map.class === 'task-list-item') {
|
||||
serializeTaskListNode(node);
|
||||
@ -83,7 +82,7 @@ function register(editor, url) {
|
||||
});
|
||||
|
||||
// Handle checkbox click in editor
|
||||
editor.on('click', function(event) {
|
||||
editor.on('click', event => {
|
||||
const clickedEl = event.target;
|
||||
if (clickedEl.nodeName === 'LI' && clickedEl.classList.contains('task-list-item')) {
|
||||
handleTaskListItemClick(event, clickedEl, editor);
|
||||
@ -118,7 +117,7 @@ function handleTaskListItemClick(event, clickedEl, editor) {
|
||||
editor.undoManager.transact(() => {
|
||||
if (clickedEl.hasAttribute('checked')) {
|
||||
clickedEl.removeAttribute('checked');
|
||||
} else {
|
||||
} else {
|
||||
clickedEl.setAttribute('checked', 'checked');
|
||||
}
|
||||
});
|
||||
@ -168,4 +167,4 @@ function serializeTaskListNode(node) {
|
||||
*/
|
||||
export function getPlugin(options) {
|
||||
return register;
|
||||
}
|
||||
}
|
||||
|
@ -26,4 +26,4 @@ function scrollToText(editor, scrollId) {
|
||||
editor.selection.select(element, true);
|
||||
editor.selection.collapse(false);
|
||||
editor.focus();
|
||||
}
|
||||
}
|
||||
|
@ -4,7 +4,7 @@
|
||||
export function register(editor) {
|
||||
// Headers
|
||||
for (let i = 1; i < 5; i++) {
|
||||
editor.shortcuts.add('meta+' + i, '', ['FormatBlock', false, 'h' + (i+1)]);
|
||||
editor.shortcuts.add(`meta+${i}`, '', ['FormatBlock', false, `h${i + 1}`]);
|
||||
}
|
||||
|
||||
// Other block shortcuts
|
||||
@ -30,7 +30,7 @@ export function register(editor) {
|
||||
});
|
||||
|
||||
// Loop through callout styles
|
||||
editor.shortcuts.add('meta+9', '', function() {
|
||||
editor.shortcuts.add('meta+9', '', () => {
|
||||
const selectedNode = editor.selection.getNode();
|
||||
const callout = selectedNode ? selectedNode.closest('.callout') : null;
|
||||
|
||||
@ -39,15 +39,14 @@ export function register(editor) {
|
||||
const newFormatIndex = (currentFormatIndex + 1) % formats.length;
|
||||
const newFormat = formats[newFormatIndex];
|
||||
|
||||
editor.formatter.apply('callout' + newFormat);
|
||||
editor.formatter.apply(`callout${newFormat}`);
|
||||
});
|
||||
|
||||
// Link selector shortcut
|
||||
editor.shortcuts.add('meta+shift+K', '', function() {
|
||||
/** @var {EntitySelectorPopup} **/
|
||||
editor.shortcuts.add('meta+shift+K', '', () => {
|
||||
/** @var {EntitySelectorPopup} * */
|
||||
const selectorPopup = window.$components.first('entity-selector-popup');
|
||||
selectorPopup.show(function(entity) {
|
||||
|
||||
selectorPopup.show(entity => {
|
||||
if (editor.selection.isCollapsed()) {
|
||||
editor.insertContent(editor.dom.createHTML('a', {href: entity.link}, editor.dom.encode(entity.name)));
|
||||
} else {
|
||||
@ -56,6 +55,6 @@ export function register(editor) {
|
||||
|
||||
editor.selection.collapse(false);
|
||||
editor.focus();
|
||||
})
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -13,7 +13,7 @@ export function getPrimaryToolbar(options) {
|
||||
'bullist numlist listoverflow',
|
||||
textDirPlugins,
|
||||
'link table imagemanager-insert insertoverflow',
|
||||
'code about fullscreen'
|
||||
'code about fullscreen',
|
||||
];
|
||||
|
||||
return toolbar.filter(row => Boolean(row)).join(' | ');
|
||||
@ -26,17 +26,17 @@ function registerPrimaryToolbarGroups(editor) {
|
||||
editor.ui.registry.addGroupToolbarButton('formatoverflow', {
|
||||
icon: 'more-drawer',
|
||||
tooltip: 'More',
|
||||
items: 'strikethrough superscript subscript inlinecode removeformat'
|
||||
items: 'strikethrough superscript subscript inlinecode removeformat',
|
||||
});
|
||||
editor.ui.registry.addGroupToolbarButton('listoverflow', {
|
||||
icon: 'more-drawer',
|
||||
tooltip: 'More',
|
||||
items: 'tasklist outdent indent'
|
||||
items: 'tasklist outdent indent',
|
||||
});
|
||||
editor.ui.registry.addGroupToolbarButton('insertoverflow', {
|
||||
icon: 'more-drawer',
|
||||
tooltip: 'More',
|
||||
items: 'customhr codeeditor drawio media details'
|
||||
items: 'customhr codeeditor drawio media details',
|
||||
});
|
||||
}
|
||||
|
||||
@ -50,7 +50,7 @@ function registerLinkContextToolbar(editor) {
|
||||
},
|
||||
position: 'node',
|
||||
scope: 'node',
|
||||
items: 'link unlink openlink'
|
||||
items: 'link unlink openlink',
|
||||
});
|
||||
}
|
||||
|
||||
@ -64,7 +64,7 @@ function registerImageContextToolbar(editor) {
|
||||
},
|
||||
position: 'node',
|
||||
scope: 'node',
|
||||
items: 'image'
|
||||
items: 'image',
|
||||
});
|
||||
}
|
||||
|
||||
@ -76,4 +76,4 @@ export function registerAdditionalToolbars(editor, options) {
|
||||
registerPrimaryToolbarGroups(editor);
|
||||
registerLinkContextToolbar(editor);
|
||||
registerImageContextToolbar(editor);
|
||||
}
|
||||
}
|
||||
|
@ -1,5 +1,3 @@
|
||||
|
||||
|
||||
export const blockElementTypes = [
|
||||
'p',
|
||||
'h1',
|
||||
@ -15,5 +13,5 @@ export const blockElementTypes = [
|
||||
'details',
|
||||
'ul',
|
||||
'ol',
|
||||
'table'
|
||||
];
|
||||
'table',
|
||||
];
|
||||
|
Reference in New Issue
Block a user