Mirrors/BookStack
1
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-02-01 04:31:37 +01:00
Code Issues Releases Wiki Activity

Ran eslint fix on existing codebase

Browse Source 
Had to do some manual fixing of the app.js file due to misplaced
comments
This commit is contained in:
Dan Brown 2023-04-18 22:20:02 +01:00
parent 752ee664c2
commit e711290d8b
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
106 changed files with 905 additions and 869 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
resources/js/app.js
View File

@ -1,9 +1,16 @@
import events from './services/events';
import httpInstance from './services/http';
import Translations from './services/translations';
import * as components from './services/components';
import * as componentMap from './components';
// Url retrieval function
window.baseUrl = function(path) {
let basePath = document.querySelector('meta[name="base-url"]').getAttribute('content');
if (basePath[basePath.length-1] === '/') basePath = basePath.slice(0, basePath.length-1);
if (basePath[basePath.length - 1] === '/') basePath = basePath.slice(0, basePath.length - 1);
if (path[0] === '/') path = path.slice(1);
return basePath + '/' + path;
return `${basePath}/${path}`;
};
window.importVersioned = function(moduleName) {
@ -13,22 +20,17 @@ window.importVersioned = function(moduleName) {
};
// Set events and http services on window
import events from "./services/events"
import httpInstance from "./services/http"
window.$http = httpInstance;
window.$events = events;
// Translation setup
// Creates a global function with name 'trans' to be used in the same way as Laravel's translation system
import Translations from "./services/translations"
// Creates a global function with name 'trans' to be used in the same way as the Laravel translation system
const translator = new Translations();
window.trans = translator.get.bind(translator);
window.trans_choice = translator.getPlural.bind(translator);
window.trans_plural = translator.parsePlural.bind(translator);
// Load Components
import * as components from "./services/components"
import * as componentMap from "./components";
// Load & initialise components
components.register(componentMap);
window.$components = components;
components.init();

27
resources/js/code/index.mjs
View File

@ -1,9 +1,9 @@
import {EditorView, keymap} from "@codemirror/view";
import {EditorView, keymap} from '@codemirror/view';
import {copyTextToClipboard} from "../services/clipboard.js"
import {viewerExtensions, editorExtensions} from "./setups.js";
import {createView} from "./views.js";
import {SimpleEditorInterface} from "./simple-editor-interface.js";
import {copyTextToClipboard} from '../services/clipboard';
import {viewerExtensions, editorExtensions} from './setups';
import {createView} from './views';
import {SimpleEditorInterface} from './simple-editor-interface';
/**
* Highlight pre elements on a page
@ -32,7 +32,7 @@ export function highlightWithin(parent) {
*/
function highlightElem(elem) {
const innerCodeElem = elem.querySelector('code[class^=language-]');
elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi ,'\n');
elem.innerHTML = elem.innerHTML.replace(/<br\s*[\/]?>/gi, '\n');
const content = elem.textContent.trimEnd();
let langName = '';
@ -61,10 +61,10 @@ function highlightElem(elem) {
* @param {EditorView} editorView
*/
function addCopyIcon(editorView) {
const copyIcon = `<svg viewBox="0 0 24 24" width="16" height="16" xmlns="http://www.w3.org/2000/svg"><path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></svg>`;
const checkIcon = `<svg viewBox="0 0 24 24" width="16" height="16" xmlns="http://www.w3.org/2000/svg"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>`;
const copyIcon = '<svg viewBox="0 0 24 24" width="16" height="16" xmlns="http://www.w3.org/2000/svg"><path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></svg>';
const checkIcon = '<svg viewBox="0 0 24 24" width="16" height="16" xmlns="http://www.w3.org/2000/svg"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>';
const copyButton = document.createElement('button');
copyButton.setAttribute('type', 'button')
copyButton.setAttribute('type', 'button');
copyButton.classList.add('cm-copy-button');
copyButton.innerHTML = copyIcon;
editorView.dom.appendChild(copyButton);
@ -112,7 +112,6 @@ export function wysiwygView(cmContainer, shadowRoot, content, language) {
return editor;
}
/**
* Create a CodeMirror instance to show in the WYSIWYG pop-up editor
* @param {HTMLElement} elem
@ -126,7 +125,7 @@ export function popupEditor(elem, modeSuggestion) {
doc: content,
extensions: [
...editorExtensions(elem.parentElement),
EditorView.updateListener.of((v) => {
EditorView.updateListener.of(v => {
if (v.docChanged) {
// textArea.value = v.state.doc.toString();
}
@ -155,7 +154,7 @@ export function inlineEditor(textArea, mode) {
doc: content,
extensions: [
...editorExtensions(textArea.parentElement),
EditorView.updateListener.of((v) => {
EditorView.updateListener.of(v => {
if (v.docChanged) {
textArea.value = v.state.doc.toString();
}
@ -188,7 +187,7 @@ export function markdownEditor(elem, onChange, domEventHandlers, keyBindings) {
extensions: [
keymap.of(keyBindings),
...editorExtensions(elem.parentElement),
EditorView.updateListener.of((v) => {
EditorView.updateListener.of(v => {
onChange(v);
}),
EditorView.domEventHandlers(domEventHandlers),
@ -204,4 +203,4 @@ export function markdownEditor(elem, onChange, domEventHandlers, keyBindings) {
elem.style.display = 'none';
return ev;
}
}

15
resources/js/code/languages.js
View File

@ -1,20 +1,19 @@
import {StreamLanguage} from "@codemirror/language"
import {StreamLanguage} from '@codemirror/language';
import {css} from '@codemirror/lang-css';
import {json} from '@codemirror/lang-json';
import {javascript} from '@codemirror/lang-javascript';
import {html} from "@codemirror/lang-html";
import {html} from '@codemirror/lang-html';
import {markdown} from '@codemirror/lang-markdown';
import {php} from '@codemirror/lang-php';
import {twig} from "@ssddanbrown/codemirror-lang-twig";
import {xml} from "@codemirror/lang-xml";
import {twig} from '@ssddanbrown/codemirror-lang-twig';
import {xml} from '@codemirror/lang-xml';
const legacyLoad = async (mode) => {
const legacyLoad = async mode => {
const modes = await window.importVersioned('legacy-modes');
return StreamLanguage.define(modes[mode]);
};
// Mapping of possible languages or formats from user input to their codemirror modes.
// Value can be a mode string or a function that will receive the code content & return the mode string.
// The function option is used in the event the exact mode could be dynamic depending on the code.
@ -58,7 +57,7 @@ const modeMap = {
pascal: () => legacyLoad('pascal'),
perl: () => legacyLoad('perl'),
pgsql: () => legacyLoad('pgSQL'),
php: async (code) => {
php: async code => {
const hasTags = code.includes('<?php');
return php({plain: !hasTags});
},
@ -113,4 +112,4 @@ export function getLanguageExtension(langSuggestion, content) {
}
return language(content);
}
}

12
resources/js/code/legacy-modes.mjs
View File

@ -1,4 +1,6 @@
export {c, cpp, csharp, java, kotlin, scala, dart} from '@codemirror/legacy-modes/mode/clike';
export {
c, cpp, csharp, java, kotlin, scala, dart,
} from '@codemirror/legacy-modes/mode/clike';
export {diff} from '@codemirror/legacy-modes/mode/diff';
export {fortran} from '@codemirror/legacy-modes/mode/fortran';
export {go} from '@codemirror/legacy-modes/mode/go';
@ -17,11 +19,13 @@ export {ruby} from '@codemirror/legacy-modes/mode/ruby';
export {rust} from '@codemirror/legacy-modes/mode/rust';
export {scheme} from '@codemirror/legacy-modes/mode/scheme';
export {shell} from '@codemirror/legacy-modes/mode/shell';
export {standardSQL, pgSQL, msSQL, mySQL, sqlite, plSQL} from '@codemirror/legacy-modes/mode/sql';
export {
standardSQL, pgSQL, msSQL, mySQL, sqlite, plSQL,
} from '@codemirror/legacy-modes/mode/sql';
export {stex} from '@codemirror/legacy-modes/mode/stex';
export {swift} from "@codemirror/legacy-modes/mode/swift";
export {swift} from '@codemirror/legacy-modes/mode/swift';
export {toml} from '@codemirror/legacy-modes/mode/toml';
export {vb} from '@codemirror/legacy-modes/mode/vb';
export {vbScript} from '@codemirror/legacy-modes/mode/vbscript';
export {yaml} from '@codemirror/legacy-modes/mode/yaml';
export {smarty} from "@ssddanbrown/codemirror-lang-smarty";
export {smarty} from '@ssddanbrown/codemirror-lang-smarty';

18
resources/js/code/setups.js
View File

@ -1,9 +1,13 @@
import {EditorView, keymap, drawSelection, highlightActiveLine, dropCursor,
rectangularSelection, lineNumbers, highlightActiveLineGutter} from "@codemirror/view"
import {bracketMatching} from "@codemirror/language"
import {defaultKeymap, history, historyKeymap, indentWithTab} from "@codemirror/commands"
import {EditorState} from "@codemirror/state"
import {getTheme} from "./themes";
import {
EditorView, keymap, drawSelection, highlightActiveLine, dropCursor,
rectangularSelection, lineNumbers, highlightActiveLineGutter,
} from '@codemirror/view';
import {bracketMatching} from '@codemirror/language';
import {
defaultKeymap, history, historyKeymap, indentWithTab,
} from '@codemirror/commands';
import {EditorState} from '@codemirror/state';
import {getTheme} from './themes';
/**
* @param {Element} parentEl
@ -51,4 +55,4 @@ export function editorExtensions(parentEl) {
]),
EditorView.lineWrapping,
];
}
}

11
resources/js/code/simple-editor-interface.js
View File

@ -1,7 +1,7 @@
import {updateViewLanguage} from "./views";
import {updateViewLanguage} from './views';
export class SimpleEditorInterface {
/**
* @param {EditorView} editorView
*/
@ -22,9 +22,9 @@ export class SimpleEditorInterface {
* @param content
*/
setContent(content) {
const doc = this.ev.state.doc;
const {doc} = this.ev.state;
this.ev.dispatch({
changes: {from: 0, to: doc.length, insert: content}
changes: {from: 0, to: doc.length, insert: content},
});
}
@ -43,4 +43,5 @@ export class SimpleEditorInterface {
setMode(mode, content = '') {
updateViewLanguage(this.ev, mode, content);
}
}
}

148
resources/js/code/themes.js
View File

@ -1,62 +1,102 @@
import {tags} from "@lezer/highlight";
import {HighlightStyle, syntaxHighlighting} from "@codemirror/language";
import {EditorView} from "@codemirror/view";
import {oneDarkHighlightStyle, oneDarkTheme} from "@codemirror/theme-one-dark";
import {tags} from '@lezer/highlight';
import {HighlightStyle, syntaxHighlighting} from '@codemirror/language';
import {EditorView} from '@codemirror/view';
import {oneDarkHighlightStyle, oneDarkTheme} from '@codemirror/theme-one-dark';
const defaultLightHighlightStyle = HighlightStyle.define([
{ tag: tags.meta,
color: "#388938" },
{ tag: tags.link,
textDecoration: "underline" },
{ tag: tags.heading,
textDecoration: "underline",
fontWeight: "bold" },
{ tag: tags.emphasis,
fontStyle: "italic" },
{ tag: tags.strong,
fontWeight: "bold" },
{ tag: tags.strikethrough,
textDecoration: "line-through" },
{ tag: tags.keyword,
color: "#708" },
{ tag: [tags.atom, tags.bool, tags.url, tags.contentSeparator, tags.labelName],
color: "#219" },
{ tag: [tags.literal, tags.inserted],
color: "#164" },
{ tag: [tags.string, tags.deleted],
color: "#a11" },
{ tag: [tags.regexp, tags.escape, tags.special(tags.string)],
color: "#e40" },
{ tag: tags.definition(tags.variableName),
color: "#00f" },
{ tag: tags.local(tags.variableName),
color: "#30a" },
{ tag: [tags.typeName, tags.namespace],
color: "#085" },
{ tag: tags.className,
color: "#167" },
{ tag: [tags.special(tags.variableName), tags.macroName],
color: "#256" },
{ tag: tags.definition(tags.propertyName),
color: "#00c" },
{ tag: tags.compareOperator,
color: "#708" },
{ tag: tags.comment,
color: "#940" },
{ tag: tags.invalid,
color: "#f00" }
{
tag: tags.meta,
color: '#388938',
},
{
tag: tags.link,
textDecoration: 'underline',
},
{
tag: tags.heading,
textDecoration: 'underline',
fontWeight: 'bold',
},
{
tag: tags.emphasis,
fontStyle: 'italic',
},
{
tag: tags.strong,
fontWeight: 'bold',
},
{
tag: tags.strikethrough,
textDecoration: 'line-through',
},
{
tag: tags.keyword,
color: '#708',
},
{
tag: [tags.atom, tags.bool, tags.url, tags.contentSeparator, tags.labelName],
color: '#219',
},
{
tag: [tags.literal, tags.inserted],
color: '#164',
},
{
tag: [tags.string, tags.deleted],
color: '#a11',
},
{
tag: [tags.regexp, tags.escape, tags.special(tags.string)],
color: '#e40',
},
{
tag: tags.definition(tags.variableName),
color: '#00f',
},
{
tag: tags.local(tags.variableName),
color: '#30a',
},
{
tag: [tags.typeName, tags.namespace],
color: '#085',
},
{
tag: tags.className,
color: '#167',
},
{
tag: [tags.special(tags.variableName), tags.macroName],
color: '#256',
},
{
tag: tags.definition(tags.propertyName),
color: '#00c',
},
{
tag: tags.compareOperator,
color: '#708',
},
{
tag: tags.comment,
color: '#940',
},
{
tag: tags.invalid,
color: '#f00',
},
]);
const defaultThemeSpec = {
"&": {
backgroundColor: "#FFF",
color: "#000",
'&': {
backgroundColor: '#FFF',
color: '#000',
},
"&.cm-focused": {
outline: "none",
'&.cm-focused': {
outline: 'none',
},
".cm-line": {
lineHeight: "1.6",
'.cm-line': {
lineHeight: '1.6',
},
};
@ -82,10 +122,10 @@ export function getTheme(viewParentEl) {
if (tagStyles.length) {
highlightStyle = HighlightStyle.define(tagStyles);
}
}
},
};
window.$events.emitPublic(viewParentEl, 'library-cm6::configure-theme', eventData);
return [viewTheme, syntaxHighlighting(highlightStyle)];
}
}

10
resources/js/code/views.js
View File

@ -1,6 +1,6 @@
import {Compartment} from "@codemirror/state";
import {EditorView} from "@codemirror/view";
import {getLanguageExtension} from "./languages";
import {Compartment} from '@codemirror/state';
import {EditorView} from '@codemirror/view';
import {getLanguageExtension} from './languages';
const viewLangCompartments = new WeakMap();
@ -33,6 +33,6 @@ export async function updateViewLanguage(ev, modeSuggestion, content) {
const language = await getLanguageExtension(modeSuggestion, content);
ev.dispatch({
effects: compartment.reconfigure(language ? language : [])
effects: compartment.reconfigure(language || []),
});
}
}

14
resources/js/components/add-remove-rows.js
View File

@ -1,6 +1,6 @@
import {onChildEvent} from "../services/dom";
import {uniqueId} from "../services/util";
import {Component} from "./component";
import {onChildEvent} from '../services/dom';
import {uniqueId} from '../services/util';
import {Component} from './component';
/**
* AddRemoveRows
@ -8,6 +8,7 @@ import {Component} from "./component";
* Needs a model row to use when adding a new row.
*/
export class AddRemoveRows extends Component {
setup() {
this.modelRow = this.$refs.model;
this.addButton = this.$refs.add;
@ -19,7 +20,7 @@ export class AddRemoveRows extends Component {
setupListeners() {
this.addButton.addEventListener('click', this.add.bind(this));
onChildEvent(this.$el, this.removeSelector, 'click', (e) => {
onChildEvent(this.$el, this.removeSelector, 'click', e => {
const row = e.target.closest(this.rowSelector);
row.remove();
});
@ -44,9 +45,10 @@ export class AddRemoveRows extends Component {
*/
setClonedInputNames(clone) {
const rowId = uniqueId();
const randRowIdElems = clone.querySelectorAll(`[name*="randrowid"]`);
const randRowIdElems = clone.querySelectorAll('[name*="randrowid"]');
for (const elem of randRowIdElems) {
elem.name = elem.name.split('randrowid').join(rowId);
}
}
}
}

8
resources/js/components/ajax-delete-row.js
View File

@ -1,7 +1,8 @@
import {onSelect} from "../services/dom";
import {Component} from "./component";
import {onSelect} from '../services/dom';
import {Component} from './component';
export class AjaxDeleteRow extends Component {
setup() {
this.row = this.$el;
this.url = this.$opts.url;
@ -24,4 +25,5 @@ export class AjaxDeleteRow extends Component {
this.row.style.pointerEvents = null;
});
}
}
}

10
resources/js/components/ajax-form.js
View File

@ -1,5 +1,5 @@
import {onEnterPress, onSelect} from "../services/dom";
import {Component} from "./component";
import {onEnterPress, onSelect} from '../services/dom';
import {Component} from './component';
/**
* Ajax Form
@ -11,6 +11,7 @@ import {Component} from "./component";
* otherwise will act as a fake form element.
*/
export class AjaxForm extends Component {
setup() {
this.container = this.$el;
this.responseContainer = this.container;
@ -27,7 +28,6 @@ export class AjaxForm extends Component {
}
setupListeners() {
if (this.container.tagName === 'FORM') {
this.container.addEventListener('submit', this.submitRealForm.bind(this));
return;
@ -43,7 +43,7 @@ export class AjaxForm extends Component {
submitFakeForm() {
const fd = new FormData();
const inputs = this.container.querySelectorAll(`[name]`);
const inputs = this.container.querySelectorAll('[name]');
for (const input of inputs) {
fd.append(input.getAttribute('name'), input.value);
}
@ -76,4 +76,4 @@ export class AjaxForm extends Component {
this.responseContainer.style.pointerEvents = null;
}
}
}

13
resources/js/components/attachments-list.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
/**
* Attachments List
@ -13,11 +13,11 @@ export class AttachmentsList extends Component {
}
setupListeners() {
const isExpectedKey = (event) => event.key === 'Control' || event.key === 'Meta';
const isExpectedKey = event => event.key === 'Control' || event.key === 'Meta';
window.addEventListener('keydown', event => {
if (isExpectedKey(event)) {
if (isExpectedKey(event)) {
this.addOpenQueryToLinks();
}
}
}, {passive: true});
window.addEventListener('keyup', event => {
if (isExpectedKey(event)) {
@ -30,7 +30,7 @@ export class AttachmentsList extends Component {
const links = this.container.querySelectorAll('a.attachment-file');
for (const link of links) {
if (link.href.split('?')[1] !== 'open=true') {
link.href = link.href + '?open=true';
link.href += '?open=true';
link.setAttribute('target', '_blank');
}
}
@ -43,4 +43,5 @@ export class AttachmentsList extends Component {
link.removeAttribute('target');
}
}
}
}

6
resources/js/components/attachments.js
View File

@ -1,5 +1,5 @@
import {showLoading} from "../services/dom";
import {Component} from "./component";
import {showLoading} from '../services/dom';
import {Component} from './component';
export class Attachments extends Component {
@ -73,4 +73,4 @@ export class Attachments extends Component {
this.listContainer.classList.remove('hidden');
}
}
}

4
resources/js/components/auto-submit.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class AutoSubmit extends Component {
@ -8,4 +8,4 @@ export class AutoSubmit extends Component {
this.form.submit();
}
}
}

16
resources/js/components/auto-suggest.js
View File

@ -1,7 +1,7 @@
import {escapeHtml} from "../services/util";
import {onChildEvent} from "../services/dom";
import {Component} from "./component";
import {KeyboardNavigationHandler} from "../services/keyboard-navigation";
import {escapeHtml} from '../services/util';
import {onChildEvent} from '../services/dom';
import {Component} from './component';
import {KeyboardNavigationHandler} from '../services/keyboard-navigation';
const ajaxCache = {};
@ -9,6 +9,7 @@ const ajaxCache = {};
* AutoSuggest
*/
export class AutoSuggest extends Component {
setup() {
this.parent = this.$el.parentElement;
this.container = this.$el;
@ -67,9 +68,7 @@ export class AutoSuggest extends Component {
const search = this.input.value.toLowerCase();
const suggestions = await this.loadSuggestions(search, nameFilter);
const toShow = suggestions.filter(val => {
return search === '' || val.toLowerCase().startsWith(search);
}).slice(0, 10);
const toShow = suggestions.filter(val => search === '' || val.toLowerCase().startsWith(search)).slice(0, 10);
this.displaySuggestions(toShow);
}
@ -126,4 +125,5 @@ export class AutoSuggest extends Component {
this.hideSuggestions();
}
}
}
}

20
resources/js/components/back-to-top.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class BackToTop extends Component {
@ -18,7 +18,7 @@ export class BackToTop extends Component {
}
onPageScroll() {
let scrollTopPos = document.documentElement.scrollTop || document.body.scrollTop || 0;
const scrollTopPos = document.documentElement.scrollTop || document.body.scrollTop || 0;
if (!this.showing && scrollTopPos > this.breakPoint) {
this.button.style.display = 'block';
this.showing = true;
@ -35,15 +35,15 @@ export class BackToTop extends Component {
}
scrollToTop() {
let targetTop = this.targetElem.getBoundingClientRect().top;
let scrollElem = document.documentElement.scrollTop ? document.documentElement : document.body;
let duration = 300;
let start = Date.now();
let scrollStart = this.targetElem.getBoundingClientRect().top;
const targetTop = this.targetElem.getBoundingClientRect().top;
const scrollElem = document.documentElement.scrollTop ? document.documentElement : document.body;
const duration = 300;
const start = Date.now();
const scrollStart = this.targetElem.getBoundingClientRect().top;
function setPos() {
let percentComplete = (1-((Date.now() - start) / duration));
let target = Math.abs(percentComplete * scrollStart);
const percentComplete = (1 - ((Date.now() - start) / duration));
const target = Math.abs(percentComplete * scrollStart);
if (percentComplete > 0) {
scrollElem.scrollTop = target;
requestAnimationFrame(setPos.bind(this));
@ -55,4 +55,4 @@ export class BackToTop extends Component {
requestAnimationFrame(setPos.bind(this));
}
}
}

63
resources/js/components/book-sort.js
View File

@ -1,25 +1,25 @@
import Sortable, {MultiDrag} from "sortablejs";
import {Component} from "./component";
import {htmlToDom} from "../services/dom";
import Sortable, {MultiDrag} from 'sortablejs';
import {Component} from './component';
import {htmlToDom} from '../services/dom';
// Auto sort control
const sortOperations = {
name: function(a, b) {
name(a, b) {
const aName = a.getAttribute('data-name').trim().toLowerCase();
const bName = b.getAttribute('data-name').trim().toLowerCase();
return aName.localeCompare(bName);
},
created: function(a, b) {
created(a, b) {
const aTime = Number(a.getAttribute('data-created'));
const bTime = Number(b.getAttribute('data-created'));
return bTime - aTime;
},
updated: function(a, b) {
updated(a, b) {
const aTime = Number(a.getAttribute('data-updated'));
const bTime = Number(b.getAttribute('data-updated'));
return bTime - aTime;
},
chaptersFirst: function(a, b) {
chaptersFirst(a, b) {
const aType = a.getAttribute('data-type');
const bType = b.getAttribute('data-type');
if (aType === bType) {
@ -27,7 +27,7 @@ const sortOperations = {
}
return (aType === 'chapter' ? -1 : 1);
},
chaptersLast: function(a, b) {
chaptersLast(a, b) {
const aType = a.getAttribute('data-type');
const bType = b.getAttribute('data-type');
if (aType === bType) {
@ -51,7 +51,7 @@ const moveActions = {
run(elem, parent, book) {
const newSibling = elem.previousElementSibling || parent;
newSibling.insertAdjacentElement('beforebegin', elem);
}
},
},
down: {
active(elem, parent, book) {
@ -60,7 +60,7 @@ const moveActions = {
run(elem, parent, book) {
const newSibling = elem.nextElementSibling || parent;
newSibling.insertAdjacentElement('afterend', elem);
}
},
},
next_book: {
active(elem, parent, book) {
@ -69,7 +69,7 @@ const moveActions = {
run(elem, parent, book) {
const newList = book.nextElementSibling.querySelector('ul');
newList.prepend(elem);
}
},
},
prev_book: {
active(elem, parent, book) {
@ -78,7 +78,7 @@ const moveActions = {
run(elem, parent, book) {
const newList = book.previousElementSibling.querySelector('ul');
newList.appendChild(elem);
}
},
},
next_chapter: {
active(elem, parent, book) {
@ -93,7 +93,7 @@ const moveActions = {
const topItems = Array.from(topLevel.parentElement.children);
const index = topItems.indexOf(topLevel);
return topItems.slice(index + 1).find(elem => elem.dataset.type === 'chapter');
}
},
},
prev_chapter: {
active(elem, parent, book) {
@ -108,7 +108,7 @@ const moveActions = {
const topItems = Array.from(topLevel.parentElement.children);
const index = topItems.indexOf(topLevel);
return topItems.slice(0, index).reverse().find(elem => elem.dataset.type === 'chapter');
}
},
},
book_end: {
active(elem, parent, book) {
@ -116,7 +116,7 @@ const moveActions = {
},
run(elem, parent, book) {
book.querySelector('ul').append(elem);
}
},
},
book_start: {
active(elem, parent, book) {
@ -124,7 +124,7 @@ const moveActions = {
},
run(elem, parent, book) {
book.querySelector('ul').prepend(elem);
}
},
},
before_chapter: {
active(elem, parent, book) {
@ -132,7 +132,7 @@ const moveActions = {
},
run(elem, parent, book) {
parent.insertAdjacentElement('beforebegin', elem);
}
},
},
after_chapter: {
active(elem, parent, book) {
@ -140,7 +140,7 @@ const moveActions = {
},
run(elem, parent, book) {
parent.insertAdjacentElement('afterend', elem);
}
},
},
};
@ -197,11 +197,11 @@ export class BookSort extends Component {
let sortFunction = sortOperations[sort];
if (reverse && reversibleTypes.includes(sort)) {
sortFunction = function(a, b) {
return 0 - sortOperations[sort](a, b)
return 0 - sortOperations[sort](a, b);
};
}
for (let list of sortLists) {
for (const list of sortLists) {
const directItems = Array.from(list.children).filter(child => child.matches('li'));
directItems.sort(sortFunction).forEach(sortedItem => {
list.appendChild(sortedItem);
@ -221,7 +221,7 @@ export class BookSort extends Component {
const alreadyAdded = this.container.querySelector(`[data-type="book"][data-id="${entityInfo.id}"]`) !== null;
if (alreadyAdded) return;
const entitySortItemUrl = entityInfo.link + '/sort-item';
const entitySortItemUrl = `${entityInfo.link}/sort-item`;
window.$http.get(entitySortItemUrl).then(resp => {
const newBookContainer = htmlToDom(resp.data);
this.sortContainer.append(newBookContainer);
@ -249,9 +249,9 @@ export class BookSort extends Component {
const chapterGroupConfig = {
name: 'chapter',
pull: ['book', 'chapter'],
put: function(toList, fromList, draggedElem) {
put(toList, fromList, draggedElem) {
return draggedElem.getAttribute('data-type') === 'page';
}
},
};
for (const sortElem of sortElems) {
@ -260,8 +260,8 @@ export class BookSort extends Component {
animation: 150,
fallbackOnBody: true,
swapThreshold: 0.65,
onSort: (event) => {
this.ensureNoNestedChapters()
onSort: event => {
this.ensureNoNestedChapters();
this.updateMapInput();
this.updateMoveActionStateForAll();
},
@ -304,7 +304,7 @@ export class BookSort extends Component {
const entityMap = [];
const lists = this.container.querySelectorAll('.sort-list');
for (let list of lists) {
for (const list of lists) {
const bookId = list.closest('[data-type="book"]').getAttribute('data-id');
const directChildren = Array.from(list.children)
.filter(elem => elem.matches('[data-type="page"], [data-type="chapter"]'));
@ -332,9 +332,9 @@ export class BookSort extends Component {
entityMap.push({
id: childId,
sort: index,
parentChapter: parentChapter,
type: type,
book: bookId
parentChapter,
type,
book: bookId,
});
const subPages = childElem.querySelectorAll('[data-type="page"]');
@ -344,7 +344,7 @@ export class BookSort extends Component {
sort: i,
parentChapter: childId,
type: 'page',
book: bookId
book: bookId,
});
}
}
@ -383,4 +383,5 @@ export class BookSort extends Component {
this.updateMoveActionState(item);
}
}
}
}

7
resources/js/components/chapter-contents.js
View File

@ -1,5 +1,5 @@
import {slideUp, slideDown} from "../services/animations";
import {Component} from "./component";
import {slideUp, slideDown} from '../services/animations';
import {Component} from './component';
export class ChapterContents extends Component {
@ -27,6 +27,7 @@ export class ChapterContents extends Component {
click(event) {
event.preventDefault();
this.isOpen ? this.close() : this.open();
this.isOpen ? this.close() : this.open();
}
}

25
resources/js/components/code-editor.js
View File

@ -1,6 +1,5 @@
import {onChildEvent, onEnterPress, onSelect} from "../services/dom";
import {Component} from "./component";
import {onChildEvent, onEnterPress, onSelect} from '../services/dom';
import {Component} from './component';
export class CodeEditor extends Component {
@ -10,7 +9,9 @@ export class CodeEditor extends Component {
editor = null;
callback = null;
history = {};
historyKey = 'code_history';
setup() {
@ -77,13 +78,13 @@ export class CodeEditor extends Component {
button.setAttribute('data-favourite', isFavorite ? 'true' : 'false');
window.$http.patch('/preferences/update-code-language-favourite', {
language: language,
active: isFavorite
language,
active: isFavorite,
});
this.sortLanguageList();
if (isFavorite) {
button.scrollIntoView({block: "center", behavior: "smooth"});
button.scrollIntoView({block: 'center', behavior: 'smooth'});
}
});
}
@ -95,7 +96,7 @@ export class CodeEditor extends Component {
if (aFav && !bFav) {
return -1;
} else if (bFav && !aFav) {
} if (bFav && !aFav) {
return 1;
}
@ -133,7 +134,7 @@ export class CodeEditor extends Component {
this.getPopup().show(() => {
this.editor.focus();
}, () => {
this.addHistory()
this.addHistory();
});
}
@ -162,7 +163,7 @@ export class CodeEditor extends Component {
const isMatch = inputLang === lang;
link.classList.toggle('active', isMatch);
if (isMatch) {
link.scrollIntoView({block: "center", behavior: "smooth"});
link.scrollIntoView({block: 'center', behavior: 'smooth'});
}
}
}
@ -172,8 +173,8 @@ export class CodeEditor extends Component {
const historyKeys = Object.keys(this.history).reverse();
this.historyDropDown.classList.toggle('hidden', historyKeys.length === 0);
this.historyList.innerHTML = historyKeys.map(key => {
const localTime = (new Date(parseInt(key))).toLocaleTimeString();
return `<li><button type="button" data-time="${key}" class="text-item">${localTime}</button></li>`;
const localTime = (new Date(parseInt(key))).toLocaleTimeString();
return `<li><button type="button" data-time="${key}" class="text-item">${localTime}</button></li>`;
}).join('');
}
@ -191,4 +192,4 @@ export class CodeEditor extends Component {
window.sessionStorage.setItem(this.historyKey, historyString);
}
}
}

8
resources/js/components/code-highlighter.js
View File

@ -1,6 +1,6 @@
import {Component} from "./component";
import {Component} from './component';
export class CodeHighlighter extends Component{
export class CodeHighlighter extends Component {
setup() {
const container = this.$el;
@ -8,9 +8,9 @@ export class CodeHighlighter extends Component{
const codeBlocks = container.querySelectorAll('pre');
if (codeBlocks.length > 0) {
window.importVersioned('code').then(Code => {
Code.highlightWithin(container);
Code.highlightWithin(container);
});
}
}
}
}

6
resources/js/components/code-textarea.js
View File

@ -2,14 +2,14 @@
* A simple component to render a code editor within the textarea
* this exists upon.
*/
import {Component} from "./component";
import {Component} from './component';
export class CodeTextarea extends Component {
async setup() {
const mode = this.$opts.mode;
const {mode} = this.$opts;
const Code = await window.importVersioned('code');
Code.inlineEditor(this.$el, mode);
}
}
}

6
resources/js/components/collapsible.js
View File

@ -1,5 +1,5 @@
import {slideDown, slideUp} from "../services/animations";
import {Component} from "./component";
import {slideDown, slideUp} from '../services/animations';
import {Component} from './component';
/**
* Collapsible
@ -45,4 +45,4 @@ export class Collapsible extends Component {
}
}
}
}

5
resources/js/components/component.js
View File

@ -51,8 +51,9 @@ export class Component {
const componentName = this.$name;
const event = new CustomEvent(`${componentName}-${eventName}`, {
bubbles: true,
detail: data
detail: data,
});
this.$el.dispatchEvent(event);
}
}
}

10
resources/js/components/confirm-dialog.js
View File

@ -1,5 +1,5 @@
import {onSelect} from "../services/dom";
import {Component} from "./component";
import {onSelect} from '../services/dom';
import {Component} from './component';
/**
* Custom equivalent of window.confirm() using our popup component.
@ -26,7 +26,7 @@ export class ConfirmDialog extends Component {
});
return new Promise((res, rej) => {
this.res = res;
this.res = res;
});
}
@ -42,9 +42,9 @@ export class ConfirmDialog extends Component {
*/
sendResult(result) {
if (this.res) {
this.res(result)
this.res(result);
this.res = null;
}
}
}
}

4
resources/js/components/custom-checkbox.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class CustomCheckbox extends Component {
@ -30,4 +30,4 @@ export class CustomCheckbox extends Component {
this.display.setAttribute('aria-checked', checked);
}
}
}

5
resources/js/components/details-highlighter.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class DetailsHighlighter extends Component {
@ -19,4 +19,5 @@ export class DetailsHighlighter extends Component {
}
this.dealtWith = true;
}
}
}

10
resources/js/components/dropdown-search.js
View File

@ -1,6 +1,6 @@
import {debounce} from "../services/util";
import {transitionHeight} from "../services/animations";
import {Component} from "./component";
import {debounce} from '../services/util';
import {transitionHeight} from '../services/animations';
import {Component} from './component';
export class DropdownSearch extends Component {
@ -40,7 +40,7 @@ export class DropdownSearch extends Component {
runLocalSearch(searchTerm) {
const listItems = this.listContainerElem.querySelectorAll(this.localSearchSelector);
for (let listItem of listItems) {
for (const listItem of listItems) {
const match = !searchTerm || listItem.textContent.toLowerCase().includes(searchTerm);
listItem.style.display = match ? 'flex' : 'none';
listItem.classList.toggle('hidden', !match);
@ -79,4 +79,4 @@ export class DropdownSearch extends Component {
this.loadingElem.style.display = show ? 'block' : 'none';
}
}
}

22
resources/js/components/dropdown.js
View File

@ -1,6 +1,6 @@
import {onSelect} from "../services/dom";
import {KeyboardNavigationHandler} from "../services/keyboard-navigation";
import {Component} from "./component";
import {onSelect} from '../services/dom';
import {KeyboardNavigationHandler} from '../services/keyboard-navigation';
import {Component} from './component';
/**
* Dropdown
@ -41,7 +41,7 @@ export class Dropdown extends Component {
this.menu.style.position = 'fixed';
this.menu.style.width = `${menuOriginalRect.width}px`;
this.menu.style.left = `${menuOriginalRect.left}px`;
heightOffset = dropUpwards ? (window.innerHeight - menuOriginalRect.top - toggleHeight / 2) : menuOriginalRect.top;
heightOffset = dropUpwards ? (window.innerHeight - menuOriginalRect.top - toggleHeight / 2) : menuOriginalRect.top;
}
// Adjust menu to display upwards if near the bottom of the screen
@ -76,7 +76,7 @@ export class Dropdown extends Component {
}
hideAll() {
for (let dropdown of window.$components.get('dropdown')) {
for (const dropdown of window.$components.get('dropdown')) {
dropdown.hide();
}
}
@ -100,13 +100,13 @@ export class Dropdown extends Component {
}
setupListeners() {
const keyboardNavHandler = new KeyboardNavigationHandler(this.container, (event) => {
const keyboardNavHandler = new KeyboardNavigationHandler(this.container, event => {
this.hide();
this.toggle.focus();
if (!this.bubbleEscapes) {
event.stopPropagation();
}
}, (event) => {
}, event => {
if (event.target.nodeName === 'INPUT') {
event.preventDefault();
event.stopPropagation();
@ -120,10 +120,10 @@ export class Dropdown extends Component {
// Hide menu on option click
this.container.addEventListener('click', event => {
const possibleChildren = Array.from(this.menu.querySelectorAll('a'));
if (possibleChildren.includes(event.target)) {
this.hide();
}
const possibleChildren = Array.from(this.menu.querySelectorAll('a'));
if (possibleChildren.includes(event.target)) {
this.hide();
}
});
onSelect(this.toggle, event => {

21
resources/js/components/dropzone.js
View File

@ -1,8 +1,9 @@
import DropZoneLib from "dropzone";
import {fadeOut} from "../services/animations";
import {Component} from "./component";
import DropZoneLib from 'dropzone';
import {fadeOut} from '../services/animations';
import {Component} from './component';
export class Dropzone extends Component {
setup() {
this.container = this.$el;
this.url = this.$opts.url;
@ -25,19 +26,18 @@ export class Dropzone extends Component {
this.dz.on('sending', _this.onSending.bind(_this));
this.dz.on('success', _this.onSuccess.bind(_this));
this.dz.on('error', _this.onError.bind(_this));
}
},
});
}
onSending(file, xhr, data) {
const token = window.document.querySelector('meta[name=token]').getAttribute('content');
data.append('_token', token);
xhr.ontimeout = (e) => {
xhr.ontimeout = e => {
this.dz.emit('complete', file);
this.dz.emit('error', file, this.timeoutMessage);
}
};
}
onSuccess(file, data) {
@ -55,10 +55,10 @@ export class Dropzone extends Component {
onError(file, errorMessage, xhr) {
this.$emit('error', {file, errorMessage, xhr});
const setMessage = (message) => {
const setMessage = message => {
const messsageEl = file.previewElement.querySelector('[data-dz-errormessage]');
messsageEl.textContent = message;
}
};
if (xhr && xhr.status === 413) {
setMessage(this.uploadLimitMessage);
@ -70,4 +70,5 @@ export class Dropzone extends Component {
removeAll() {
this.dz.removeAllFiles(true);
}
}
}

7
resources/js/components/editor-toolbox.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class EditorToolbox extends Component {
@ -35,11 +35,10 @@ export class EditorToolbox extends Component {
}
setActiveTab(tabName, openToolbox = false) {
// Set button visibility
for (const button of this.buttons) {
button.classList.remove('active');
const bName = button.dataset.tab;
const bName = button.dataset.tab;
if (bName === tabName) button.classList.add('active');
}
@ -55,4 +54,4 @@ export class EditorToolbox extends Component {
}
}
}
}

12
resources/js/components/entity-permissions.js
View File

@ -1,5 +1,5 @@
import {htmlToDom} from "../services/dom";
import {Component} from "./component";
import {htmlToDom} from '../services/dom';
import {Component} from './component';
export class EntityPermissions extends Component {
@ -29,7 +29,7 @@ export class EntityPermissions extends Component {
this.container.addEventListener('click', event => {
const button = event.target.closest('button');
if (button && button.dataset.roleId) {
this.removeRowOnButtonClick(button)
this.removeRowOnButtonClick(button);
}
});
@ -61,8 +61,8 @@ export class EntityPermissions extends Component {
removeRowOnButtonClick(button) {
const row = button.closest('.item-list-row');
const roleId = button.dataset.roleId;
const roleName = button.dataset.roleName;
const {roleId} = button.dataset;
const {roleName} = button.dataset;
const option = document.createElement('option');
option.value = roleId;
@ -72,4 +72,4 @@ export class EntityPermissions extends Component {
row.remove();
}
}
}

8
resources/js/components/entity-search.js
View File

@ -1,7 +1,8 @@
import {onSelect} from "../services/dom";
import {Component} from "./component";
import {onSelect} from '../services/dom';
import {Component} from './component';
export class EntitySearch extends Component {
setup() {
this.entityId = this.$opts.entityId;
this.entityType = this.$opts.entityType;
@ -51,4 +52,5 @@ export class EntitySearch extends Component {
this.loadingBlock.classList.add('hidden');
this.searchInput.value = '';
}
}
}

5
resources/js/components/entity-selector-popup.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class EntitySelectorPopup extends Component {
@ -57,4 +57,5 @@ export class EntitySelectorPopup extends Component {
this.getSelector().reset();
if (this.callback && entity) this.callback(entity);
}
}
}

18
resources/js/components/entity-selector.js
View File

@ -1,5 +1,5 @@
import {onChildEvent} from "../services/dom";
import {Component} from "./component";
import {onChildEvent} from '../services/dom';
import {Component} from './component';
/**
* Entity Selector
@ -65,13 +65,13 @@ export class EntitySelector extends Component {
if (e.code === 'ArrowDown') {
this.focusAdjacent(true);
}
})
});
}
focusAdjacent(forward = true) {
const items = Array.from(this.resultsContainer.querySelectorAll('[data-entity-type]'));
const selectedIndex = items.indexOf(document.activeElement);
const newItem = items[selectedIndex+ (forward ? 1 : -1)] || items[0];
const newItem = items[selectedIndex + (forward ? 1 : -1)] || items[0];
if (newItem) {
newItem.focus();
}
@ -101,7 +101,7 @@ export class EntitySelector extends Component {
window.$http.get(this.searchUrl()).then(resp => {
this.resultsContainer.innerHTML = resp.data;
this.hideLoading();
})
});
}
searchUrl() {
@ -144,13 +144,13 @@ export class EntitySelector extends Component {
const link = item.getAttribute('href');
const name = item.querySelector('.entity-list-item-name').textContent;
const data = {id: Number(id), name: name, link: link};
const data = {id: Number(id), name, link};
if (isSelected) {
item.classList.add('selected');
this.selectedItemData = data;
} else {
window.$events.emit('entity-select-change', null)
window.$events.emit('entity-select-change', null);
}
if (!isDblClick && !isSelected) return;
@ -159,7 +159,7 @@ export class EntitySelector extends Component {
this.confirmSelection(data);
}
if (isSelected) {
window.$events.emit('entity-select-change', data)
window.$events.emit('entity-select-change', data);
}
}
@ -175,4 +175,4 @@ export class EntitySelector extends Component {
this.selectedItemData = null;
}
}
}

10
resources/js/components/event-emit-select.js
View File

@ -1,5 +1,5 @@
import {onSelect} from "../services/dom";
import {Component} from "./component";
import {onSelect} from '../services/dom';
import {Component} from './component';
/**
* EventEmitSelect
@ -12,15 +12,15 @@ import {Component} from "./component";
* All options will be set as the "detail" of the event with
* their values included.
*/
export class EventEmitSelect extends Component{
export class EventEmitSelect extends Component {
setup() {
this.container = this.$el;
this.name = this.$opts.name;
onSelect(this.$el, () => {
this.$emit(this.name, this.$opts);
});
}
}
}

12
resources/js/components/expand-toggle.js
View File

@ -1,5 +1,5 @@
import {slideUp, slideDown} from "../services/animations";
import {Component} from "./component";
import {slideUp, slideDown} from '../services/animations';
import {Component} from './component';
export class ExpandToggle extends Component {
@ -24,8 +24,8 @@ export class ExpandToggle extends Component {
event.preventDefault();
const matchingElems = document.querySelectorAll(this.targetSelector);
for (let match of matchingElems) {
this.isOpen ? this.close(match) : this.open(match);
for (const match of matchingElems) {
this.isOpen ? this.close(match) : this.open(match);
}
this.isOpen = !this.isOpen;
@ -34,8 +34,8 @@ export class ExpandToggle extends Component {
updateSystemAjax(isOpen) {
window.$http.patch(this.updateEndpoint, {
expand: isOpen ? 'true' : 'false'
expand: isOpen ? 'true' : 'false',
});
}
}
}

19
resources/js/components/global-search.js
View File

@ -1,7 +1,7 @@
import {htmlToDom} from "../services/dom";
import {debounce} from "../services/util";
import {KeyboardNavigationHandler} from "../services/keyboard-navigation";
import {Component} from "./component";
import {htmlToDom} from '../services/dom';
import {debounce} from '../services/util';
import {KeyboardNavigationHandler} from '../services/keyboard-navigation';
import {Component} from './component';
/**
* Global (header) search box handling.
@ -25,12 +25,12 @@ export class GlobalSearch extends Component {
// Handle search input changes
this.input.addEventListener('input', () => {
const value = this.input.value;
const {value} = this.input;
if (value.length > 0) {
this.loadingWrap.style.display = 'block';
this.suggestionResultsWrap.style.opacity = '0.5';
updateSuggestionsDebounced(value);
} else {
} else {
this.hideSuggestions();
}
});
@ -55,7 +55,7 @@ export class GlobalSearch extends Component {
if (!this.input.value) {
return;
}
const resultDom = htmlToDom(results);
this.suggestionResultsWrap.innerHTML = '';
@ -71,7 +71,7 @@ export class GlobalSearch extends Component {
this.container.classList.add('search-active');
window.requestAnimationFrame(() => {
this.suggestions.classList.add('search-suggestions-animation');
})
});
}
hideSuggestions() {
@ -79,4 +79,5 @@ export class GlobalSearch extends Component {
this.suggestions.classList.remove('search-suggestions-animation');
this.suggestionResultsWrap.innerHTML = '';
}
}
}

8
resources/js/components/header-mobile-toggle.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class HeaderMobileToggle extends Component {
@ -19,10 +19,10 @@ export class HeaderMobileToggle extends Component {
this.toggleButton.setAttribute('aria-expanded', this.open ? 'true' : 'false');
if (this.open) {
this.elem.addEventListener('keydown', this.onKeyDown);
window.addEventListener('click', this.onWindowClick)
window.addEventListener('click', this.onWindowClick);
} else {
this.elem.removeEventListener('keydown', this.onKeyDown);
window.removeEventListener('click', this.onWindowClick)
window.removeEventListener('click', this.onWindowClick);
}
event.stopPropagation();
}
@ -37,4 +37,4 @@ export class HeaderMobileToggle extends Component {
this.onToggle(event);
}
}
}

8
resources/js/components/image-manager.js
View File

@ -1,5 +1,7 @@
import {onChildEvent, onSelect, removeLoading, showLoading} from "../services/dom";
import {Component} from "./component";
import {
onChildEvent, onSelect, removeLoading, showLoading,
} from '../services/dom';
import {Component} from './component';
export class ImageManager extends Component {
@ -210,4 +212,4 @@ export class ImageManager extends Component {
window.$components.init(this.formContainer);
}
}
}

6
resources/js/components/image-picker.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class ImagePicker extends Component {
@ -31,7 +31,7 @@ export class ImagePicker extends Component {
this.removeInput.setAttribute('disabled', 'disabled');
}
for (let file of this.imageInput.files) {
for (const file of this.imageInput.files) {
this.imageElem.src = window.URL.createObjectURL(file);
}
this.imageElem.classList.remove('none');
@ -54,4 +54,4 @@ export class ImagePicker extends Component {
this.resetInput.setAttribute('disabled', 'disabled');
}
}
}

118
resources/js/components/index.js
View File

@ -1,59 +1,59 @@
export {AddRemoveRows} from "./add-remove-rows.js"
export {AjaxDeleteRow} from "./ajax-delete-row.js"
export {AjaxForm} from "./ajax-form.js"
export {Attachments} from "./attachments.js"
export {AttachmentsList} from "./attachments-list.js"
export {AutoSuggest} from "./auto-suggest.js"
export {AutoSubmit} from "./auto-submit.js"
export {BackToTop} from "./back-to-top.js"
export {BookSort} from "./book-sort.js"
export {ChapterContents} from "./chapter-contents.js"
export {CodeEditor} from "./code-editor.js"
export {CodeHighlighter} from "./code-highlighter.js"
export {CodeTextarea} from "./code-textarea.js"
export {Collapsible} from "./collapsible.js"
export {ConfirmDialog} from "./confirm-dialog"
export {CustomCheckbox} from "./custom-checkbox.js"
export {DetailsHighlighter} from "./details-highlighter.js"
export {Dropdown} from "./dropdown.js"
export {DropdownSearch} from "./dropdown-search.js"
export {Dropzone} from "./dropzone.js"
export {EditorToolbox} from "./editor-toolbox.js"
export {EntityPermissions} from "./entity-permissions"
export {EntitySearch} from "./entity-search.js"
export {EntitySelector} from "./entity-selector.js"
export {EntitySelectorPopup} from "./entity-selector-popup.js"
export {EventEmitSelect} from "./event-emit-select.js"
export {ExpandToggle} from "./expand-toggle.js"
export {GlobalSearch} from "./global-search.js"
export {HeaderMobileToggle} from "./header-mobile-toggle.js"
export {ImageManager} from "./image-manager.js"
export {ImagePicker} from "./image-picker.js"
export {ListSortControl} from "./list-sort-control.js"
export {MarkdownEditor} from "./markdown-editor.js"
export {NewUserPassword} from "./new-user-password.js"
export {Notification} from "./notification.js"
export {OptionalInput} from "./optional-input.js"
export {PageComments} from "./page-comments.js"
export {PageDisplay} from "./page-display.js"
export {PageEditor} from "./page-editor.js"
export {PagePicker} from "./page-picker.js"
export {PermissionsTable} from "./permissions-table.js"
export {Pointer} from "./pointer.js"
export {Popup} from "./popup.js"
export {SettingAppColorScheme} from "./setting-app-color-scheme.js"
export {SettingColorPicker} from "./setting-color-picker.js"
export {SettingHomepageControl} from "./setting-homepage-control.js"
export {ShelfSort} from "./shelf-sort.js"
export {Shortcuts} from "./shortcuts"
export {ShortcutInput} from "./shortcut-input"
export {SortableList} from "./sortable-list.js"
export {SubmitOnChange} from "./submit-on-change.js"
export {Tabs} from "./tabs.js"
export {TagManager} from "./tag-manager.js"
export {TemplateManager} from "./template-manager.js"
export {ToggleSwitch} from "./toggle-switch.js"
export {TriLayout} from "./tri-layout.js"
export {UserSelect} from "./user-select.js"
export {WebhookEvents} from "./webhook-events"
export {WysiwygEditor} from "./wysiwyg-editor.js"
export {AddRemoveRows} from './add-remove-rows.js';
export {AjaxDeleteRow} from './ajax-delete-row.js';
export {AjaxForm} from './ajax-form.js';
export {Attachments} from './attachments.js';
export {AttachmentsList} from './attachments-list.js';
export {AutoSuggest} from './auto-suggest.js';
export {AutoSubmit} from './auto-submit.js';
export {BackToTop} from './back-to-top.js';
export {BookSort} from './book-sort.js';
export {ChapterContents} from './chapter-contents.js';
export {CodeEditor} from './code-editor.js';
export {CodeHighlighter} from './code-highlighter.js';
export {CodeTextarea} from './code-textarea.js';
export {Collapsible} from './collapsible.js';
export {ConfirmDialog} from './confirm-dialog';
export {CustomCheckbox} from './custom-checkbox.js';
export {DetailsHighlighter} from './details-highlighter.js';
export {Dropdown} from './dropdown.js';
export {DropdownSearch} from './dropdown-search.js';
export {Dropzone} from './dropzone.js';
export {EditorToolbox} from './editor-toolbox.js';
export {EntityPermissions} from './entity-permissions';
export {EntitySearch} from './entity-search.js';
export {EntitySelector} from './entity-selector.js';
export {EntitySelectorPopup} from './entity-selector-popup.js';
export {EventEmitSelect} from './event-emit-select.js';
export {ExpandToggle} from './expand-toggle.js';
export {GlobalSearch} from './global-search.js';
export {HeaderMobileToggle} from './header-mobile-toggle.js';
export {ImageManager} from './image-manager.js';
export {ImagePicker} from './image-picker.js';
export {ListSortControl} from './list-sort-control.js';
export {MarkdownEditor} from './markdown-editor.js';
export {NewUserPassword} from './new-user-password.js';
export {Notification} from './notification.js';
export {OptionalInput} from './optional-input.js';
export {PageComments} from './page-comments.js';
export {PageDisplay} from './page-display.js';
export {PageEditor} from './page-editor.js';
export {PagePicker} from './page-picker.js';
export {PermissionsTable} from './permissions-table.js';
export {Pointer} from './pointer.js';
export {Popup} from './popup.js';
export {SettingAppColorScheme} from './setting-app-color-scheme.js';
export {SettingColorPicker} from './setting-color-picker.js';
export {SettingHomepageControl} from './setting-homepage-control.js';
export {ShelfSort} from './shelf-sort.js';
export {Shortcuts} from './shortcuts';
export {ShortcutInput} from './shortcut-input';
export {SortableList} from './sortable-list.js';
export {SubmitOnChange} from './submit-on-change.js';
export {Tabs} from './tabs.js';
export {TagManager} from './tag-manager.js';
export {TemplateManager} from './template-manager.js';
export {ToggleSwitch} from './toggle-switch.js';
export {TriLayout} from './tri-layout.js';
export {UserSelect} from './user-select.js';
export {WebhookEvents} from './webhook-events';
export {WysiwygEditor} from './wysiwyg-editor.js';

4
resources/js/components/list-sort-control.js
View File

@ -2,7 +2,7 @@
* ListSortControl
* Manages the logic for the control which provides list sorting options.
*/
import {Component} from "./component";
import {Component} from './component';
export class ListSortControl extends Component {
@ -45,4 +45,4 @@ export class ListSortControl extends Component {
this.form.submit();
}
}
}

17
resources/js/components/markdown-editor.js
View File

@ -1,5 +1,5 @@
import {Component} from "./component";
import {init as initEditor} from "../markdown/editor";
import {Component} from './component';
import {init as initEditor} from '../markdown/editor';
export class MarkdownEditor extends Component {
@ -16,7 +16,7 @@ export class MarkdownEditor extends Component {
this.divider = this.$refs.divider;
this.displayWrap = this.$refs.displayWrap;
const settingContainer = this.$refs.settingContainer;
const {settingContainer} = this.$refs;
const settingInputs = settingContainer.querySelectorAll('input[type="checkbox"]');
this.editor = null;
@ -49,10 +49,9 @@ export class MarkdownEditor extends Component {
}
setupListeners() {
// Button actions
this.elem.addEventListener('click', event => {
let button = event.target.closest('button[data-action]');
const button = event.target.closest('button[data-action]');
if (button === null) return;
const action = button.getAttribute('data-action');
@ -85,13 +84,13 @@ export class MarkdownEditor extends Component {
handleDividerDrag() {
this.divider.addEventListener('pointerdown', event => {
const wrapRect = this.elem.getBoundingClientRect();
const moveListener = (event) => {
const moveListener = event => {
const xRel = event.pageX - wrapRect.left;
const xPct = Math.min(Math.max(20, Math.floor((xRel / wrapRect.width) * 100)), 80);
this.displayWrap.style.flexBasis = `${100-xPct}%`;
this.displayWrap.style.flexBasis = `${100 - xPct}%`;
this.editor.settings.set('editorWidth', xPct);
};
const upListener = (event) => {
const upListener = event => {
window.removeEventListener('pointermove', moveListener);
window.removeEventListener('pointerup', upListener);
this.display.style.pointerEvents = null;
@ -105,7 +104,7 @@ export class MarkdownEditor extends Component {
});
const widthSetting = this.editor.settings.get('editorWidth');
if (widthSetting) {
this.displayWrap.style.flexBasis = `${100-widthSetting}%`;
this.displayWrap.style.flexBasis = `${100 - widthSetting}%`;
}
}

4
resources/js/components/new-user-password.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class NewUserPassword extends Component {
@ -23,4 +23,4 @@ export class NewUserPassword extends Component {
this.inputContainer.style.display = inviting ? 'none' : 'block';
}
}
}

8
resources/js/components/notification.js
View File

@ -1,13 +1,13 @@
import {Component} from "./component";
import {Component} from './component';
export class Notification extends Component {
export class Notification extends Component {
setup() {
this.container = this.$el;
this.type = this.$opts.type;
this.textElem = this.container.querySelector('span');
this.autoHide = this.$opts.autoHide === 'true';
this.initialShow = this.$opts.show === 'true'
this.initialShow = this.$opts.show === 'true';
this.container.style.display = 'grid';
window.$events.listen(this.type, text => {
@ -47,4 +47,4 @@ export class Notification extends Component {
this.container.removeEventListener('transitionend', this.hideCleanup);
}
}
}

7
resources/js/components/optional-input.js
View File

@ -1,7 +1,8 @@
import {onSelect} from "../services/dom";
import {Component} from "./component";
import {onSelect} from '../services/dom';
import {Component} from './component';
export class OptionalInput extends Component {
setup() {
this.removeButton = this.$refs.remove;
this.showButton = this.$refs.show;
@ -24,4 +25,4 @@ export class OptionalInput extends Component {
});
}
}
}

48
resources/js/components/page-comments.js
View File

@ -1,6 +1,6 @@
import {scrollAndHighlightElement} from "../services/util";
import {Component} from "./component";
import {htmlToDom} from "../services/dom";
import {scrollAndHighlightElement} from '../services/util';
import {Component} from './component';
import {htmlToDom} from '../services/dom';
export class PageComments extends Component {
@ -36,11 +36,11 @@ export class PageComments extends Component {
}
handleAction(event) {
let actionElem = event.target.closest('[action]');
const actionElem = event.target.closest('[action]');
if (event.target.matches('a[href^="#"]')) {
const id = event.target.href.split('#')[1];
scrollAndHighlightElement(document.querySelector('#' + id));
scrollAndHighlightElement(document.querySelector(`#${id}`));
}
if (actionElem === null) return;
@ -68,24 +68,24 @@ export class PageComments extends Component {
if (this.editingComment) this.closeUpdateForm();
commentElem.querySelector('[comment-content]').style.display = 'none';
commentElem.querySelector('[comment-edit-container]').style.display = 'block';
let textArea = commentElem.querySelector('[comment-edit-container] textarea');
let lineCount = textArea.value.split('\n').length;
textArea.style.height = ((lineCount * 20) + 40) + 'px';
const textArea = commentElem.querySelector('[comment-edit-container] textarea');
const lineCount = textArea.value.split('\n').length;
textArea.style.height = `${(lineCount * 20) + 40}px`;
this.editingComment = commentElem;
}
updateComment(event) {
let form = event.target;
const form = event.target;
event.preventDefault();
let text = form.querySelector('textarea').value;
let reqData = {
text: text,
const text = form.querySelector('textarea').value;
const reqData = {
text,
parent_id: this.parentId || null,
};
this.showLoading(form);
let commentId = this.editingComment.getAttribute('comment');
const commentId = this.editingComment.getAttribute('comment');
window.$http.put(`/comment/${commentId}`, reqData).then(resp => {
let newComment = document.createElement('div');
const newComment = document.createElement('div');
newComment.innerHTML = resp.data;
this.editingComment.innerHTML = newComment.children[0].innerHTML;
window.$events.success(this.updatedText);
@ -98,7 +98,7 @@ export class PageComments extends Component {
}
deleteComment(commentElem) {
let id = commentElem.getAttribute('comment');
const id = commentElem.getAttribute('comment');
this.showLoading(commentElem.querySelector('[comment-content]'));
window.$http.delete(`/comment/${id}`).then(resp => {
commentElem.parentNode.removeChild(commentElem);
@ -111,9 +111,9 @@ export class PageComments extends Component {
saveComment(event) {
event.preventDefault();
event.stopPropagation();
let text = this.formInput.value;
let reqData = {
text: text,
const text = this.formInput.value;
const reqData = {
text,
parent_id: this.parentId || null,
};
this.showLoading(this.form);
@ -131,7 +131,7 @@ export class PageComments extends Component {
}
updateCount() {
let count = this.container.children.length;
const count = this.container.children.length;
this.elem.querySelector('[comments-title]').textContent = window.trans_plural(this.countText, count, {count});
}
@ -148,14 +148,14 @@ export class PageComments extends Component {
this.formContainer.parentNode.style.display = 'block';
this.addButtonContainer.style.display = 'none';
this.formInput.focus();
this.formInput.scrollIntoView({behavior: "smooth"});
this.formInput.scrollIntoView({behavior: 'smooth'});
}
hideForm() {
this.formContainer.style.display = 'none';
this.formContainer.parentNode.style.display = 'none';
if (this.getCommentCount() > 0) {
this.elem.appendChild(this.addButtonContainer)
this.elem.appendChild(this.addButtonContainer);
} else {
this.commentCountBar.appendChild(this.addButtonContainer);
}
@ -182,7 +182,7 @@ export class PageComments extends Component {
showLoading(formElem) {
const groups = formElem.querySelectorAll('.form-group');
for (let group of groups) {
for (const group of groups) {
group.style.display = 'none';
}
formElem.querySelector('.form-group.loading').style.display = 'block';
@ -190,10 +190,10 @@ export class PageComments extends Component {
hideLoading(formElem) {
const groups = formElem.querySelectorAll('.form-group');
for (let group of groups) {
for (const group of groups) {
group.style.display = 'block';
}
formElem.querySelector('.form-group.loading').style.display = 'none';
}
}
}

15
resources/js/components/page-display.js
View File

@ -1,6 +1,6 @@
import * as DOM from "../services/dom";
import {scrollAndHighlightElement} from "../services/util";
import {Component} from "./component";
import * as DOM from '../services/dom';
import {scrollAndHighlightElement} from '../services/util';
import {Component} from './component';
export class PageDisplay extends Component {
@ -26,7 +26,7 @@ export class PageDisplay extends Component {
window.$components.first('tri-layout').showContent();
const contentId = child.getAttribute('href').substr(1);
this.goToText(contentId);
window.history.pushState(null, null, '#' + contentId);
window.history.pushState(null, null, `#${contentId}`);
});
}
}
@ -63,7 +63,7 @@ export class PageDisplay extends Component {
// Setup the intersection observer.
const intersectOpts = {
rootMargin: '0px 0px 0px 0px',
threshold: 1.0
threshold: 1.0,
};
const pageNavObserver = new IntersectionObserver(headingVisibilityChange, intersectOpts);
@ -81,7 +81,7 @@ export class PageDisplay extends Component {
}
function toggleAnchorHighlighting(elementId, shouldHighlight) {
DOM.forEach('a[href="#' + elementId + '"]', anchor => {
DOM.forEach(`a[href="#${elementId}"]`, anchor => {
anchor.closest('li').classList.toggle('current-heading', shouldHighlight);
});
}
@ -96,4 +96,5 @@ export class PageDisplay extends Component {
const details = [...this.container.querySelectorAll('details')];
details.forEach(detail => detail.addEventListener('toggle', onToggle));
}
}
}

18
resources/js/components/page-editor.js
View File

@ -1,9 +1,10 @@
import * as Dates from "../services/dates";
import {onSelect} from "../services/dom";
import {debounce} from "../services/util";
import {Component} from "./component";
import * as Dates from '../services/dates';
import {onSelect} from '../services/dom';
import {debounce} from '../services/util';
import {Component} from './component';
export class PageEditor extends Component {
setup() {
// Options
this.draftsEnabled = this.$opts.draftsEnabled === 'true';
@ -93,12 +94,12 @@ export class PageEditor extends Component {
runAutoSave() {
// Stop if manually saved recently to prevent bombarding the server
const savedRecently = (Date.now() - this.autoSave.last < (this.autoSave.frequency)/2);
const savedRecently = (Date.now() - this.autoSave.last < (this.autoSave.frequency) / 2);
if (savedRecently || !this.autoSave.pendingChange) {
return;
}
this.saveDraft()
this.saveDraft();
}
savePage() {
@ -172,7 +173,6 @@ export class PageEditor extends Component {
this.startAutoSave();
}, 1000);
window.$events.emit('success', this.draftDiscardedText);
}
updateChangelogDisplay() {
@ -180,7 +180,7 @@ export class PageEditor extends Component {
if (summary.length === 0) {
summary = this.setChangelogText;
} else if (summary.length > 16) {
summary = summary.slice(0, 16) + '...';
summary = `${summary.slice(0, 16)}...`;
}
this.changelogDisplay.innerText = summary;
}
@ -193,7 +193,7 @@ export class PageEditor extends Component {
event.preventDefault();
const link = event.target.closest('a').href;
/** @var {ConfirmDialog} **/
/** @var {ConfirmDialog} * */
const dialog = window.$components.firstOnElement(this.switchDialogContainer, 'confirm-dialog');
const [saved, confirmed] = await Promise.all([this.saveDraft(), dialog.show()]);

8
resources/js/components/page-picker.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class PagePicker extends Component {
@ -24,7 +24,7 @@ export class PagePicker extends Component {
}
showPopup() {
/** @type {EntitySelectorPopup} **/
/** @type {EntitySelectorPopup} * */
const selectorPopup = window.$components.first('entity-selector-popup');
selectorPopup.show(entity => {
this.setValue(entity.id, entity.name);
@ -44,7 +44,7 @@ export class PagePicker extends Component {
toggleElem(this.defaultDisplay, !hasValue);
toggleElem(this.display, hasValue);
if (hasValue) {
let id = this.getAssetIdFromVal();
const id = this.getAssetIdFromVal();
this.display.textContent = `#${id}, ${name}`;
this.display.href = window.baseUrl(`/link/${id}`);
}
@ -58,4 +58,4 @@ export class PagePicker extends Component {
function toggleElem(elem, show) {
elem.style.display = show ? null : 'none';
}
}

8
resources/js/components/permissions-table.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class PermissionsTable extends Component {
@ -41,7 +41,7 @@ export class PermissionsTable extends Component {
const tableRows = this.container.querySelectorAll(this.rowSelector);
const inputsToToggle = [];
for (let row of tableRows) {
for (const row of tableRows) {
const targetCell = row.children[colIndex];
if (targetCell) {
inputsToToggle.push(...targetCell.querySelectorAll('input[type=checkbox]'));
@ -57,10 +57,10 @@ export class PermissionsTable extends Component {
toggleAllInputs(inputsToToggle) {
const currentState = inputsToToggle.length > 0 ? inputsToToggle[0].checked : false;
for (let checkbox of inputsToToggle) {
for (const checkbox of inputsToToggle) {
checkbox.checked = !currentState;
checkbox.dispatchEvent(new Event('change'));
}
}
}
}

14
resources/js/components/pointer.js
View File

@ -1,7 +1,6 @@
import * as DOM from "../services/dom";
import {Component} from "./component";
import {copyTextToClipboard} from "../services/clipboard";
import * as DOM from '../services/dom';
import {Component} from './component';
import {copyTextToClipboard} from '../services/clipboard';
export class Pointer extends Component {
@ -113,7 +112,7 @@ export class Pointer extends Component {
updateForTarget(element) {
let inputText = this.pointerModeLink ? window.baseUrl(`/link/${this.pageId}#${this.pointerSectionId}`) : `{{@${this.pageId}#${this.pointerSectionId}}}`;
if (this.pointerModeLink && !inputText.startsWith('http')) {
inputText = window.location.protocol + "//" + window.location.host + inputText;
inputText = `${window.location.protocol}//${window.location.host}${inputText}`;
}
this.input.value = inputText;
@ -121,7 +120,7 @@ export class Pointer extends Component {
// Update anchor if present
const editAnchor = this.container.querySelector('#pointer-edit');
if (editAnchor && element) {
const editHref = editAnchor.dataset.editHref;
const {editHref} = editAnchor.dataset;
const elementId = element.id;
// get the first 50 characters.
@ -129,4 +128,5 @@ export class Pointer extends Component {
editAnchor.href = `${editHref}?content-id=${elementId}&content-text=${encodeURIComponent(queryContent)}`;
}
}
}
}

10
resources/js/components/popup.js
View File

@ -1,6 +1,6 @@
import {fadeIn, fadeOut} from "../services/animations";
import {onSelect} from "../services/dom";
import {Component} from "./component";
import {fadeIn, fadeOut} from '../services/animations';
import {onSelect} from '../services/dom';
import {Component} from './component';
/**
* Popup window that will contain other content.
@ -47,7 +47,7 @@ export class Popup extends Component {
show(onComplete = null, onHide = null) {
fadeIn(this.container, 120, onComplete);
this.onkeyup = (event) => {
this.onkeyup = event => {
if (event.key === 'Escape') {
this.hide();
}
@ -56,4 +56,4 @@ export class Popup extends Component {
this.onHide = onHide;
}
}
}

12
resources/js/components/setting-app-color-scheme.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class SettingAppColorScheme extends Component {
@ -14,7 +14,7 @@ export class SettingAppColorScheme extends Component {
this.handleModeChange(newMode);
});
const onInputChange = (event) => {
const onInputChange = event => {
this.updateAppColorsFromInputs();
if (event.target.name.startsWith('setting-app-color')) {
@ -44,7 +44,7 @@ export class SettingAppColorScheme extends Component {
cssId = 'primary';
}
const varName = '--color-' + cssId;
const varName = `--color-${cssId}`;
document.body.style.setProperty(varName, input.value);
}
}
@ -57,9 +57,9 @@ export class SettingAppColorScheme extends Component {
const lightName = input.name.replace('-color', '-color-light');
const hexVal = input.value;
const rgb = this.hexToRgb(hexVal);
const rgbLightVal = 'rgba('+ [rgb.r, rgb.g, rgb.b, '0.15'].join(',') +')';
const rgbLightVal = `rgba(${[rgb.r, rgb.g, rgb.b, '0.15'].join(',')})`;
console.log(input.name, lightName, hexVal, rgbLightVal)
console.log(input.name, lightName, hexVal, rgbLightVal);
const lightColorInput = this.container.querySelector(`input[name="${lightName}"][type="hidden"]`);
lightColorInput.value = rgbLightVal;
}
@ -75,7 +75,7 @@ export class SettingAppColorScheme extends Component {
return {
r: result ? parseInt(result[1], 16) : 0,
g: result ? parseInt(result[2], 16) : 0,
b: result ? parseInt(result[3], 16) : 0
b: result ? parseInt(result[3], 16) : 0,
};
}

5
resources/js/components/setting-color-picker.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class SettingColorPicker extends Component {
@ -17,4 +17,5 @@ export class SettingColorPicker extends Component {
this.colorInput.value = value;
this.colorInput.dispatchEvent(new Event('change', {bubbles: true}));
}
}
}

5
resources/js/components/setting-homepage-control.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class SettingHomepageControl extends Component {
@ -14,4 +14,5 @@ export class SettingHomepageControl extends Component {
const showPagePicker = this.typeControl.value === 'page';
this.pagePickerContainer.style.display = (showPagePicker ? 'block' : 'none');
}
}
}

13
resources/js/components/shelf-sort.js
View File

@ -1,5 +1,5 @@
import Sortable from "sortablejs";
import {Component} from "./component";
import Sortable from 'sortablejs';
import {Component} from './component';
/**
* @type {Object<string, function(HTMLElement, HTMLElement, HTMLElement)>}
@ -66,7 +66,7 @@ export class ShelfSort extends Component {
this.filterBooksByName(this.bookSearchInput.value);
});
this.sortButtonContainer.addEventListener('click' , event => {
this.sortButtonContainer.addEventListener('click', event => {
const button = event.target.closest('button[data-sort]');
if (button) {
this.sortShelfBooks(button.dataset.sort);
@ -78,11 +78,10 @@ export class ShelfSort extends Component {
* @param {String} filterVal
*/
filterBooksByName(filterVal) {
// Set height on first search, if not already set, to prevent the distraction
// of the list height jumping around
if (!this.allBookList.style.height) {
this.allBookList.style.height = this.allBookList.getBoundingClientRect().height + 'px';
this.allBookList.style.height = `${this.allBookList.getBoundingClientRect().height}px`;
}
const books = this.allBookList.children;
@ -100,7 +99,7 @@ export class ShelfSort extends Component {
*/
sortItemActionClick(sortItemAction) {
const sortItem = sortItemAction.closest('.scroll-box-item');
const action = sortItemAction.dataset.action;
const {action} = sortItemAction.dataset;
const actionFunction = itemActions[action];
actionFunction(sortItem, this.shelfBookList, this.allBookList);
@ -136,4 +135,4 @@ export class ShelfSort extends Component {
this.onChange();
}
}
}

10
resources/js/components/shortcut-input.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
/**
* Keys to ignore when recording shortcuts.
@ -18,16 +18,16 @@ export class ShortcutInput extends Component {
this.listenerRecordKey = this.listenerRecordKey.bind(this);
this.input.addEventListener('focus', () => {
this.startListeningForInput();
this.startListeningForInput();
});
this.input.addEventListener('blur', () => {
this.stopListeningForInput();
})
});
}
startListeningForInput() {
this.input.addEventListener('keydown', this.listenerRecordKey)
this.input.addEventListener('keydown', this.listenerRecordKey);
}
/**
@ -51,4 +51,4 @@ export class ShortcutInput extends Component {
this.input.removeEventListener('keydown', this.listenerRecordKey);
}
}
}

18
resources/js/components/shortcuts.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
function reverseMap(map) {
const reversed = {};
@ -8,7 +8,6 @@ function reverseMap(map) {
return reversed;
}
export class Shortcuts extends Component {
setup() {
@ -25,7 +24,6 @@ export class Shortcuts extends Component {
setupListeners() {
window.addEventListener('keydown', event => {
if (event.target.closest('input, select, textarea')) {
return;
}
@ -44,7 +42,6 @@ export class Shortcuts extends Component {
* @param {KeyboardEvent} event
*/
handleShortcutPress(event) {
const keys = [
event.ctrlKey ? 'Ctrl' : '',
event.metaKey ? 'Cmd' : '',
@ -90,7 +87,7 @@ export class Shortcuts extends Component {
return true;
}
console.error(`Shortcut attempted to be ran for element type that does not have handling setup`, el);
console.error('Shortcut attempted to be ran for element type that does not have handling setup', el);
return false;
}
@ -135,10 +132,10 @@ export class Shortcuts extends Component {
const linkage = document.createElement('div');
linkage.classList.add('shortcut-linkage');
linkage.style.left = targetBounds.x + 'px';
linkage.style.top = targetBounds.y + 'px';
linkage.style.width = targetBounds.width + 'px';
linkage.style.height = targetBounds.height + 'px';
linkage.style.left = `${targetBounds.x}px`;
linkage.style.top = `${targetBounds.y}px`;
linkage.style.width = `${targetBounds.width}px`;
linkage.style.height = `${targetBounds.height}px`;
wrapper.append(label, linkage);
@ -159,4 +156,5 @@ export class Shortcuts extends Component {
this.hintsShowing = false;
}
}
}

8
resources/js/components/sortable-list.js
View File

@ -1,5 +1,5 @@
import Sortable from "sortablejs";
import {Component} from "./component";
import Sortable from 'sortablejs';
import {Component} from './component';
/**
* SortableList
@ -9,6 +9,7 @@ import {Component} from "./component";
* the data to set on the data-transfer.
*/
export class SortableList extends Component {
setup() {
this.container = this.$el;
this.handleSelector = this.$opts.handleSelector;
@ -33,4 +34,5 @@ export class SortableList extends Component {
dragoverBubble: false,
});
}
}
}

7
resources/js/components/submit-on-change.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
/**
* Submit on change
@ -9,8 +9,7 @@ export class SubmitOnChange extends Component {
setup() {
this.filter = this.$opts.filter;
this.$el.addEventListener('change', (event) => {
this.$el.addEventListener('change', event => {
if (this.filter && !event.target.matches(this.filter)) {
return;
}
@ -22,4 +21,4 @@ export class SubmitOnChange extends Component {
});
}
}
}

4
resources/js/components/tabs.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
/**
* Tabs
@ -46,4 +46,4 @@ export class Tabs extends Component {
this.$emit('change', {showing: sectionId});
}
}
}

13
resources/js/components/tag-manager.js
View File

@ -1,6 +1,7 @@
import {Component} from "./component";
import {Component} from './component';
export class TagManager extends Component {
setup() {
this.addRemoveComponentEl = this.$refs.addRemove;
this.container = this.$el;
@ -11,8 +12,7 @@ export class TagManager extends Component {
setupListeners() {
this.container.addEventListener('input', event => {
/** @var {AddRemoveRows} **/
/** @var {AddRemoveRows} * */
const addRemoveComponent = window.$components.firstOnElement(this.addRemoveComponentEl, 'add-remove-rows');
if (!this.hasEmptyRows() && event.target.value) {
addRemoveComponent.add();
@ -22,9 +22,8 @@ export class TagManager extends Component {
hasEmptyRows() {
const rows = this.container.querySelectorAll(this.rowSelector);
const firstEmpty = [...rows].find(row => {
return [...row.querySelectorAll('input')].filter(input => input.value).length === 0;
});
const firstEmpty = [...rows].find(row => [...row.querySelectorAll('input')].filter(input => input.value).length === 0);
return firstEmpty !== undefined;
}
}
}

13
resources/js/components/template-manager.js
View File

@ -1,5 +1,5 @@
import * as DOM from "../services/dom";
import {Component} from "./component";
import * as DOM from '../services/dom';
import {Component} from './component';
export class TemplateManager extends Component {
@ -66,7 +66,7 @@ export class TemplateManager extends Component {
async insertTemplate(templateId, action = 'replace') {
const resp = await window.$http.get(`/templates/${templateId}`);
const eventName = 'editor::' + action;
const eventName = `editor::${action}`;
window.$events.emit(eventName, resp.data);
}
@ -79,10 +79,11 @@ export class TemplateManager extends Component {
async performSearch() {
const searchTerm = this.searchInput.value;
const resp = await window.$http.get(`/templates`, {
search: searchTerm
const resp = await window.$http.get('/templates', {
search: searchTerm,
});
this.searchCancel.style.display = searchTerm ? 'block' : 'none';
this.list.innerHTML = resp.data;
}
}
}

4
resources/js/components/toggle-switch.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class ToggleSwitch extends Component {
@ -18,4 +18,4 @@ export class ToggleSwitch extends Component {
this.input.dispatchEvent(changeEvent);
}
}
}

17
resources/js/components/tri-layout.js
View File

@ -1,4 +1,4 @@
import {Component} from "./component";
import {Component} from './component';
export class TriLayout extends Component {
@ -9,8 +9,8 @@ export class TriLayout extends Component {
this.lastLayoutType = 'none';
this.onDestroy = null;
this.scrollCache = {
'content': 0,
'info': 0,
content: 0,
info: 0,
};
this.lastTabShown = 'content';
@ -26,8 +26,8 @@ export class TriLayout extends Component {
updateLayout() {
let newLayout = 'tablet';
if (window.innerWidth <= 1000) newLayout = 'mobile';
if (window.innerWidth >= 1400) newLayout = 'desktop';
if (window.innerWidth <= 1000) newLayout = 'mobile';
if (window.innerWidth >= 1400) newLayout = 'desktop';
if (newLayout === this.lastLayoutType) return;
if (this.onDestroy) {
@ -53,20 +53,19 @@ export class TriLayout extends Component {
for (const tab of this.tabs) {
tab.removeEventListener('click', this.mobileTabClick);
}
}
};
}
setupDesktop() {
//
}
/**
* Action to run when the mobile info toggle bar is clicked/tapped
* @param event
*/
mobileTabClick(event) {
const tab = event.target.dataset.tab;
const {tab} = event.target.dataset;
this.showTab(tab);
}
@ -109,4 +108,4 @@ export class TriLayout extends Component {
this.lastTabShown = tabName;
}
}
}

8
resources/js/components/user-select.js
View File

@ -1,5 +1,5 @@
import {onChildEvent} from "../services/dom";
import {Component} from "./component";
import {onChildEvent} from '../services/dom';
import {Component} from './component';
export class UserSelect extends Component {
@ -20,9 +20,9 @@ export class UserSelect extends Component {
}
hide() {
/** @var {Dropdown} **/
/** @var {Dropdown} * */
const dropdown = window.$components.firstOnElement(this.container, 'dropdown');
dropdown.hide();
}
}
}

4
resources/js/components/webhook-events.js
View File

@ -2,7 +2,7 @@
* Webhook Events
* Manages dynamic selection control in the webhook form interface.
*/
import {Component} from "./component";
import {Component} from './component';
export class WebhookEvents extends Component {
@ -27,4 +27,4 @@ export class WebhookEvents extends Component {
}
}
}
}

8
resources/js/components/wysiwyg-editor.js
View File

@ -1,5 +1,5 @@
import {build as buildEditorConfig} from "../wysiwyg/config";
import {Component} from "./component";
import {build as buildEditorConfig} from '../wysiwyg/config';
import {Component} from './component';
export class WysiwygEditor extends Component {
@ -45,8 +45,8 @@ export class WysiwygEditor extends Component {
*/
getContent() {
return {
html: this.editor.getContent()
html: this.editor.getContent(),
};
}
}
}

56
resources/js/markdown/actions.js
View File

@ -1,6 +1,7 @@
import DrawIO from "../services/drawio";
import DrawIO from '../services/drawio';
export class Actions {
/**
* @param {MarkdownEditor} editor
*/
@ -29,13 +30,13 @@ export class Actions {
}
showImageInsert() {
/** @type {ImageManager} **/
/** @type {ImageManager} * */
const imageManager = window.$components.first('image-manager');
imageManager.show(image => {
const imageUrl = image.thumbs.display || image.url;
const selectedText = this.#getSelectionText();
const newText = "[![" + (selectedText || image.name) + "](" + imageUrl + ")](" + image.url + ")";
const newText = `[![${selectedText || image.name}](${imageUrl})](${image.url})`;
this.#replaceSelection(newText, newText.length);
}, 'gallery');
}
@ -49,12 +50,12 @@ export class Actions {
const selectedText = this.#getSelectionText();
const newText = `[${selectedText}]()`;
const cursorPosDiff = (selectedText === '') ? -3 : -1;
this.#replaceSelection(newText, newText.length+cursorPosDiff);
this.#replaceSelection(newText, newText.length + cursorPosDiff);
}
showImageManager() {
const selectionRange = this.#getSelectionRange();
/** @type {ImageManager} **/
/** @type {ImageManager} * */
const imageManager = window.$components.first('image-manager');
imageManager.show(image => {
this.#insertDrawing(image, selectionRange);
@ -65,7 +66,7 @@ export class Actions {
showLinkSelector() {
const selectionRange = this.#getSelectionRange();
/** @type {EntitySelectorPopup} **/
/** @type {EntitySelectorPopup} * */
const selector = window.$components.first('entity-selector-popup');
selector.show(entity => {
const selectedText = this.#getSelectionText(selectionRange) || entity.name;
@ -81,16 +82,13 @@ export class Actions {
const selectionRange = this.#getSelectionRange();
DrawIO.show(url,() => {
return Promise.resolve('');
}, (pngData) => {
DrawIO.show(url, () => Promise.resolve(''), pngData => {
const data = {
image: pngData,
uploaded_to: Number(this.editor.config.pageId),
};
window.$http.post("/images/drawio", data).then(resp => {
window.$http.post('/images/drawio', data).then(resp => {
this.#insertDrawing(resp.data, selectionRange);
DrawIO.close();
}).catch(err => {
@ -106,7 +104,7 @@ export class Actions {
// Show draw.io if enabled and handle save.
editDrawing(imgContainer) {
const drawioUrl = this.editor.config.drawioUrl;
const {drawioUrl} = this.editor.config;
if (!drawioUrl) {
return;
}
@ -114,16 +112,13 @@ export class Actions {
const selectionRange = this.#getSelectionRange();
const drawingId = imgContainer.getAttribute('drawio-diagram');
DrawIO.show(drawioUrl, () => {
return DrawIO.load(drawingId);
}, (pngData) => {
DrawIO.show(drawioUrl, () => DrawIO.load(drawingId), pngData => {
const data = {
image: pngData,
uploaded_to: Number(this.editor.config.pageId),
};
window.$http.post("/images/drawio", data).then(resp => {
window.$http.post('/images/drawio', data).then(resp => {
const newText = `<div drawio-diagram="${resp.data.id}"><img src="${resp.data.url}"></div>`;
const newContent = this.#getText().split('\n').map(line => {
if (line.indexOf(`drawio-diagram="${drawingId}"`) !== -1) {
@ -150,7 +145,7 @@ export class Actions {
// Make the editor full screen
fullScreen() {
const container = this.editor.config.container;
const {container} = this.editor.config;
const alreadyFullscreen = container.classList.contains('fullscreen');
container.classList.toggle('fullscreen', !alreadyFullscreen);
document.body.classList.toggle('markdown-fullscreen', !alreadyFullscreen);
@ -204,7 +199,7 @@ export class Actions {
content = this.#cleanTextForEditor(content);
const selectionRange = this.#getSelectionRange();
const selectFrom = selectionRange.from + content.length + 1;
this.#dispatchChange(0, 0, content + '\n', selectFrom);
this.#dispatchChange(0, 0, `${content}\n`, selectFrom);
this.focus();
}
@ -214,7 +209,7 @@ export class Actions {
*/
appendContent(content) {
content = this.#cleanTextForEditor(content);
this.#dispatchChange(this.editor.cm.state.doc.length, '\n' + content);
this.#dispatchChange(this.editor.cm.state.doc.length, `\n${content}`);
this.focus();
}
@ -223,7 +218,7 @@ export class Actions {
* @param {String} content
*/
replaceContent(content) {
this.#setText(content)
this.#setText(content);
}
/**
@ -250,7 +245,7 @@ export class Actions {
if (alreadySymbol) {
newLineContent = lineContent.replace(lineStart, newStart).trim();
} else if (newStart !== '') {
newLineContent = newStart + ' ' + lineContent;
newLineContent = `${newStart} ${lineContent}`;
}
const selectFrom = selectionRange.from + (newLineContent.length - lineContent.length);
@ -290,7 +285,7 @@ export class Actions {
const number = (Number(listMatch[2]) || 0) + 1;
const whiteSpace = listMatch[1] || '';
const listMark = listMatch[3] || '.'
const listMark = listMatch[3] || '.';
const prefix = `${whiteSpace}${number}${listMark}`;
return this.replaceLineStart(prefix);
@ -373,7 +368,7 @@ export class Actions {
* @param {File} file
* @param {?Number} position
*/
async uploadImage(file, position= null) {
async uploadImage(file, position = null) {
if (file === null || file.type.indexOf('image') !== 0) return;
let ext = 'png';
@ -382,17 +377,17 @@ export class Actions {
}
if (file.name) {
let fileNameMatches = file.name.match(/\.(.+)$/);
const fileNameMatches = file.name.match(/\.(.+)$/);
if (fileNameMatches.length > 1) ext = fileNameMatches[1];
}
// Insert image into markdown
const id = "image-" + Math.random().toString(16).slice(2);
const id = `image-${Math.random().toString(16).slice(2)}`;
const placeholderImage = window.baseUrl(`/loading.gif#upload${id}`);
const placeHolderText = `![](${placeholderImage})`;
this.#dispatchChange(position, position, placeHolderText, position);
const remoteFilename = "image-" + Date.now() + "." + ext;
const remoteFilename = `image-${Date.now()}.${ext}`;
const formData = new FormData();
formData.append('file', file, remoteFilename);
formData.append('uploaded_to', this.editor.config.pageId);
@ -466,7 +461,7 @@ export class Actions {
* @return {String}
*/
#cleanTextForEditor(text) {
return text.replace(/\r\n|\r/g, "\n");
return text.replace(/\r\n|\r/g, '\n');
}
/**
@ -511,7 +506,7 @@ export class Actions {
* @param {?Number} selectTo
*/
#dispatchChange(from, to = null, text = null, selectFrom = null, selectTo = null) {
const tr = {changes: {from, to: to, insert: text}};
const tr = {changes: {from, to, insert: text}};
if (selectFrom) {
tr.selection = {anchor: selectFrom};
@ -533,4 +528,5 @@ export class Actions {
scrollIntoView,
});
}
}
}

18
resources/js/markdown/codemirror.js
View File

@ -1,6 +1,6 @@
import {provideKeyBindings} from "./shortcuts";
import {debounce} from "../services/util";
import Clipboard from "../services/clipboard";
import {provideKeyBindings} from './shortcuts';
import {debounce} from '../services/util';
import Clipboard from '../services/clipboard';
/**
* Initiate the codemirror instance for the markdown editor.
@ -25,9 +25,9 @@ export async function init(editor) {
const domEventHandlers = {
// Handle scroll to sync display view
scroll: (event) => syncActive && onScrollDebounced(event),
scroll: event => syncActive && onScrollDebounced(event),
// Handle image & content drag n drop
drop: (event) => {
drop: event => {
const templateId = event.dataTransfer.getData('bookstack/template');
if (templateId) {
event.preventDefault();
@ -43,7 +43,7 @@ export async function init(editor) {
}
},
// Handle image paste
paste: (event) => {
paste: event => {
const clipboard = new Clipboard(event.clipboardData || event.dataTransfer);
// Don't handle the event ourselves if no items exist of contains table-looking data
@ -55,8 +55,8 @@ export async function init(editor) {
for (const image of images) {
editor.actions.uploadImage(image);
}
}
}
},
};
const cm = Code.markdownEditor(
editor.config.inputEl,
@ -70,4 +70,4 @@ export async function init(editor) {
window.mdEditorView = cm;
return cm;
}
}

11
resources/js/markdown/common-events.js
View File

@ -6,23 +6,22 @@ function getContentToInsert({html, markdown}) {
* @param {MarkdownEditor} editor
*/
export function listen(editor) {
window.$events.listen('editor::replace', (eventContent) => {
window.$events.listen('editor::replace', eventContent => {
const markdown = getContentToInsert(eventContent);
editor.actions.replaceContent(markdown);
});
window.$events.listen('editor::append', (eventContent) => {
window.$events.listen('editor::append', eventContent => {
const markdown = getContentToInsert(eventContent);
editor.actions.appendContent(markdown);
});
window.$events.listen('editor::prepend', (eventContent) => {
window.$events.listen('editor::prepend', eventContent => {
const markdown = getContentToInsert(eventContent);
editor.actions.prependContent(markdown);
});
window.$events.listen('editor::insert', (eventContent) => {
window.$events.listen('editor::insert', eventContent => {
const markdown = getContentToInsert(eventContent);
editor.actions.insertContent(markdown);
});
@ -30,4 +29,4 @@ export function listen(editor) {
window.$events.listen('editor::focus', () => {
editor.actions.focus();
});
}
}

10
resources/js/markdown/display.js
View File

@ -1,4 +1,4 @@
import {patchDomFromHtmlString} from "../services/vdom";
import {patchDomFromHtmlString} from '../services/vdom';
export class Display {
@ -81,7 +81,7 @@ export class Display {
* @param {String} html
*/
patchWithHtml(html) {
const body = this.doc.body;
const {body} = this.doc;
if (body.children.length === 0) {
const wrap = document.createElement('div');
@ -102,8 +102,8 @@ export class Display {
const elems = this.doc.body?.children[0]?.children;
if (elems && elems.length <= index) return;
const topElem = (index === -1) ? elems[elems.length-1] : elems[index];
topElem.scrollIntoView({ block: 'start', inline: 'nearest', behavior: 'smooth'});
const topElem = (index === -1) ? elems[elems.length - 1] : elems[index];
topElem.scrollIntoView({block: 'start', inline: 'nearest', behavior: 'smooth'});
}
}
}

17
resources/js/markdown/editor.js
View File

@ -1,10 +1,9 @@
import {Markdown} from "./markdown";
import {Display} from "./display";
import {Actions} from "./actions";
import {Settings} from "./settings";
import {listen} from "./common-events";
import {init as initCodemirror} from "./codemirror";
import {Markdown} from './markdown';
import {Display} from './display';
import {Actions} from './actions';
import {Settings} from './settings';
import {listen} from './common-events';
import {init as initCodemirror} from './codemirror';
/**
* Initiate a new markdown editor instance.
@ -12,7 +11,6 @@ import {init as initCodemirror} from "./codemirror";
* @returns {Promise<MarkdownEditor>}
*/
export async function init(config) {
/**
* @type {MarkdownEditor}
*/
@ -31,7 +29,6 @@ export async function init(config) {
return editor;
}
/**
* @typedef MarkdownEditorConfig
* @property {String} pageId
@ -51,4 +48,4 @@ export async function init(config) {
* @property {Actions} actions
* @property {EditorView} cm
* @property {Settings} settings
*/
*/

6
resources/js/markdown/markdown.js
View File

@ -1,4 +1,4 @@
import MarkdownIt from "markdown-it";
import MarkdownIt from 'markdown-it';
import mdTasksLists from 'markdown-it-task-lists';
export class Markdown {
@ -24,7 +24,5 @@ export class Markdown {
render(markdown) {
return this.renderer.render(markdown);
}
}

3
resources/js/markdown/settings.js
View File

@ -59,4 +59,5 @@ export class Settings {
listeners.push(callback);
this.changeListeners[key] = listeners;
}
}
}

16
resources/js/markdown/shortcuts.js
View File

@ -34,8 +34,8 @@ function provide(editor) {
shortcuts['Mod-8'] = cm => editor.actions.wrapSelection('`', '`');
shortcuts['Shift-Mod-e'] = cm => editor.actions.wrapSelection('`', '`');
shortcuts['Mod-9'] = cm => editor.actions.cycleCalloutTypeAtSelection();
shortcuts['Mod-p'] = cm => editor.actions.replaceLineStart('-')
shortcuts['Mod-o'] = cm => editor.actions.replaceLineStartForOrderedList()
shortcuts['Mod-p'] = cm => editor.actions.replaceLineStart('-');
shortcuts['Mod-o'] = cm => editor.actions.replaceLineStartForOrderedList();
return shortcuts;
}
@ -46,14 +46,12 @@ function provide(editor) {
* @return {{key: String, run: function, preventDefault: boolean}[]}
*/
export function provideKeyBindings(editor) {
const shortcuts= provide(editor);
const shortcuts = provide(editor);
const keyBindings = [];
const wrapAction = (action) => {
return () => {
action();
return true;
};
const wrapAction = action => () => {
action();
return true;
};
for (const [shortcut, action] of Object.entries(shortcuts)) {
@ -61,4 +59,4 @@ export function provideKeyBindings(editor) {
}
return keyBindings;
}
}

12
resources/js/services/animations.js
View File

@ -15,7 +15,7 @@ export function fadeIn(element, animTime = 400, onComplete = null) {
cleanupExistingElementAnimation(element);
element.style.display = 'block';
animateStyles(element, {
opacity: ['0', '1']
opacity: ['0', '1'],
}, animTime, () => {
if (onComplete) onComplete();
});
@ -30,7 +30,7 @@ export function fadeIn(element, animTime = 400, onComplete = null) {
export function fadeOut(element, animTime = 400, onComplete = null) {
cleanupExistingElementAnimation(element);
animateStyles(element, {
opacity: ['1', '0']
opacity: ['1', '0'],
}, animTime, () => {
element.style.display = 'none';
if (onComplete) onComplete();
@ -125,12 +125,12 @@ export function transitionHeight(element, animTime = 400) {
*/
function animateStyles(element, styles, animTime = 400, onComplete = null) {
const styleNames = Object.keys(styles);
for (let style of styleNames) {
for (const style of styleNames) {
element.style[style] = styles[style][0];
}
const cleanup = () => {
for (let style of styleNames) {
for (const style of styleNames) {
element.style[style] = null;
}
element.style.transition = null;
@ -141,7 +141,7 @@ function animateStyles(element, styles, animTime = 400, onComplete = null) {
setTimeout(() => {
element.style.transition = `all ease-in-out ${animTime}ms`;
for (let style of styleNames) {
for (const style of styleNames) {
element.style[style] = styles[style][1];
}
@ -159,4 +159,4 @@ function cleanupExistingElementAnimation(element) {
const oldCleanup = animateStylesCleanupMap.get(element);
oldCleanup();
}
}
}

16
resources/js/services/clipboard.js
View File

@ -1,4 +1,3 @@
export class Clipboard {
/**
@ -21,7 +20,7 @@ export class Clipboard {
* @return {boolean}
*/
containsTabularData() {
const rtfData = this.data.getData( 'text/rtf');
const rtfData = this.data.getData('text/rtf');
return rtfData && rtfData.includes('\\trowd');
}
@ -30,8 +29,8 @@ export class Clipboard {
* @return {Array<File>}
*/
getImages() {
const types = this.data.types;
const files = this.data.files;
const {types} = this.data;
const {files} = this.data;
const images = [];
for (const type of types) {
@ -49,6 +48,7 @@ export class Clipboard {
return images;
}
}
export async function copyTextToClipboard(text) {
@ -58,13 +58,13 @@ export async function copyTextToClipboard(text) {
}
// Backup option where we can't use the navigator.clipboard API
const tempInput = document.createElement("textarea");
tempInput.style = "position: absolute; left: -1000px; top: -1000px;";
const tempInput = document.createElement('textarea');
tempInput.style = 'position: absolute; left: -1000px; top: -1000px;';
tempInput.value = text;
document.body.appendChild(tempInput);
tempInput.select();
document.execCommand("copy");
document.execCommand('copy');
document.body.removeChild(tempInput);
}
export default Clipboard;
export default Clipboard;

14
resources/js/services/components.js
View File

@ -1,4 +1,4 @@
import {kebabToCamel, camelToKebab} from "./text";
import {kebabToCamel, camelToKebab} from './text';
/**
* A mapping of active components keyed by name, with values being arrays of component
@ -25,12 +25,12 @@ const elementComponentMap = new WeakMap();
* @param {Element} element
*/
function initComponent(name, element) {
/** @type {Function<Component>|undefined} **/
/** @type {Function<Component>|undefined} * */
const componentModel = componentModelMap[name];
if (componentModel === undefined) return;
// Create our component instance
/** @type {Component} **/
/** @type {Component} * */
let instance;
try {
instance = new componentModel();
@ -46,7 +46,7 @@ function initComponent(name, element) {
}
// Add to global listing
if (typeof components[name] === "undefined") {
if (typeof components[name] === 'undefined') {
components[name] = [];
}
components[name].push(instance);
@ -67,7 +67,7 @@ function parseRefs(name, element) {
const refs = {};
const manyRefs = {};
const prefix = `${name}@`
const prefix = `${name}@`;
const selector = `[refs*="${prefix}"]`;
const refElems = [...element.querySelectorAll(selector)];
if (element.matches(selector)) {
@ -114,7 +114,7 @@ function parseOpts(name, element) {
* @param {Element|Document} parentElement
*/
export function init(parentElement = document) {
const componentElems = parentElement.querySelectorAll(`[component],[components]`);
const componentElems = parentElement.querySelectorAll('[component],[components]');
for (const el of componentElems) {
const componentNames = `${el.getAttribute('component') || ''} ${(el.getAttribute('components'))}`.toLowerCase().split(' ').filter(Boolean);
@ -162,4 +162,4 @@ export function get(name) {
export function firstOnElement(element, name) {
const elComponents = elementComponentMap.get(element) || {};
return elComponents[name] || null;
}
}

29
resources/js/services/dates.js
View File

@ -1,24 +1,23 @@
export function getCurrentDay() {
let date = new Date();
let month = date.getMonth() + 1;
let day = date.getDate();
const date = new Date();
const month = date.getMonth() + 1;
const day = date.getDate();
return `${date.getFullYear()}-${(month>9?'':'0') + month}-${(day>9?'':'0') + day}`;
return `${date.getFullYear()}-${(month > 9 ? '' : '0') + month}-${(day > 9 ? '' : '0') + day}`;
}
export function utcTimeStampToLocalTime(timestamp) {
let date = new Date(timestamp * 1000);
let hours = date.getHours();
let mins = date.getMinutes();
return `${(hours>9?'':'0') + hours}:${(mins>9?'':'0') + mins}`;
const date = new Date(timestamp * 1000);
const hours = date.getHours();
const mins = date.getMinutes();
return `${(hours > 9 ? '' : '0') + hours}:${(mins > 9 ? '' : '0') + mins}`;
}
export function formatDateTime(date) {
let month = date.getMonth() + 1;
let day = date.getDate();
let hours = date.getHours();
let mins = date.getMinutes();
const month = date.getMonth() + 1;
const day = date.getDate();
const hours = date.getHours();
const mins = date.getMinutes();
return `${date.getFullYear()}-${(month>9?'':'0') + month}-${(day>9?'':'0') + day} ${(hours>9?'':'0') + hours}:${(mins>9?'':'0') + mins}`;
}
return `${date.getFullYear()}-${(month > 9 ? '' : '0') + month}-${(day > 9 ? '' : '0') + day} ${(hours > 9 ? '' : '0') + hours}:${(mins > 9 ? '' : '0') + mins}`;
}

16
resources/js/services/dom.js
View File

@ -5,7 +5,7 @@
*/
export function forEach(selector, callback) {
const elements = document.querySelectorAll(selector);
for (let element of elements) {
for (const element of elements) {
callback(element);
}
}
@ -17,7 +17,7 @@ export function forEach(selector, callback) {
* @param {Function<Event>} callback
*/
export function onEvents(listenerElement, events, callback) {
for (let eventName of events) {
for (const eventName of events) {
listenerElement.addEventListener(eventName, callback);
}
}
@ -35,7 +35,7 @@ export function onSelect(elements, callback) {
for (const listenerElement of elements) {
listenerElement.addEventListener('click', callback);
listenerElement.addEventListener('keydown', (event) => {
listenerElement.addEventListener('keydown', event => {
if (event.key === 'Enter' || event.key === ' ') {
event.preventDefault();
callback(event);
@ -58,7 +58,7 @@ export function onEnterPress(elements, callback) {
if (event.key === 'Enter') {
callback(event);
}
}
};
elements.forEach(e => e.addEventListener('keypress', listener));
}
@ -73,7 +73,7 @@ export function onEnterPress(elements, callback) {
* @param {Function} callback
*/
export function onChildEvent(listenerElement, childSelector, eventName, callback) {
listenerElement.addEventListener(eventName, function(event) {
listenerElement.addEventListener(eventName, event => {
const matchingChild = event.target.closest(childSelector);
if (matchingChild) {
callback.call(matchingChild, event, matchingChild);
@ -91,7 +91,7 @@ export function onChildEvent(listenerElement, childSelector, eventName, callback
export function findText(selector, text) {
const elements = document.querySelectorAll(selector);
text = text.toLowerCase();
for (let element of elements) {
for (const element of elements) {
if (element.textContent.toLowerCase().includes(text)) {
return element;
}
@ -105,7 +105,7 @@ export function findText(selector, text) {
* @param {Element} element
*/
export function showLoading(element) {
element.innerHTML = `<div class="loading-container"><div></div><div></div><div></div></div>`;
element.innerHTML = '<div class="loading-container"><div></div><div></div><div></div></div>';
}
/**
@ -130,4 +130,4 @@ export function htmlToDom(html) {
wrap.innerHTML = html;
window.$components.init(wrap);
return wrap.children[0];
}
}

17
resources/js/services/drawio.js
View File

@ -1,6 +1,7 @@
let iFrame = null;
let lastApprovedOrigin;
let onInit, onSave;
let onInit; let
onSave;
/**
* Show the draw.io editor.
@ -55,13 +56,15 @@ function drawEventExport(message) {
}
function drawEventSave(message) {
drawPostMessage({action: 'export', format: 'xmlpng', xml: message.xml, spin: 'Updating drawing'});
drawPostMessage({
action: 'export', format: 'xmlpng', xml: message.xml, spin: 'Updating drawing',
});
}
function drawEventInit() {
if (!onInit) return;
onInit().then(xml => {
drawPostMessage({action: 'load', autosave: 1, xml: xml});
drawPostMessage({action: 'load', autosave: 1, xml});
});
}
@ -81,11 +84,11 @@ function drawPostMessage(data) {
}
async function upload(imageData, pageUploadedToId) {
let data = {
const data = {
image: imageData,
uploaded_to: pageUploadedToId,
};
const resp = await window.$http.post(window.baseUrl(`/images/drawio`), data);
const resp = await window.$http.post(window.baseUrl('/images/drawio'), data);
return resp.data;
}
@ -107,4 +110,6 @@ async function load(drawingId) {
}
}
export default {show, close, upload, load};
export default {
show, close, upload, load,
};

12
resources/js/services/events.js
View File

@ -9,9 +9,9 @@ const stack = [];
function emit(eventName, eventData) {
stack.push({name: eventName, data: eventData});
if (typeof listeners[eventName] === 'undefined') return this;
let eventsToStart = listeners[eventName];
const eventsToStart = listeners[eventName];
for (let i = 0; i < eventsToStart.length; i++) {
let event = eventsToStart[i];
const event = eventsToStart[i];
event(eventData);
}
}
@ -37,7 +37,7 @@ function listen(eventName, callback) {
function emitPublic(targetElement, eventName, eventData) {
const event = new CustomEvent(eventName, {
detail: eventData,
bubbles: true
bubbles: true,
});
targetElement.dispatchEvent(event);
}
@ -69,8 +69,8 @@ export default {
emit,
emitPublic,
listen,
success: (msg) => emit('success', msg),
error: (msg) => emit('error', msg),
success: msg => emit('success', msg),
error: msg => emit('error', msg),
showValidationErrors,
showResponseError,
}
};

32
resources/js/services/http.js
View File

@ -1,4 +1,3 @@
/**
* Perform a HTTP GET request.
* Can easily pass query parameters as the second parameter.
@ -63,7 +62,7 @@ async function performDelete(url, data = null) {
*/
async function dataRequest(method, url, data = null) {
const options = {
method: method,
method,
body: data,
};
@ -84,7 +83,7 @@ async function dataRequest(method, url, data = null) {
options.method = 'post';
}
return request(url, options)
return request(url, options);
}
/**
@ -101,7 +100,7 @@ async function request(url, options = {}) {
if (options.params) {
const urlObj = new URL(url);
for (let paramName of Object.keys(options.params)) {
for (const paramName of Object.keys(options.params)) {
const value = options.params[paramName];
if (typeof value !== 'undefined' && value !== null) {
urlObj.searchParams.set(paramName, value);
@ -111,13 +110,12 @@ async function request(url, options = {}) {
}
const csrfToken = document.querySelector('meta[name=token]').getAttribute('content');
options = Object.assign({}, options, {
'credentials': 'same-origin',
});
options.headers = Object.assign({}, options.headers || {}, {
'baseURL': window.baseUrl(''),
options = {...options, credentials: 'same-origin'};
options.headers = {
...options.headers || {},
baseURL: window.baseUrl(''),
'X-CSRF-TOKEN': csrfToken,
});
};
const response = await fetch(url, options);
const content = await getResponseContent(response);
@ -160,6 +158,7 @@ async function getResponseContent(response) {
}
class HttpError extends Error {
constructor(response, content) {
super(response.statusText);
this.data = content;
@ -170,13 +169,14 @@ class HttpError extends Error {
this.url = response.url;
this.original = response;
}
}
export default {
get: get,
post: post,
put: put,
patch: patch,
get,
post,
put,
patch,
delete: performDelete,
HttpError: HttpError,
};
HttpError,
};

8
resources/js/services/keyboard-navigation.js
View File

@ -57,7 +57,6 @@ export class KeyboardNavigationHandler {
* @param {KeyboardEvent} event
*/
#keydownHandler(event) {
// Ignore certain key events in inputs to allow text editing.
if (event.target.matches('input') && (event.key === 'ArrowRight' || event.key === 'ArrowLeft')) {
return;
@ -72,7 +71,7 @@ export class KeyboardNavigationHandler {
} else if (event.key === 'Escape') {
if (this.onEscape) {
this.onEscape(event);
} else if (document.activeElement) {
} else if (document.activeElement) {
document.activeElement.blur();
}
} else if (event.key === 'Enter' && this.onEnter) {
@ -88,8 +87,9 @@ export class KeyboardNavigationHandler {
const focusable = [];
const selector = '[tabindex]:not([tabindex="-1"]),[href],button:not([tabindex="-1"],[disabled]),input:not([type=hidden])';
for (const container of this.containers) {
focusable.push(...container.querySelectorAll(selector))
focusable.push(...container.querySelectorAll(selector));
}
return focusable;
}
}
}

6
resources/js/services/text.js
View File

@ -4,7 +4,7 @@
* @returns {string}
*/
export function kebabToCamel(kebab) {
const ucFirst = (word) => word.slice(0,1).toUpperCase() + word.slice(1);
const ucFirst = word => word.slice(0, 1).toUpperCase() + word.slice(1);
const words = kebab.split('-');
return words[0] + words.slice(1).map(ucFirst).join('');
}
@ -15,5 +15,5 @@ export function kebabToCamel(kebab) {
* @returns {String}
*/
export function camelToKebab(camelStr) {
return camelStr.replace(/[A-Z]/g, (str, offset) => (offset > 0 ? '-' : '') + str.toLowerCase());
}
return camelStr.replace(/[A-Z]/g, (str, offset) => (offset > 0 ? '-' : '') + str.toLowerCase());
}

4
resources/js/services/translations.js
View File

@ -19,7 +19,7 @@ class Translator {
*/
parseTranslations() {
const translationMetaTags = document.querySelectorAll('meta[name="translation"]');
for (let tag of translationMetaTags) {
for (const tag of translationMetaTags) {
const key = tag.getAttribute('key');
const value = tag.getAttribute('value');
this.store.set(key, value);
@ -64,7 +64,7 @@ class Translator {
const rangeRegex = /^\[([0-9]+),([0-9*]+)]/;
let result = null;
for (let t of splitText) {
for (const t of splitText) {
// Parse exact matches
const exactMatches = t.match(exactCountRegex);
if (exactMatches !== null && Number(exactMatches[1]) === count) {

23
resources/js/services/util.js
View File

@ -1,5 +1,3 @@
/**
* Returns a function, that, as long as it continues to be invoked, will not
* be triggered. The function will be called after it stops being called for
@ -14,7 +12,8 @@
export function debounce(func, wait, immediate) {
let timeout;
return function() {
const context = this, args = arguments;
const context = this; const
args = arguments;
const later = function() {
timeout = null;
if (!immediate) func.apply(context, args);
@ -24,7 +23,7 @@ export function debounce(func, wait, immediate) {
timeout = setTimeout(later, wait);
if (callNow) func.apply(context, args);
};
};
}
/**
* Scroll and highlight an element.
@ -55,11 +54,11 @@ export function scrollAndHighlightElement(element) {
*/
export function escapeHtml(unsafe) {
return unsafe
.replace(/&/g, "&amp;")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/"/g, "&quot;")
.replace(/'/g, "&#039;");
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/"/g, '&quot;')
.replace(/'/g, '&#039;');
}
/**
@ -68,6 +67,6 @@ export function escapeHtml(unsafe) {
* @returns {string}
*/
export function uniqueId() {
const S4 = () => (((1+Math.random())*0x10000)|0).toString(16).substring(1);
return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
}
const S4 = () => (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
return (`${S4() + S4()}-${S4()}-${S4()}-${S4()}-${S4()}${S4()}${S4()}`);
}

7
resources/js/services/vdom.js
View File

@ -1,8 +1,8 @@
import {
init,
attributesModule,
toVNode
} from "snabbdom";
toVNode,
} from 'snabbdom';
let patcher;
@ -12,7 +12,6 @@ let patcher;
function getPatcher() {
if (patcher) return patcher;
patcher = init([
attributesModule,
]);
@ -28,4 +27,4 @@ export function patchDomFromHtmlString(domTarget, html) {
const contentDom = document.createElement('div');
contentDom.innerHTML = html;
getPatcher()(toVNode(domTarget), toVNode(contentDom));
}
}

3
resources/js/wysiwyg/common-events.js
View File

@ -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();
}
});
}
}

126
resources/js/wysiwyg/config.js
View File

@ -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
*/
*/

23
resources/js/wysiwyg/drop-paste-handling.js
View File

@ -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));
}
}

6
resources/js/wysiwyg/icons.js
View File

@ -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);
}
}
}

33
resources/js/wysiwyg/plugin-codeeditor.js
View File

@ -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;
}
}

35
resources/js/wysiwyg/plugin-drawio.js
View File

@ -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');
}
});
});
};
}
}

7
resources/js/wysiwyg/plugins-about.js
View File

@ -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;
}
}

13
resources/js/wysiwyg/plugins-customhr.js
View File

@ -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;
}
}

40
resources/js/wysiwyg/plugins-details.js
View File

@ -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
resources/js/wysiwyg/plugins-imagemanager.js
View File

@ -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;
}
}

Some files were not shown because too many files have changed in this diff Show More