mirror of
https://github.com/zadam/trilium.git
synced 2025-03-01 14:22:32 +01:00
9771b441ad
* ## Excalidraw and SVG * 2022-04-16 - @thfrei * * Known issues: * - excalidraw-to-svg (node.js) does not render any hand drawn (freedraw) paths. There is an issue with * Path2D object not present in node-canvas library used by jsdom. (See Trilium PR for samples and other issues * in respective library. Link will be added later). Related links: * - https://github.com/Automattic/node-canvas/pull/2013 * - https://github.com/google/canvas-5-polyfill * - https://github.com/Automattic/node-canvas/issues/1116 * - https://www.npmjs.com/package/path2d-polyfill * - excalidraw-to-svg (node.js) takes quite some time to load an image (1-2s) * - excalidraw-utils (browser) does render freedraw, however NOT freedraw with background * * Due to this issues, we opt to use **only excalidraw in the frontend**. Upon saving, we will also get the SVG * output from the live excalidraw instance. We will save this **SVG side by side the native excalidraw format * in the trilium note**. * * Pro: we will combat bit-rot. Showing the SVG will be very fast, since it is already rendered. * Con: The note will get bigger (maybe +30%?), we will generate more bandwith. * (However, using trilium desktop instance, does not care too much about bandwidth. Size increase is probably * acceptable, as a trade off.)
123 lines
3.1 KiB
JavaScript
123 lines
3.1 KiB
JavaScript
const CKEDITOR = {"js": ["libraries/ckeditor/ckeditor.js"]};
|
|
|
|
const CODE_MIRROR = {
|
|
js: [
|
|
"libraries/codemirror/codemirror.js",
|
|
"libraries/codemirror/addon/display/placeholder.js",
|
|
"libraries/codemirror/addon/edit/matchbrackets.js",
|
|
"libraries/codemirror/addon/edit/matchtags.js",
|
|
"libraries/codemirror/addon/fold/xml-fold.js",
|
|
"libraries/codemirror/addon/lint/lint.js",
|
|
"libraries/codemirror/addon/lint/eslint.js",
|
|
"libraries/codemirror/addon/mode/loadmode.js",
|
|
"libraries/codemirror/addon/mode/simple.js",
|
|
"libraries/codemirror/addon/search/match-highlighter.js",
|
|
"libraries/codemirror/mode/meta.js",
|
|
"libraries/codemirror/keymap/vim.js"
|
|
],
|
|
css: [
|
|
"libraries/codemirror/codemirror.css",
|
|
"libraries/codemirror/addon/lint/lint.css"
|
|
]
|
|
};
|
|
|
|
const ESLINT = {js: ["libraries/eslint.js"]};
|
|
|
|
const COMMONMARK = {js: ["libraries/commonmark.min.js"]};
|
|
|
|
const RELATION_MAP = {
|
|
js: [
|
|
"libraries/jsplumb.js",
|
|
"libraries/panzoom.js"
|
|
],
|
|
css: [
|
|
"stylesheets/relation_map.css"
|
|
]
|
|
};
|
|
|
|
const PRINT_THIS = {js: ["libraries/printThis.js"]};
|
|
|
|
const CALENDAR_WIDGET = {css: ["stylesheets/calendar.css"]};
|
|
|
|
const KATEX = {
|
|
js: [ "libraries/katex/katex.min.js", "libraries/katex/mhchem.min.js", "libraries/katex/auto-render.min.js" ],
|
|
css: [ "libraries/katex/katex.min.css" ]
|
|
};
|
|
|
|
const WHEEL_ZOOM = {
|
|
js: [ "libraries/wheel-zoom.min.js"]
|
|
};
|
|
|
|
const FORCE_GRAPH = {
|
|
js: [ "libraries/force-graph.min.js"]
|
|
};
|
|
|
|
const MERMAID = {
|
|
js: [ "libraries/mermaid.min.js" ]
|
|
}
|
|
|
|
const EXCALIDRAW = {
|
|
js: [
|
|
"node_modules/react/umd/react.production.min.js", //v17.0.2
|
|
"node_modules/react-dom/umd/react-dom.production.min.js", //v17.0.2
|
|
"node_modules/@excalidraw/excalidraw/dist/excalidraw.production.min.js", //v.0.11.0
|
|
],
|
|
// css: [
|
|
// "stylesheets/somestyle.css"
|
|
// ]
|
|
};
|
|
|
|
async function requireLibrary(library) {
|
|
if (library.css) {
|
|
library.css.map(cssUrl => requireCss(cssUrl));
|
|
}
|
|
|
|
if (library.js) {
|
|
for (const scriptUrl of library.js) {
|
|
await requireScript(scriptUrl);
|
|
}
|
|
}
|
|
}
|
|
|
|
// we save the promises in case of the same script being required concurrently multiple times
|
|
const loadedScriptPromises = {};
|
|
|
|
async function requireScript(url) {
|
|
if (!loadedScriptPromises[url]) {
|
|
loadedScriptPromises[url] = $.ajax({
|
|
url: url,
|
|
dataType: "script",
|
|
cache: true
|
|
});
|
|
}
|
|
|
|
await loadedScriptPromises[url];
|
|
}
|
|
|
|
async function requireCss(url) {
|
|
const cssLinks = Array
|
|
.from(document.querySelectorAll('link'))
|
|
.map(el => el.href);
|
|
|
|
if (!cssLinks.some(l => l.endsWith(url))) {
|
|
$('head').append($('<link rel="stylesheet" type="text/css" />').attr('href', url));
|
|
}
|
|
}
|
|
|
|
export default {
|
|
requireCss,
|
|
requireLibrary,
|
|
CKEDITOR,
|
|
CODE_MIRROR,
|
|
ESLINT,
|
|
COMMONMARK,
|
|
RELATION_MAP,
|
|
PRINT_THIS,
|
|
CALENDAR_WIDGET,
|
|
KATEX,
|
|
WHEEL_ZOOM,
|
|
FORCE_GRAPH,
|
|
MERMAID,
|
|
EXCALIDRAW
|
|
}
|