Skip to content

Commit 2b17d40

Browse files
author
leyboan1
committed
Updated convert.js to support both browser and node.js invocation;
fixed rendering issues; moved dependencies to local
1 parent e94d865 commit 2b17d40

7 files changed

+2132
-76
lines changed

‎static/VERSIONS

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
mermaid 10.9.0
2+

‎static/bulma.min.css

+3
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎static/convert.js

+89-71
Original file line numberDiff line numberDiff line change
@@ -1,88 +1,106 @@
1-
function convertYamlToMermaid(yamlInput) {
2-
// Parse the YAML input
3-
var rules = jsyaml.load(yamlInput);
1+
// yamlToMermaid.js
42

5-
// Generate the Mermaid code
6-
var mermaidCode = 'flowchart TD\n';
7-
var declaredElements = {};
8-
var metadata = {};
9-
10-
function generateConditionDeclaration(conditionName, description) {
11-
if (declaredElements[conditionName]) return "";
12-
return ` ${conditionName}{"\`${sanitize(description) ?? conditionName}\`"}\n`;
3+
(function(root, factory) {
4+
if (typeof define === 'function' && define.amd) {
5+
// AMD. Register as an anonymous module.
6+
define(['js-yaml'], factory);
7+
} else if (typeof module === 'object' && module.exports) {
8+
// Node. Does not work with strict CommonJS, but
9+
// only CommonJS-like environments that support module.exports,
10+
// like Node.
11+
module.exports = factory(require('js-yaml'));
12+
} else {
13+
// Browser globals (root is window)
14+
root.convertYamlToMermaid = factory(root.jsyaml);
1315
}
16+
}(typeof self !== 'undefined' ? self : this, function(jsyaml) {
1417

15-
function generateActionDeclaration(actionName, description) {
16-
if (declaredElements[conditionName]) return "";
17-
return ` ${actionName}["\`${sanitize(description) ?? actionName}\`"]\n`;
18-
}
18+
function convertYamlToMermaid(yamlInput) {
19+
// Parse the YAML input
20+
const rules = jsyaml.load(yamlInput);
1921

20-
function generateTerminateDeclaration(terminateName) {
21-
if (declaredElements[conditionName]) return "";
22-
return ` ${terminateName}((( )))\n`;
23-
}
22+
// Generate the Mermaid code
23+
let mermaidCode = 'flowchart TD\n';
24+
const declaredElements = {};
25+
const metadata = {};
2426

25-
function generateConnection(from, to, label) {
26-
if (label) return ` ${from} -->|${label}| ${to}\n`;
27-
return ` ${from} --> ${to}\n`;
28-
}
27+
function generateConditionDeclaration(conditionName, description) {
28+
if (declaredElements[conditionName]) return "";
29+
declaredElements[conditionName] = true;
30+
return ` ${conditionName}{"\`${sanitize(description) ?? conditionName}\`"}\n`;
31+
}
32+
33+
function generateActionDeclaration(actionName, description) {
34+
if (declaredElements[actionName]) return "";
35+
declaredElements[actionName] = true;
36+
return ` ${actionName}["\`${sanitize(description) ?? actionName}\`"]\n`;
37+
}
38+
39+
function generateTerminateDeclaration(terminateName) {
40+
if (declaredElements[terminateName]) return "";
41+
declaredElements[terminateName] = true;
42+
return ` ${terminateName}((( )))\n`;
43+
}
44+
45+
function generateConnection(from, to, label) {
46+
return label ? ` ${from} -->|${label}| ${to}\n` : ` ${from} --> ${to}\n`;
47+
}
2948

30-
function generateDecision(conditionName, decision, label) {
31-
if (!decision || !conditionName) return "";
32-
33-
code = ""
34-
35-
if (decision.action) {
36-
var actionId = conditionName + `_${label}`;
49+
function generateDecision(conditionName, decision, label) {
50+
if (!decision || !conditionName) return "";
3751

38-
// add action element declaration; empty if it's already declared
39-
code += generateActionDeclaration(actionId, decision.description);
52+
let code = "";
4053

41-
// connection from condition to true action
42-
code += generateConnection(conditionName, actionId, label);
43-
44-
if (decision.next) {
45-
// connection from action to next condition
46-
code += generateConnection(actionId, decision.next, label);
47-
} else if (decision.terminate) {
48-
var trueTerminateID = conditionName + `_${label}_end`;
49-
code += generateTerminateDeclaration(trueTerminateID);
50-
code += generateConnection(actionId, trueTerminateID);
51-
}
52-
} else {
53-
if (decision.next) {
54-
code += generateConnection(conditionName, decision.next, label);
55-
} else if (decision.terminate) {
56-
var trueTerminateID = conditionName + `_${label}_end`;
57-
code += generateTerminateDeclaration(trueTerminateID);
58-
code += generateConnection(conditionName, trueTerminateID, label);
54+
if (decision.action) {
55+
const actionId = conditionName + `_${label}`;
56+
57+
code += generateActionDeclaration(actionId, decision.description);
58+
code += generateConnection(conditionName, actionId, label);
59+
60+
if (decision.next) {
61+
code += generateConnection(actionId, decision.next, label);
62+
} else if (decision.terminate) {
63+
const terminateId = conditionName + `_${label}_end`;
64+
code += generateTerminateDeclaration(terminateId);
65+
code += generateConnection(actionId, terminateId);
66+
}
67+
} else {
68+
if (decision.next) {
69+
code += generateConnection(conditionName, decision.next, label);
70+
} else if (decision.terminate) {
71+
const terminateId = conditionName + `_${label}_end`;
72+
code += generateTerminateDeclaration(terminateId);
73+
code += generateConnection(conditionName, terminateId, label);
74+
}
5975
}
76+
77+
return code;
6078
}
61-
62-
return code
63-
}
6479

65-
for (var conditionName in rules.conditions) {
66-
var condition = rules.conditions[conditionName];
67-
condition.Name = conditionName;
80+
for (const conditionName in rules.conditions) {
81+
const condition = rules.conditions[conditionName];
82+
condition.Name = conditionName;
6883

69-
mermaidCode += generateConditionDeclaration(condition.Name, condition.description);
70-
mermaidCode += generateDecision(conditionName, condition.true, 'true');
71-
mermaidCode += generateDecision(conditionName, condition.false, 'false');
84+
mermaidCode += generateConditionDeclaration(condition.Name, condition.description);
85+
mermaidCode += generateDecision(conditionName, condition.true, 'true');
86+
mermaidCode += generateDecision(conditionName, condition.false, 'false');
7287

73-
// remember metadata
74-
metadata[conditionName] = { func: condition.Check, type: "condition" };
75-
if (condition.true && condition.true.action) {
76-
metadata[conditionName + '_true'] = {func: condition.true.action, type: "action", value: true};
77-
}
78-
if (condition.false && condition.false.action) {
79-
metadata[conditionName + '_false'] = {func: condition.false.action, type: "action", value: false};
88+
// remember metadata
89+
metadata[conditionName] = { func: condition.Check, type: "condition" };
90+
if (condition.true && condition.true.action) {
91+
metadata[conditionName + '_true'] = {func: condition.true.action, type: "action", value: true};
92+
}
93+
if (condition.false && condition.false.action) {
94+
metadata[conditionName + '_false'] = {func: condition.false.action, type: "action", value: false};
95+
}
8096
}
97+
98+
return mermaidCode;
8199
}
82100

83-
return mermaidCode;
84-
}
101+
function sanitize(input) {
102+
return !input ? input : input.replaceAll(`"`, "&ampquot");
103+
}
85104

86-
function sanitize(input) {
87-
return !input ? input : input.replaceAll(`"`, "&ampquot");
88-
}
105+
return convertYamlToMermaid;
106+
}));

‎static/d3.min.js

+2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎static/index.html

+5-5
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@
33

44
<head>
55
<title>YAML to Mermaid Converter</title>
6-
<link rel="stylesheet" href="https://unpkg.com/[email protected]/css/bulma.min.css">
6+
<link rel="stylesheet" href="bulma.min.css">
77
<link rel="stylesheet" href="mermaid.css">
8-
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-yaml/4.1.0/js-yaml.min.js"></script>
9-
<script src="https://cdnjs.cloudflare.com/ajax/libs/mermaid/10.9.0/mermaid.min.js"></script>
10-
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/7.9.0/d3.min.js"></script>
8+
<script src="js-yaml.min.js"></script>
9+
<script src="mermaid.min.js"></script>
10+
<script src="d3.min.js"></script>
1111
<script src="convert.js"></script>
1212
<script>
1313
function fetchRules() {
@@ -120,7 +120,7 @@
120120
<body>
121121
<section class="section">
122122
<div class="container">
123-
<h1 class="title">YAML to Mermaid Converter</h1>
123+
<h1 class="title">YABRE Rules to Mermaid Converter</h1>
124124
<div class="field">
125125
<label class="label" for="ruleDropdown">Select a Rule:</label>
126126
<div class="control">

‎static/js-yaml.min.js

+2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎static/mermaid.min.js

+2,029
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)