Commiton issue #3061 Injecting mermaid utilities in registered diagram

This commit is contained in:
Knut Sveidqvist
2022-09-26 08:01:23 +02:00
parent 493aac6885
commit 9566f51ca8
15 changed files with 197 additions and 77 deletions

View File

@@ -3,7 +3,7 @@ import mindmapParser from './parser/mindmap';
import * as mindmapDb from './mindmapDb';
import mindmapRenderer from './mindmapRenderer';
import mindmapStyles from './styles';
import { injectUtils } from './mermaidUtils';
// import mermaid from 'mermaid';
// console.log('mindmapDb', mindmapDb.getMindmap()); // eslint-disable-line no-console
@@ -13,12 +13,22 @@ if (typeof document !== 'undefined') {
/*!
* Wait for document loaded before starting the execution
*/
// { parser: mindmapParser, db: mindmapDb, renderer: mindmapRenderer, styles: mindmapStyles },
window.addEventListener(
'load',
() => {
if (window.mermaid && typeof window.mermaid.detectors === 'object') {
// window.mermaid.detectors.push(mindmapDetector);
console.log(window.mermaid.detectors); // eslint-disable-line no-console
if (window.mermaid && typeof window.mermaid.c) {
window.mermaid.connectDiagram(
'mindmap',
{
db: mindmapDb,
renderer: mindmapRenderer,
parser: mindmapParser,
styles: mindmapStyles,
},
injectUtils
);
}
},
false

View File

@@ -0,0 +1,77 @@
const warning = (s: string) => {
// Todo remove debug code
console.error('Log function was called before initialization', s); // eslint-disable-line
};
export type LogLevel = 'trace' | 'debug' | 'info' | 'warn' | 'error' | 'fatal';
export const LEVELS: Record<LogLevel, number> = {
trace: 0,
debug: 1,
info: 2,
warn: 3,
error: 4,
fatal: 5,
};
export const log: Record<keyof typeof LEVELS, typeof console.log> = {
trace: warning,
debug: warning,
info: warning,
warn: warning,
error: warning,
fatal: warning,
};
export let setLogLevel: (level: keyof typeof LEVELS | number | string) => void;
export let getConfig: () => object;
export let sanitizeText: (str: string) => string;
// eslint-disable @typescript-eslint/no-explicit-any
export let setupGraphViewbox: (
graph: any,
svgElem: any,
padding: any,
useMaxWidth: boolean
) => void;
export const injectUtils = (
_log: Record<keyof typeof LEVELS, typeof console.log>,
_setLogLevel: any,
_getConfig: any,
_sanitizeText: any,
_setupGraphViewbox: any
) => {
log.debug = _log.debug;
log.info = _log.info;
log.warn = _log.warn;
log.error = _log.error;
setLogLevel = _setLogLevel;
getConfig = _getConfig;
sanitizeText = _sanitizeText;
setupGraphViewbox = _setupGraphViewbox;
};
/*
const warning = (..._args: any[]) => {
console.error('Log function was called before initialization');
};
export let log = {
trace: warning,
debug: warning,
info: warning,
warn: warning,
error: warning,
fatal: warning,
};
export let setLogLevel;
export let getConfig;
export let sanitizeText;
export let setupGraphViewbox;
export const injectUtils = (_log, _setLogLevel, _getConfig, _sanitizeText, _setupGraphViewbox) => {
log = _log;
setLogLevel = _setLogLevel;
getConfig = _getConfig;
sanitizeText = _sanitizeText;
setupGraphViewbox = _setupGraphViewbox;
};
*/

View File

@@ -1,5 +1,5 @@
/** Created by knut on 15-01-14. */
import { sanitizeText, getConfig, log as _log } from 'mermaid/diagramAPI';
import { sanitizeText, getConfig, log as _log } from './mermaidUtils';
let nodes = [];
let cnt = 0;
@@ -133,6 +133,7 @@ export const type2Str = (type) => {
};
// Expose logger to grammar
export const log = _log;
export let graphType = 'mindmap';
export const getNodeById = (id) => nodes[id];
export const getElementById = (id) => elements[id];
// export default {

View File

@@ -1,6 +1,6 @@
/** Created by knut on 14-12-11. */
import { select } from 'd3';
import { log, getConfig, setupGraphViewbox } from '../../diagram-api/diagramAPI';
import { log, getConfig, setupGraphViewbox } from './mermaidUtils';
import svgDraw from './svgDraw';
import { BoundingBox, Layout } from 'non-layered-tidy-tree-layout';
import clone from 'fast-clone';

View File

@@ -1,27 +1,27 @@
// @ts-ignore: TODO Fix ts errors
// import mindmapParser from './parser/mindmap';
// import * as mindmapDb from './mindmapDb';
import { mindmapDetector } from './mindmapDetector';
// import mindmapRenderer from './mindmapRenderer';
// import mindmapStyles from './styles';
import mermaid from 'mermaid';
if (typeof document !== 'undefined') {
if (window.mermaid && typeof window.mermaid.detectors === 'object') {
window.mermaid.detectors.push({ id: 'mindmap', detector: mindmapDetector });
} else {
console.error('window.mermaid.detectors not found'); // eslint-disable-line no-console
window.mermaid = {};
window.mermaid.detectors = [{ id: 'mindmap', detector: mindmapDetector }];
console.error('Detectors now:', window.mermaid.detectors); // eslint-disable-line no-console
}
console.log('mindmapDb', mermaid.mermaidAPI.getConfig()); // eslint-disable-line no-console
// registerDiagram()
// if (typeof document !== 'undefined') {
// /*!
// * Wait for document loaded before starting the execution
// */
// window.addEventListener(
// 'load',
// () => {
// if (window.mermaid && typeof window.mermaid.detectors === 'object') {
// window.mermaid.detectors.push(mindmapDetector);
// console.log(window.mermaid.detectors); // eslint-disable-line no-console
// }
// },
// false
// );
// }
/*!
* Wait for document loaded before starting the execution.
*/
window.addEventListener(
'load',
() => {
if (window.mermaid && typeof window.mermaid.detectors === 'object') {
window.mermaid.detectors.push({ id: 'mindmap', detector: mindmapDetector });
// console.error(window.mermaid.detectors); // eslint-disable-line no-console
}
},
false
);
}