This commit is contained in:
Knut Sveidqvist 2024-06-14 17:39:42 +02:00
parent 481f8186e4
commit 0d1ef9de07
25 changed files with 17 additions and 101 deletions

View File

@ -64,7 +64,6 @@ export const addVertices = async function (vert, svgId, root, doc, diagObj, pare
let vertexText = vertex.text !== undefined ? vertex.text : vertex.id;
// We create a SVG label, either by delegating to addHtmlLabel or manually
let vertexNode;
const labelData = { width: 0, height: 0 };
const ports = [
@ -188,7 +187,7 @@ export const addVertices = async function (vert, svgId, root, doc, diagObj, pare
nodeEl = await insertNode(nodes, node, vertex.dir);
boundingBox = nodeEl.node().getBBox();
} else {
const svgLabel = doc.createElementNS('http://www.w3.org/2000/svg', 'text');
doc.createElementNS('http://www.w3.org/2000/svg', 'text');
// svgLabel.setAttribute('style', styles.labelStyle.replace('color:', 'fill:'));
// const rows = vertexText.split(common.lineBreakRegex);
// for (const row of rows) {
@ -677,7 +676,6 @@ const insertEdge = function (edgesEl, edge, edgeData, diagObj, parentLookupDb, i
/**
* Recursive function that iterates over an array of nodes and inserts the children of each node.
* It also recursively populates the inserts the children of the children and so on.
* @param {*} graph
* @param nodeArray
* @param parentLookupDb
*/

View File

@ -3,7 +3,6 @@ import { curveLinear } from 'd3';
import ELK from 'elkjs/lib/elk.bundled.js';
import mermaid from 'mermaid';
import { findCommonAncestor } from './find-common-ancestor.js';
import config from '../../mermaid/src/defaultConfig';
const {
common,
@ -123,7 +122,7 @@ const drawNodes = (relX, relY, nodeArray, svg, subgraphsEl, depth) => {
const clusterNode = JSON.parse(JSON.stringify(node));
clusterNode.x = node.offset.posX + node.width / 2;
clusterNode.y = node.offset.posY + node.height / 2;
const cluster = insertCluster(subgraphEl, clusterNode);
insertCluster(subgraphEl, clusterNode);
log.info('Id (UGH)= ', node.shape, node.labels);
} else {

View File

@ -2,7 +2,7 @@ import { select } from 'd3';
import utils, { getEdgeId } from '../../utils.js';
import { getConfig, defaultConfig } from '../../diagram-api/diagramAPI.js';
import common from '../common/common.js';
import type { LayoutData, LayoutMethod, Node, Edge } from '../../rendering-util/types.js';
import type { Node, Edge } from '../../rendering-util/types.js';
import { log } from '../../logger.js';
import {
setAccTitle,

View File

@ -192,9 +192,8 @@ export const addVertices = async function (vert, g, svgId, root, doc, diagObj) {
*
* @param {object} edges The edges to add to the graph
* @param {object} g The graph object
* @param diagObj
*/
export const addEdges = async function (edges, g, diagObj) {
export const addEdges = async function (edges, g) {
log.info('abc78 edges = ', edges);
let cnt = 0;
let linkIdCnt = {};

View File

@ -1,6 +1,6 @@
import { log } from '../../logger.js';
import type { DiagramStyleClassDef } from '../../diagram-api/types.js';
import type { LayoutData, LayoutMethod } from '../../rendering-util/types.js';
import type { LayoutData } from '../../rendering-util/types.js';
import { getConfig } from '../../diagram-api/diagramAPI.js';
import { render } from '../../rendering-util/render.js';
import { getDiagramElements } from '../../rendering-util/insertElementsForSize.js';

View File

@ -196,7 +196,7 @@ export const drawNode = function (
// Create the wrapped text element
const textElem = nodeElem.append('g');
const description = node.descr.replace(/(<br\/*>)/g, '\n');
const newEl = createText(
createText(
textElem,
description,
{

View File

@ -21,34 +21,7 @@ import {
STMT_APPLYCLASS,
DEFAULT_STATE_TYPE,
DIVIDER_TYPE,
G_EDGE_STYLE,
G_EDGE_ARROWHEADSTYLE,
G_EDGE_LABELPOS,
G_EDGE_LABELTYPE,
G_EDGE_THICKNESS,
CSS_EDGE,
DEFAULT_NESTED_DOC_DIR,
SHAPE_DIVIDER,
SHAPE_GROUP,
CSS_DIAGRAM_CLUSTER,
CSS_DIAGRAM_CLUSTER_ALT,
CSS_DIAGRAM_STATE,
SHAPE_STATE_WITH_DESC,
SHAPE_STATE,
SHAPE_START,
SHAPE_END,
SHAPE_NOTE,
SHAPE_NOTEGROUP,
CSS_DIAGRAM_NOTE,
DOMID_TYPE_SPACER,
DOMID_STATE,
NOTE_ID,
PARENT_ID,
NOTE,
PARENT,
CSS_EDGE_NOTE_EDGE,
} from './stateCommon.js';
import { node } from 'stylis';
const START_NODE = '[*]';
const START_TYPE = 'start';

View File

@ -258,7 +258,6 @@ export const drawTask = function (elem, task, conf) {
rect.ry = 3;
drawRect(g, rect);
let xPos = task.x + 14;
// task.people.forEach((person) => {
// const colour = task.actors[person].color;

View File

@ -1,8 +1,6 @@
import { log } from '$root/logger.js';
import type { LayoutData, LayoutMethod, RenderData } from './types.js';
const layoutAlgorithms = {} as Record<string, any>;
const performLayout = (
layoutData: LayoutData,
id: string,

View File

@ -30,10 +30,10 @@ export const getDiagramElements = (id, securityLevel) => {
*/
export function insertElementsForSize(el, data) {
const nodesElem = el.insert('g').attr('class', 'nodes');
const edgesElem = el.insert('g').attr('class', 'edges');
el.insert('g').attr('class', 'edges');
data.nodes.forEach(async (item) => {
item.shape = 'rect';
const e = await insertNode(nodesElem, {
await insertNode(nodesElem, {
...item,
class: 'default flowchart-label',
labelStyle: '',

View File

@ -225,10 +225,11 @@ const recursiveRender = async (_elem, graph, diagramType, id, parentCluster, sit
graph.parent(v)
);
node.height += 0;
const parent = graph.node(node.parentId);
graph.node(node.parentId);
const halfPadding = node?.padding / 2 || 0;
const labelHeight = node?.labelBBox?.height || 0;
const offsetY = labelHeight - halfPadding || 0;
log.debug('OffsetY', offsetY, 'labelHeight', labelHeight, 'halfPadding', halfPadding);
// node.y += offsetY + (parent?.offsetY / 2 || 0);
// node.offsetY = offsetY;
insertCluster(clusters, node);

View File

@ -173,6 +173,7 @@ const findCommonEdges = (graph, id1, id2) => {
*
* @param id
* @param {any} graph
* @param {string} clusterId
*/
export const findNonClusterChild = (id, graph, clusterId) => {
const children = graph.children(id);

View File

@ -125,21 +125,6 @@ const rect = (parent, node) => {
* @returns {any} ShapeSvg
*/
const noteGroup = (parent, node) => {
const { themeVariables } = getConfig();
const {
textColor,
clusterTextColor,
altBackground,
compositeBackground,
compositeTitleBackground,
compositeBorder,
noteBorderColor,
noteBkgColor,
nodeBorder,
mainBkg,
stateBorder,
} = themeVariables;
// Add outer g element
const shapeSvg = parent.insert('g').attr('class', 'note-cluster').attr('id', node.id);

View File

@ -474,24 +474,7 @@ const fixCorners = function (lineData) {
}
return newLineData;
};
/**
* Given a line, this function will return a new line where the corners are rounded.
* @param lineData
*/
function roundedCornersLine(lineData) {
const newLineData = fixCorners(lineData);
let path = '';
for (let i = 0; i < newLineData.length; i++) {
if (i === 0) {
path += 'M' + newLineData[i].x + ',' + newLineData[i].y;
} else if (i === newLineData.length - 1) {
path += 'L' + newLineData[i].x + ',' + newLineData[i].y;
} else {
path += 'L' + newLineData[i].x + ',' + newLineData[i].y;
}
}
return path;
}
export const insertEdge = function (elem, edge, clusterDb, diagramType, startNode, endNode, id) {
const { handdrawnSeed } = getConfig();
let points = edge.points;
@ -530,7 +513,7 @@ export const insertEdge = function (elem, edge, clusterDb, diagramType, startNod
// The data for our line
let lineData = points.filter((p) => !Number.isNaN(p.y));
const { cornerPoints, cornerPointPositions } = extractCornerPoints(lineData);
// const { cornerPoints, cornerPointPositions } = extractCornerPoints(lineData);
lineData = fixCorners(lineData);
let lastPoint = lineData[lineData.length - 1];
if (lineData.length > 1) {
@ -593,11 +576,10 @@ export const insertEdge = function (elem, edge, clusterDb, diagramType, startNod
strokeClasses += ' edge-pattern-solid';
}
let svgPath;
let path = '';
let linePath = lineFunction(lineData);
if (edge.look === 'handdrawn') {
const rc = rough.svg(elem);
const ld = Object.assign([], lineData);
Object.assign([], lineData);
// const svgPathNode = rc.path(lineFunction(ld.splice(0, ld.length-1)), {
// const svgPathNode = rc.path(lineFunction(ld), {
// roughness: 0.3,

View File

@ -21,12 +21,6 @@ import { lean_right } from './shapes/leanRight.js';
import { lean_left } from './shapes/leanLeft.js';
import { trapezoid } from './shapes/trapezoid.js';
import { inv_trapezoid } from './shapes/invertedTrapezoid.js';
const formatClass = (str) => {
if (str) {
return ' ' + str;
}
return '';
};
const shapes = {
state,

View File

@ -1,4 +1,3 @@
import { log } from '$root/logger.js';
import { labelHelper, updateNodeBounds, getNodeClasses } from './util.js';
import intersect from '../intersect/index.js';
import type { Node } from '$root/rendering-util/types.d.ts';

View File

@ -7,7 +7,7 @@ import rough from 'roughjs';
import { getConfig } from '$root/diagram-api/diagramAPI.js';
export const drawRect = async (parent: SVGAElement, node: Node, options: RectOptions) => {
const { themeVariables, look } = getConfig();
const { look } = getConfig();
const { shapeSvg, bbox } = await labelHelper(parent, node, getNodeClasses(node));

View File

@ -1,4 +1,3 @@
import { log } from '$root/logger.js';
import { labelHelper, updateNodeBounds, getNodeClasses } from './util.js';
import intersect from '../intersect/index.js';
import type { Node } from '$root/rendering-util/types.d.ts';
@ -26,7 +25,7 @@ export const createHexagonPathD = (
};
export const hexagon = async (parent: SVGAElement, node: Node): Promise<SVGAElement> => {
const { shapeSvg, bbox, halfPadding } = await labelHelper(parent, node, getNodeClasses(node));
const { shapeSvg, bbox } = await labelHelper(parent, node, getNodeClasses(node));
const f = 4;
const h = bbox.height + node.padding;

View File

@ -1,7 +1,5 @@
import { log } from '$root/logger.js';
import { labelHelper, updateNodeBounds, getNodeClasses } from './util.js';
import intersect from '../intersect/index.js';
import { getConfig } from '$root/diagram-api/diagramAPI.js';
import type { Node } from '$root/rendering-util/types.d.ts';
import { userNodeOverrides } from '$root/rendering-util/rendering-elements/shapes/handdrawnStyles.js';
import rough from 'roughjs';

View File

@ -1,4 +1,3 @@
import { log } from '$root/logger.js';
import { labelHelper, updateNodeBounds, getNodeClasses } from './util.js';
import intersect from '../intersect/index.js';
import type { Node } from '$root/rendering-util/types.d.ts';

View File

@ -1,4 +1,3 @@
import { log } from '$root/logger.js';
import { labelHelper, updateNodeBounds, getNodeClasses } from './util.js';
import intersect from '../intersect/index.js';
import type { Node } from '$root/rendering-util/types.d.ts';

View File

@ -13,11 +13,7 @@ export const note = async (parent: SVGAElement, node: Node) => {
if (!useHtmlLabels) {
node.centerLabel = true;
}
const { shapeSvg, bbox, halfPadding } = await labelHelper(
parent,
node,
'node ' + node.cssClasses
);
const { shapeSvg, bbox } = await labelHelper(parent, node, 'node ' + node.cssClasses);
log.info('Classes = ', node.cssClasses);
const { cssStyles } = node;

View File

@ -1,4 +1,3 @@
import { log } from '$root/logger.js';
import { labelHelper, updateNodeBounds, getNodeClasses } from './util.js';
import intersect from '../intersect/index.js';
import type { Node } from '$root/rendering-util/types.d.ts';

View File

@ -1,4 +1,3 @@
import { log } from '$root/logger.js';
import { updateNodeBounds } from './util.js';
import intersect from '../intersect/index.js';
import type { Node } from '$root/rendering-util/types.d.ts';

View File

@ -1,4 +1,3 @@
import { log } from '$root/logger.js';
import { updateNodeBounds } from './util.js';
import intersect from '../intersect/index.js';
import type { Node } from '$root/rendering-util/types.d.ts';