docs/dependencygraph.html
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8" />
<title>dependency graph</title>
<style>
.node:active path,
.node:hover path,
.node.current path,
.node:active polygon,
.node:hover polygon,
.node.current polygon {
stroke: fuchsia;
stroke-width: 2;
}
.edge:active path,
.edge:hover path,
.edge.current path,
.edge:active ellipse,
.edge:hover ellipse,
.edge.current ellipse {
stroke: fuchsia;
stroke-width: 3;
stroke-opacity: 1;
}
.edge:active polygon,
.edge:hover polygon,
.edge.current polygon {
stroke: fuchsia;
stroke-width: 3;
fill: fuchsia;
stroke-opacity: 1;
fill-opacity: 1;
}
.edge:active text,
.edge:hover text {
fill: fuchsia;
}
.cluster path {
stroke-width: 3;
}
.cluster:active path,
.cluster:hover path {
fill: #ffff0011;
}
div.hint {
background-color: #000000aa;
color: white;
font-family: Arial, Helvetica, sans-serif;
border-radius: 1rem;
position: fixed;
top: calc(50% - 4em);
right: calc(50% - 10em);
border: none;
padding: 1em 3em 1em 1em;
}
.hint button {
position: absolute;
font-weight: bolder;
right: 0.6em;
top: 0.6em;
color: inherit;
background-color: inherit;
border: 1px solid currentColor;
border-radius: 1em;
margin-left: 0.6em;
}
.hint a {
color: inherit;
}
#button_help {
color: white;
background-color: #00000011;
border-radius: 1em;
position: fixed;
top: 1em;
right: 1em;
font-size: 24pt;
font-weight: bolder;
width: 2em;
height: 2em;
border: none;
}
#button_help:hover {
cursor: pointer;
background-color: #00000077;
}
@media print {
#button_help {
display: none;
}
div.hint {
display: none;
}
}
</style>
</head>
<body>
<button id="button_help">?</button>
<div id="hints" class="hint" style="display: none">
<button id="close-hints">x</button>
<span id="hint-text"></span>
<ul>
<li><b>Hover</b> - highlight</li>
<li><b>Left-click</b> - pin highlight</li>
<li><b>ESC</b> - clear</li>
</ul>
</div>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Generated by graphviz version 5.0.0 (20220707.1540)
-->
<!-- Title: dependency-cruiser output Pages: 1 -->
<svg width="517pt" height="517pt"
viewBox="0.00 0.00 517.00 517.09" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 513.09)">
<title>dependency-cruiser output</title>
<polygon fill="white" stroke="transparent" points="-4,4 -4,-513.09 513,-513.09 513,4 -4,4"/>
<g id="clust1" class="cluster">
<title>cluster_node_modules</title>
<path fill="#ffffff" stroke="black" stroke-width="2" d="M432,-72.17C432,-72.17 489,-72.17 489,-72.17 495,-72.17 501,-78.17 501,-84.17 501,-84.17 501,-292.17 501,-292.17 501,-298.17 495,-304.17 489,-304.17 489,-304.17 432,-304.17 432,-304.17 426,-304.17 420,-298.17 420,-292.17 420,-292.17 420,-84.17 420,-84.17 420,-78.17 426,-72.17 432,-72.17"/>
<text text-anchor="middle" x="460.5" y="-292.97" font-family="Helvetica,sans-Serif" font-weight="bold" font-size="9.00">node_modules</text>
</g>
<g id="clust2" class="cluster">
<title>cluster_src</title>
<path fill="#ffffff" stroke="black" stroke-width="2" d="M20,-208.17C20,-208.17 400,-208.17 400,-208.17 406,-208.17 412,-214.17 412,-220.17 412,-220.17 412,-442.17 412,-442.17 412,-448.17 406,-454.17 400,-454.17 400,-454.17 20,-454.17 20,-454.17 14,-454.17 8,-448.17 8,-442.17 8,-442.17 8,-220.17 8,-220.17 8,-214.17 14,-208.17 20,-208.17"/>
<text text-anchor="middle" x="210" y="-442.97" font-family="Helvetica,sans-Serif" font-weight="bold" font-size="9.00">src</text>
</g>
<g id="clust3" class="cluster">
<title>cluster_src/actions</title>
<path fill="#ffffff" stroke="black" stroke-width="2" d="M98,-306.17C98,-306.17 306.5,-306.17 306.5,-306.17 312.5,-306.17 318.5,-312.17 318.5,-318.17 318.5,-318.17 318.5,-406.17 318.5,-406.17 318.5,-412.17 312.5,-418.17 306.5,-418.17 306.5,-418.17 98,-418.17 98,-418.17 92,-418.17 86,-412.17 86,-406.17 86,-406.17 86,-318.17 86,-318.17 86,-312.17 92,-306.17 98,-306.17"/>
<text text-anchor="middle" x="202.25" y="-406.97" font-family="Helvetica,sans-Serif" font-weight="bold" font-size="9.00">actions</text>
</g>
<g id="clust4" class="cluster">
<title>cluster_src/cli</title>
<path fill="#ffffff" stroke="black" stroke-width="2" d="M28,-216.17C28,-216.17 329,-216.17 329,-216.17 335,-216.17 341,-222.17 341,-228.17 341,-228.17 341,-286.17 341,-286.17 341,-292.17 335,-298.17 329,-298.17 329,-298.17 28,-298.17 28,-298.17 22,-298.17 16,-292.17 16,-286.17 16,-286.17 16,-228.17 16,-228.17 16,-222.17 22,-216.17 28,-216.17"/>
<text text-anchor="middle" x="178.5" y="-286.97" font-family="Helvetica,sans-Serif" font-weight="bold" font-size="9.00">cli</text>
</g>
<!-- fs -->
<g id="node1" class="node">
<title>fs</title>
<g id="a_node1"><a xlink:title="fs">
<path fill="#ffffcc" stroke="grey" d="M397.5,-186.17C397.5,-186.17 355.5,-186.17 355.5,-186.17 352.5,-186.17 349.5,-183.17 349.5,-180.17 349.5,-180.17 349.5,-174.17 349.5,-174.17 349.5,-171.17 352.5,-168.17 355.5,-168.17 355.5,-168.17 397.5,-168.17 397.5,-168.17 400.5,-168.17 403.5,-171.17 403.5,-174.17 403.5,-174.17 403.5,-180.17 403.5,-180.17 403.5,-183.17 400.5,-186.17 397.5,-186.17"/>
<text text-anchor="middle" x="376.5" y="-174.97" font-family="Helvetica,sans-Serif" font-size="9.00" fill="grey">fs</text>
</a>
</g>
</g>
<!-- node_modules/ajv -->
<g id="node2" class="node">
<title>node_modules/ajv</title>
<g id="a_node2"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/node_modules/ajv" xlink:title="ajv">
<polygon fill="#c40b0a" fill-opacity="0.101961" stroke="black" points="487.5,-248.17 435.5,-248.17 433.5,-246.17 433.5,-230.17 485.5,-230.17 487.5,-232.17 487.5,-248.17"/>
<polyline fill="none" stroke="black" points="485.5,-246.17 433.5,-246.17 "/>
<polyline fill="none" stroke="black" points="485.5,-246.17 485.5,-230.17 "/>
<polyline fill="none" stroke="black" points="485.5,-246.17 487.5,-248.17 "/>
<text text-anchor="start" x="454" y="-236.97" font-family="Helvetica,sans-Serif" font-size="9.00" fill="#c40b0a">ajv</text>
</a>
</g>
</g>
<!-- node_modules/commander -->
<g id="node3" class="node">
<title>node_modules/commander</title>
<g id="a_node3"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/node_modules/commander" xlink:title="commander">
<polygon fill="#c40b0a" fill-opacity="0.101961" stroke="black" points="493,-98.17 430,-98.17 428,-96.17 428,-80.17 491,-80.17 493,-82.17 493,-98.17"/>
<polyline fill="none" stroke="black" points="491,-96.17 428,-96.17 "/>
<polyline fill="none" stroke="black" points="491,-96.17 491,-80.17 "/>
<polyline fill="none" stroke="black" points="491,-96.17 493,-98.17 "/>
<text text-anchor="start" x="436" y="-86.97" font-family="Helvetica,sans-Serif" font-size="9.00" fill="#c40b0a">commander</text>
</a>
</g>
</g>
<!-- node_modules/get-stream -->
<g id="node4" class="node">
<title>node_modules/get-stream</title>
<g id="a_node4"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/node_modules/get-stream" xlink:title="get-stream">
<polygon fill="#c40b0a" fill-opacity="0.101961" stroke="black" points="490.5,-158.17 432.5,-158.17 430.5,-156.17 430.5,-140.17 488.5,-140.17 490.5,-142.17 490.5,-158.17"/>
<polyline fill="none" stroke="black" points="488.5,-156.17 430.5,-156.17 "/>
<polyline fill="none" stroke="black" points="488.5,-156.17 488.5,-140.17 "/>
<polyline fill="none" stroke="black" points="488.5,-156.17 490.5,-158.17 "/>
<text text-anchor="start" x="438.5" y="-146.97" font-family="Helvetica,sans-Serif" font-size="9.00" fill="#c40b0a">get-stream</text>
</a>
</g>
</g>
<!-- node_modules/lodash -->
<g id="node5" class="node">
<title>node_modules/lodash</title>
<g id="a_node5"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/node_modules/lodash" xlink:title="lodash">
<polygon fill="#c40b0a" fill-opacity="0.101961" stroke="black" points="487.5,-128.17 435.5,-128.17 433.5,-126.17 433.5,-110.17 485.5,-110.17 487.5,-112.17 487.5,-128.17"/>
<polyline fill="none" stroke="black" points="485.5,-126.17 433.5,-126.17 "/>
<polyline fill="none" stroke="black" points="485.5,-126.17 485.5,-110.17 "/>
<polyline fill="none" stroke="black" points="485.5,-126.17 487.5,-128.17 "/>
<text text-anchor="start" x="446.5" y="-116.97" font-family="Helvetica,sans-Serif" font-size="9.00" fill="#c40b0a">lodash</text>
</a>
</g>
</g>
<!-- node_modules/mscgenjs -->
<g id="node6" class="node">
<title>node_modules/mscgenjs</title>
<g id="a_node6"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/node_modules/mscgenjs" xlink:title="mscgenjs">
<polygon fill="#c40b0a" fill-opacity="0.101961" stroke="black" points="488.5,-218.17 434.5,-218.17 432.5,-216.17 432.5,-200.17 486.5,-200.17 488.5,-202.17 488.5,-218.17"/>
<polyline fill="none" stroke="black" points="486.5,-216.17 432.5,-216.17 "/>
<polyline fill="none" stroke="black" points="486.5,-216.17 486.5,-200.17 "/>
<polyline fill="none" stroke="black" points="486.5,-216.17 488.5,-218.17 "/>
<text text-anchor="start" x="440.5" y="-206.97" font-family="Helvetica,sans-Serif" font-size="9.00" fill="#c40b0a">mscgenjs</text>
</a>
</g>
</g>
<!-- node_modules/puppeteer -->
<g id="node7" class="node">
<title>node_modules/puppeteer</title>
<g id="a_node7"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/node_modules/puppeteer" xlink:title="puppeteer">
<polygon fill="#c40b0a" fill-opacity="0.101961" stroke="black" points="490,-188.17 433,-188.17 431,-186.17 431,-170.17 488,-170.17 490,-172.17 490,-188.17"/>
<polyline fill="none" stroke="black" points="488,-186.17 431,-186.17 "/>
<polyline fill="none" stroke="black" points="488,-186.17 488,-170.17 "/>
<polyline fill="none" stroke="black" points="488,-186.17 490,-188.17 "/>
<text text-anchor="start" x="439" y="-176.97" font-family="Helvetica,sans-Serif" font-size="9.00" fill="#c40b0a">puppeteer</text>
</a>
</g>
</g>
<!-- node_modules/semver -->
<g id="node8" class="node">
<title>node_modules/semver</title>
<g id="a_node8"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/node_modules/semver" xlink:title="semver">
<polygon fill="#c40b0a" fill-opacity="0.101961" stroke="black" points="487.5,-278.17 435.5,-278.17 433.5,-276.17 433.5,-260.17 485.5,-260.17 487.5,-262.17 487.5,-278.17"/>
<polyline fill="none" stroke="black" points="485.5,-276.17 433.5,-276.17 "/>
<polyline fill="none" stroke="black" points="485.5,-276.17 485.5,-260.17 "/>
<polyline fill="none" stroke="black" points="485.5,-276.17 487.5,-278.17 "/>
<text text-anchor="start" x="445" y="-266.97" font-family="Helvetica,sans-Serif" font-size="9.00" fill="#c40b0a">semver</text>
</a>
</g>
</g>
<!-- package.json -->
<g id="node9" class="node">
<title>package.json</title>
<g id="a_node9"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/package.json" xlink:title="package.json">
<path fill="#ffee44" stroke="black" d="M163.5,-200.17C163.5,-200.17 104.5,-200.17 104.5,-200.17 101.5,-200.17 98.5,-197.17 98.5,-194.17 98.5,-194.17 98.5,-188.17 98.5,-188.17 98.5,-185.17 101.5,-182.17 104.5,-182.17 104.5,-182.17 163.5,-182.17 163.5,-182.17 166.5,-182.17 169.5,-185.17 169.5,-188.17 169.5,-188.17 169.5,-194.17 169.5,-194.17 169.5,-197.17 166.5,-200.17 163.5,-200.17"/>
<text text-anchor="middle" x="134" y="-188.97" font-family="Helvetica,sans-Serif" font-size="9.00">package.json</text>
</a>
</g>
</g>
<!-- path -->
<g id="node10" class="node">
<title>path</title>
<g id="a_node10"><a xlink:title="path">
<path fill="#ffffcc" stroke="grey" d="M281,-104.17C281,-104.17 239,-104.17 239,-104.17 236,-104.17 233,-101.17 233,-98.17 233,-98.17 233,-92.17 233,-92.17 233,-89.17 236,-86.17 239,-86.17 239,-86.17 281,-86.17 281,-86.17 284,-86.17 287,-89.17 287,-92.17 287,-92.17 287,-98.17 287,-98.17 287,-101.17 284,-104.17 281,-104.17"/>
<text text-anchor="middle" x="260" y="-92.97" font-family="Helvetica,sans-Serif" font-size="9.00" fill="grey">path</text>
</a>
</g>
</g>
<!-- src/actions/fileNameToStream.ts -->
<g id="node11" class="node">
<title>src/actions/fileNameToStream.ts</title>
<g id="a_node11"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/src/actions/fileNameToStream.ts" xlink:title="fileNameToStream.ts">
<path fill="#ddfeff" stroke="black" d="M304.5,-332.17C304.5,-332.17 215.5,-332.17 215.5,-332.17 212.5,-332.17 209.5,-329.17 209.5,-326.17 209.5,-326.17 209.5,-320.17 209.5,-320.17 209.5,-317.17 212.5,-314.17 215.5,-314.17 215.5,-314.17 304.5,-314.17 304.5,-314.17 307.5,-314.17 310.5,-317.17 310.5,-320.17 310.5,-320.17 310.5,-326.17 310.5,-326.17 310.5,-329.17 307.5,-332.17 304.5,-332.17"/>
<text text-anchor="start" x="217.5" y="-320.97" font-family="Helvetica,sans-Serif" font-size="9.00">fileNameToStream.ts</text>
</a>
</g>
</g>
<!-- src/actions/fileNameToStream.ts->fs -->
<g id="edge1" class="edge">
<title>src/actions/fileNameToStream.ts->fs</title>
<path fill="none" stroke="#000000" stroke-dasharray="5,2" stroke-opacity="0.200000" d="M310.65,-318.13C321.88,-314.83 332.88,-309.55 341,-301.17 351.51,-290.34 345.11,-282.75 349,-268.17 356.17,-241.27 365.44,-210.17 370.9,-192.18"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="372.99,-192.53 372.73,-186.18 368.97,-191.3 372.99,-192.53"/>
</g>
<!-- src/actions/formatError.ts -->
<g id="node12" class="node">
<title>src/actions/formatError.ts</title>
<g id="a_node12"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/src/actions/formatError.ts" xlink:title="formatError.ts">
<path fill="#ddfeff" stroke="black" d="M163.5,-392.17C163.5,-392.17 104.5,-392.17 104.5,-392.17 101.5,-392.17 98.5,-389.17 98.5,-386.17 98.5,-386.17 98.5,-380.17 98.5,-380.17 98.5,-377.17 101.5,-374.17 104.5,-374.17 104.5,-374.17 163.5,-374.17 163.5,-374.17 166.5,-374.17 169.5,-377.17 169.5,-380.17 169.5,-380.17 169.5,-386.17 169.5,-386.17 169.5,-389.17 166.5,-392.17 163.5,-392.17"/>
<text text-anchor="start" x="106.5" y="-380.97" font-family="Helvetica,sans-Serif" font-size="9.00">formatError.ts</text>
</a>
</g>
</g>
<!-- src/actions/index.ts -->
<g id="node13" class="node">
<title>src/actions/index.ts</title>
<g id="a_node13"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/src/actions/index.ts" xlink:title="index.ts">
<path fill="#ddfeff" stroke="black" d="M155,-362.17C155,-362.17 113,-362.17 113,-362.17 110,-362.17 107,-359.17 107,-356.17 107,-356.17 107,-350.17 107,-350.17 107,-347.17 110,-344.17 113,-344.17 113,-344.17 155,-344.17 155,-344.17 158,-344.17 161,-347.17 161,-350.17 161,-350.17 161,-356.17 161,-356.17 161,-359.17 158,-362.17 155,-362.17"/>
<text text-anchor="start" x="118" y="-350.97" font-family="Helvetica,sans-Serif" font-size="9.00">index.ts</text>
</a>
</g>
</g>
<!-- src/actions/index.ts->node_modules/get-stream -->
<g id="edge5" class="edge">
<title>src/actions/index.ts->node_modules/get-stream</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M161.21,-347.71C166.15,-345.52 170.77,-342.46 174,-338.17 193.87,-311.8 164.65,-214.47 187,-190.17 247.62,-124.26 365.28,-132.82 424.15,-142.18"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="424.09,-144.3 430.35,-143.2 424.77,-140.15 424.09,-144.3"/>
</g>
<!-- src/actions/index.ts->node_modules/lodash -->
<g id="edge6" class="edge">
<title>src/actions/index.ts->node_modules/lodash</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M161.29,-347.77C166.22,-345.58 170.82,-342.5 174,-338.17 200.9,-301.57 154.74,-166.15 187,-134.17 220,-101.45 362.44,-110.07 427.21,-115.89"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="427.07,-117.98 433.23,-116.44 427.45,-113.8 427.07,-117.98"/>
</g>
<!-- src/actions/index.ts->node_modules/mscgenjs -->
<g id="edge7" class="edge">
<title>src/actions/index.ts->node_modules/mscgenjs</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M161.16,-347.67C166.1,-345.49 170.74,-342.43 174,-338.17 190.98,-316 166.39,-232.02 187,-213.17 221.07,-182 361.62,-196.04 426.46,-204.47"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="426.27,-206.56 432.49,-205.26 426.82,-202.4 426.27,-206.56"/>
</g>
<!-- src/actions/index.ts->src/actions/fileNameToStream.ts -->
<g id="edge3" class="edge">
<title>src/actions/index.ts->src/actions/fileNameToStream.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M161.08,-345.23C169.34,-342.83 178.52,-340.28 187,-338.17 193.45,-336.57 200.26,-335 207.01,-333.52"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="207.76,-335.5 213.18,-332.18 206.87,-331.4 207.76,-335.5"/>
</g>
<!-- src/types.d.ts -->
<g id="node14" class="node">
<title>src/types.d.ts</title>
<g id="a_node14"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/src/types.d.ts" xlink:title="types.d.ts">
<path fill="#ddfeff" stroke="black" d="M398,-334.17C398,-334.17 355,-334.17 355,-334.17 352,-334.17 349,-331.17 349,-328.17 349,-328.17 349,-322.17 349,-322.17 349,-319.17 352,-316.17 355,-316.17 355,-316.17 398,-316.17 398,-316.17 401,-316.17 404,-319.17 404,-322.17 404,-322.17 404,-328.17 404,-328.17 404,-331.17 401,-334.17 398,-334.17"/>
<text text-anchor="start" x="357" y="-322.97" font-family="Helvetica,sans-Serif" font-size="9.00">types.d.ts</text>
</a>
</g>
</g>
<!-- src/actions/index.ts->src/types.d.ts -->
<g id="edge2" class="edge">
<title>src/actions/index.ts->src/types.d.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M158.65,-362.18C198.49,-375.8 280.54,-397.18 341,-368.17 353.12,-362.36 362.32,-349.98 368.16,-339.99"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="370.16,-340.73 371.21,-334.46 366.48,-338.7 370.16,-340.73"/>
</g>
<!-- src/actions/render.ts -->
<g id="node15" class="node">
<title>src/actions/render.ts</title>
<g id="a_node15"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/src/actions/render.ts" xlink:title="render.ts">
<path fill="#ddfeff" stroke="black" d="M281,-362.17C281,-362.17 239,-362.17 239,-362.17 236,-362.17 233,-359.17 233,-356.17 233,-356.17 233,-350.17 233,-350.17 233,-347.17 236,-344.17 239,-344.17 239,-344.17 281,-344.17 281,-344.17 284,-344.17 287,-347.17 287,-350.17 287,-350.17 287,-356.17 287,-356.17 287,-359.17 284,-362.17 281,-362.17"/>
<text text-anchor="start" x="241.5" y="-350.97" font-family="Helvetica,sans-Serif" font-size="9.00">render.ts</text>
</a>
</g>
</g>
<!-- src/actions/index.ts->src/actions/render.ts -->
<g id="edge4" class="edge">
<title>src/actions/index.ts->src/actions/render.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M161.3,-353.17C180.37,-353.17 206.27,-353.17 226.62,-353.17"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="226.74,-355.27 232.74,-353.17 226.74,-351.07 226.74,-355.27"/>
</g>
<!-- src/types.d.ts->node_modules/mscgenjs -->
<g id="edge28" class="edge">
<title>src/types.d.ts->node_modules/mscgenjs</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M389.12,-316.13C396.96,-309.33 406.79,-299.31 412,-288.17 424.14,-262.21 402.29,-246.71 420,-224.17 421.88,-221.78 424.2,-219.76 426.75,-218.07"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="428.03,-219.76 432.27,-215.03 426,-216.08 428.03,-219.76"/>
</g>
<!-- src/actions/render.ts->node_modules/puppeteer -->
<g id="edge9" class="edge">
<title>src/actions/render.ts->node_modules/puppeteer</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M287.26,-355.44C304.87,-355.44 327.28,-352.22 341,-338.17 356.42,-322.39 340.37,-309.48 349,-289.17 369.62,-240.66 377.91,-225.9 420,-194.17 421.64,-192.94 423.39,-191.79 425.22,-190.73"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="426.49,-192.44 430.85,-187.81 424.56,-188.71 426.49,-192.44"/>
</g>
<!-- src/actions/render.ts->src/types.d.ts -->
<g id="edge8" class="edge">
<title>src/actions/render.ts->src/types.d.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M287.21,-349.45C302.96,-346.91 323.31,-343.12 341,-338.17 342.97,-337.62 344.99,-337 347.01,-336.35"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="348.05,-338.21 353.05,-334.28 346.69,-334.24 348.05,-338.21"/>
</g>
<!-- src/actions/showLicense.ts -->
<g id="node16" class="node">
<title>src/actions/showLicense.ts</title>
<g id="a_node16"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/src/actions/showLicense.ts" xlink:title="showLicense.ts">
<path fill="#ddfeff" stroke="black" d="M168,-332.17C168,-332.17 100,-332.17 100,-332.17 97,-332.17 94,-329.17 94,-326.17 94,-326.17 94,-320.17 94,-320.17 94,-317.17 97,-314.17 100,-314.17 100,-314.17 168,-314.17 168,-314.17 171,-314.17 174,-317.17 174,-320.17 174,-320.17 174,-326.17 174,-326.17 174,-329.17 171,-332.17 168,-332.17"/>
<text text-anchor="start" x="102" y="-320.97" font-family="Helvetica,sans-Serif" font-size="9.00">showLicense.ts</text>
</a>
</g>
</g>
<!-- src/cli/index.ts -->
<g id="node17" class="node">
<title>src/cli/index.ts</title>
<g id="a_node17"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/src/cli/index.ts" xlink:title="index.ts">
<path fill="#ddfeff" stroke="black" d="M72,-272.17C72,-272.17 30,-272.17 30,-272.17 27,-272.17 24,-269.17 24,-266.17 24,-266.17 24,-260.17 24,-260.17 24,-257.17 27,-254.17 30,-254.17 30,-254.17 72,-254.17 72,-254.17 75,-254.17 78,-257.17 78,-260.17 78,-260.17 78,-266.17 78,-266.17 78,-269.17 75,-272.17 72,-272.17"/>
<text text-anchor="start" x="35" y="-260.97" font-family="Helvetica,sans-Serif" font-size="9.00">index.ts</text>
</a>
</g>
</g>
<!-- src/cli/index.ts->node_modules/commander -->
<g id="edge17" class="edge">
<title>src/cli/index.ts->node_modules/commander</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M53.65,-254.1C60.98,-216.88 94.41,-75.45 187,-26.17 275.78,21.08 324.07,-1.37 412,-50.17 424.44,-57.08 436.8,-67.37 445.8,-75.64"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="444.62,-77.42 450.43,-80 447.5,-74.36 444.62,-77.42"/>
</g>
<!-- src/cli/index.ts->node_modules/semver -->
<g id="edge18" class="edge">
<title>src/cli/index.ts->node_modules/semver</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M52.3,-272.47C53.62,-307.39 60.07,-430.16 86,-457.17 117.81,-490.32 141.32,-474.26 187,-479.17 286.43,-489.88 334.29,-541.11 412,-478.17 442.39,-453.56 454.9,-328.45 458.4,-284.48"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="460.5,-284.52 458.87,-278.37 456.32,-284.19 460.5,-284.52"/>
</g>
<!-- src/cli/index.ts->package.json -->
<g id="edge10" class="edge">
<title>src/cli/index.ts->package.json</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M56.33,-253.95C61.88,-243 72.42,-224.75 86,-213.17 90.63,-209.23 96.08,-205.83 101.61,-202.98"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="102.65,-204.8 107.13,-200.29 100.81,-201.03 102.65,-204.8"/>
</g>
<!-- src/cli/index.ts->src/actions/formatError.ts -->
<g id="edge12" class="edge">
<title>src/cli/index.ts->src/actions/formatError.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M52.29,-272.47C53.42,-292.74 58.98,-341.27 86,-368.17 88.09,-370.25 90.47,-372.05 93.02,-373.59"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="92.17,-375.52 98.46,-376.42 94.11,-371.79 92.17,-375.52"/>
</g>
<!-- src/cli/index.ts->src/actions/index.ts -->
<g id="edge11" class="edge">
<title>src/cli/index.ts->src/actions/index.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M53.67,-272.46C57,-288.23 65.92,-320.31 86,-338.17 90.23,-341.94 95.41,-344.76 100.76,-346.87"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="100.25,-348.91 106.61,-348.89 101.63,-344.94 100.25,-348.91"/>
</g>
<!-- src/cli/index.ts->src/types.d.ts -->
<g id="edge14" class="edge">
<title>src/cli/index.ts->src/types.d.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M52.53,-272.57C54.5,-303.66 62.54,-402.22 86,-421.17 174.17,-492.38 248.3,-486.37 341,-421.17 367.13,-402.8 373.56,-362.67 375.09,-340.56"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="377.2,-340.42 375.42,-334.32 373,-340.2 377.2,-340.42"/>
</g>
<!-- src/cli/index.ts->src/actions/showLicense.ts -->
<g id="edge13" class="edge">
<title>src/cli/index.ts->src/actions/showLicense.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M58.44,-272.27C64.72,-280.62 74.92,-292.93 86,-301.17 91.1,-304.96 96.95,-308.33 102.76,-311.23"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="102.2,-313.29 108.52,-313.96 104,-309.49 102.2,-313.29"/>
</g>
<!-- src/cli/normalize.ts -->
<g id="node18" class="node">
<title>src/cli/normalize.ts</title>
<g id="a_node18"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/src/cli/normalize.ts" xlink:title="normalize.ts">
<path fill="#ddfeff" stroke="black" d="M161,-242.17C161,-242.17 107,-242.17 107,-242.17 104,-242.17 101,-239.17 101,-236.17 101,-236.17 101,-230.17 101,-230.17 101,-227.17 104,-224.17 107,-224.17 107,-224.17 161,-224.17 161,-224.17 164,-224.17 167,-227.17 167,-230.17 167,-230.17 167,-236.17 167,-236.17 167,-239.17 164,-242.17 161,-242.17"/>
<text text-anchor="start" x="109" y="-230.97" font-family="Helvetica,sans-Serif" font-size="9.00">normalize.ts</text>
</a>
</g>
</g>
<!-- src/cli/index.ts->src/cli/normalize.ts -->
<g id="edge15" class="edge">
<title>src/cli/index.ts->src/cli/normalize.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M71.63,-254.09C76.3,-252.05 81.29,-249.96 86,-248.17 89.57,-246.82 93.33,-245.48 97.1,-244.19"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="97.97,-246.12 103,-242.22 96.64,-242.13 97.97,-246.12"/>
</g>
<!-- src/cli/validations.ts -->
<g id="node19" class="node">
<title>src/cli/validations.ts</title>
<g id="a_node19"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/src/cli/validations.ts" xlink:title="validations.ts">
<path fill="#ddfeff" stroke="black" d="M163,-272.17C163,-272.17 105,-272.17 105,-272.17 102,-272.17 99,-269.17 99,-266.17 99,-266.17 99,-260.17 99,-260.17 99,-257.17 102,-254.17 105,-254.17 105,-254.17 163,-254.17 163,-254.17 166,-254.17 169,-257.17 169,-260.17 169,-260.17 169,-266.17 169,-266.17 169,-269.17 166,-272.17 163,-272.17"/>
<text text-anchor="start" x="107" y="-260.97" font-family="Helvetica,sans-Serif" font-size="9.00">validations.ts</text>
</a>
</g>
</g>
<!-- src/cli/index.ts->src/cli/validations.ts -->
<g id="edge16" class="edge">
<title>src/cli/index.ts->src/cli/validations.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M78.07,-263.17C82.76,-263.17 87.74,-263.17 92.71,-263.17"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="92.99,-265.27 98.99,-263.17 92.99,-261.07 92.99,-265.27"/>
</g>
<!-- src/cli/normalize.ts->node_modules/commander -->
<g id="edge20" class="edge">
<title>src/cli/normalize.ts->node_modules/commander</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M154.97,-224.01C162.19,-219.66 169.63,-213.73 174,-206.17 191.21,-176.45 161.71,-75.41 187,-52.17 237.39,-5.86 273.34,-41.86 341,-52.17 373.02,-57.05 408.27,-68.95 431.94,-77.95"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="431.34,-79.97 437.7,-80.17 432.85,-76.05 431.34,-79.97"/>
</g>
<!-- src/cli/normalize.ts->node_modules/mscgenjs -->
<g id="edge21" class="edge">
<title>src/cli/normalize.ts->node_modules/mscgenjs</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M154.9,-223.97C162.11,-219.61 169.56,-213.69 174,-206.17 188.33,-181.94 166.1,-99.03 187,-80.17 237.82,-34.33 278.75,-51.73 341,-80.17 384.85,-100.21 389.77,-119.4 412,-162.17 418.76,-175.18 410.26,-183.21 420,-194.17 421.97,-196.39 424.3,-198.28 426.82,-199.89"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="425.96,-201.81 432.24,-202.82 427.96,-198.12 425.96,-201.81"/>
</g>
<!-- src/cli/normalize.ts->path -->
<g id="edge22" class="edge">
<title>src/cli/normalize.ts->path</title>
<path fill="none" stroke="#000000" stroke-dasharray="5,2" stroke-opacity="0.200000" d="M154.36,-224.13C161.67,-219.73 169.34,-213.75 174,-206.17 195.89,-170.64 159.1,-144.21 187,-113.17 196.86,-102.21 212.3,-97.45 226.36,-95.54"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="226.95,-97.59 232.69,-94.85 226.5,-93.41 226.95,-97.59"/>
</g>
<!-- src/cli/normalize.ts->src/types.d.ts -->
<g id="edge19" class="edge">
<title>src/cli/normalize.ts->src/types.d.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M165.75,-242.29C168.74,-243.95 171.56,-245.89 174,-248.17 184.02,-257.54 175.73,-268.35 187,-276.17 215.2,-295.75 310.08,-273.27 341,-288.17 351.29,-293.13 360.02,-302.59 366.13,-310.71"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="364.73,-312.37 369.92,-316.04 368.16,-309.93 364.73,-312.37"/>
</g>
<!-- src/cli/validations.ts->fs -->
<g id="edge26" class="edge">
<title>src/cli/validations.ts->fs</title>
<path fill="none" stroke="#000000" stroke-dasharray="5,2" stroke-opacity="0.200000" d="M167.01,-254.08C169.61,-252.43 172,-250.48 174,-248.17 191.01,-228.53 167.3,-208.12 187,-191.17 230.31,-153.92 301.87,-160.86 343.24,-169.11"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="343.06,-171.22 349.36,-170.39 343.92,-167.11 343.06,-171.22"/>
</g>
<!-- src/cli/validations.ts->node_modules/ajv -->
<g id="edge25" class="edge">
<title>src/cli/validations.ts->node_modules/ajv</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M147.91,-272.45C156.9,-279.71 168.28,-290.65 174,-303.17 188.27,-334.41 161.71,-433.93 187,-457.17 223.81,-491.01 375.96,-491.83 412,-457.17 428.27,-441.53 406.82,-272.5 420,-254.17 422.03,-251.34 424.67,-249.05 427.62,-247.19"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="428.85,-248.91 433.21,-244.28 426.91,-245.19 428.85,-248.91"/>
</g>
<!-- src/cli/validations.ts->node_modules/mscgenjs -->
<g id="edge27" class="edge">
<title>src/cli/validations.ts->node_modules/mscgenjs</title>
<path fill="none" stroke="#000000" stroke-opacity="0.200000" d="M147.44,-272.19C156.44,-279.47 168.04,-290.54 174,-303.17 185.27,-327.03 168.18,-402.68 187,-421.17 222.74,-456.3 375.9,-470.93 412,-436.17 428.98,-419.82 406.25,-243.32 420,-224.17 421.83,-221.63 424.15,-219.51 426.74,-217.76"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-opacity="0.200000" points="428.16,-219.37 432.39,-214.63 426.12,-215.7 428.16,-219.37"/>
</g>
<!-- src/cli/validations.ts->src/types.d.ts -->
<g id="edge23" class="edge">
<title>src/cli/validations.ts->src/types.d.ts</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M151.33,-272.4C161.32,-277.62 174.54,-283.75 187,-287.17 253.36,-305.39 276.03,-280.51 341,-303.17 347.24,-305.35 353.5,-308.85 358.94,-312.42"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="357.95,-314.29 364.08,-315.97 360.33,-310.83 357.95,-314.29"/>
</g>
<!-- src/cli/puppeteer-options.schema.json -->
<g id="node20" class="node">
<title>src/cli/puppeteer-options.schema.json</title>
<g id="a_node20"><a xlink:href="https://github.com/mscgenjs/mscgenjs-cli/blob/develop/src/cli/puppeteer-options.schema.json" xlink:title="puppeteer-options.schema.json">
<path fill="#ffee44" stroke="black" d="M327,-270.17C327,-270.17 193,-270.17 193,-270.17 190,-270.17 187,-267.17 187,-264.17 187,-264.17 187,-258.17 187,-258.17 187,-255.17 190,-252.17 193,-252.17 193,-252.17 327,-252.17 327,-252.17 330,-252.17 333,-255.17 333,-258.17 333,-258.17 333,-264.17 333,-264.17 333,-267.17 330,-270.17 327,-270.17"/>
<text text-anchor="start" x="195" y="-258.97" font-family="Helvetica,sans-Serif" font-size="9.00">puppeteer-options.schema.json</text>
</a>
</g>
</g>
<!-- src/cli/validations.ts->src/cli/puppeteer-options.schema.json -->
<g id="edge24" class="edge">
<title>src/cli/validations.ts->src/cli/puppeteer-options.schema.json</title>
<path fill="none" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" d="M169.21,-262.62C172.88,-262.56 176.71,-262.5 180.64,-262.44"/>
<polygon fill="#000000" fill-opacity="0.200000" stroke="#000000" stroke-width="2" stroke-opacity="0.200000" points="180.92,-264.53 186.88,-262.34 180.85,-260.33 180.92,-264.53"/>
</g>
</g>
</svg>
<script>document.addEventListener("contextmenu", getSelectHandler(title2ElementMap));
document.addEventListener("mouseover", getHoverHandler(title2ElementMap));
document.addEventListener("keydown", keyboardEventHandler);
var gMode = new Mode();
var title2ElementMap = (function makeElementMap() {
/** @type {NodeListOf<SVGGElement>} */
var nodes = document.querySelectorAll(".node");
/** @type {NodeListOf<SVGGElement>} */
var edges = document.querySelectorAll(".edge");
return new Title2ElementMap(edges, nodes);
})();
function getHoverHandler() {
/** @type {string} */
var currentHighlightedTitle;
/** @param {MouseEvent} pMouseEvent */
return function hoverHighlightHandler(pMouseEvent) {
var closestNodeOrEdge = pMouseEvent.target.closest(".edge, .node");
var closestTitleText = getTitleText(closestNodeOrEdge);
if (
!(currentHighlightedTitle === closestTitleText) &&
gMode.get() === gMode.HOVER
) {
resetNodesAndEdges();
addHighlight(closestNodeOrEdge);
title2ElementMap.get(closestTitleText).forEach(addHighlight);
currentHighlightedTitle = closestTitleText;
}
};
}
function getSelectHandler() {
/** @type {string} */
var currentHighlightedTitle;
/** @param {MouseEvent} pMouseEvent */
return function selectHighlightHandler(pMouseEvent) {
pMouseEvent.preventDefault();
var closestNodeOrEdge = pMouseEvent.target.closest(".edge, .node");
var closestTitleText = getTitleText(closestNodeOrEdge);
if (!!closestNodeOrEdge) {
gMode.setToSelect();
} else {
gMode.setToHover();
}
if (!(currentHighlightedTitle === closestTitleText)) {
resetNodesAndEdges();
addHighlight(closestNodeOrEdge);
title2ElementMap.get(closestTitleText).forEach(addHighlight);
currentHighlightedTitle = closestTitleText;
}
};
}
function Mode() {
var HOVER = 1;
var SELECT = 2;
function setToHover() {
this._mode = HOVER;
}
function setToSelect() {
this._mode = SELECT;
}
function get() {
return this._mode || HOVER;
}
return {
HOVER: HOVER,
SELECT: SELECT,
setToHover: setToHover,
setToSelect: setToSelect,
get: get,
};
}
/**
*
* @param {SVGGelement[]} pEdges
* @param {SVGGElement[]} pNodes
* @return {{get: (pTitleText:string) => SVGGElement[]}}
*/
function Title2ElementMap(pEdges, pNodes) {
/* {{[key: string]: SVGGElement[]}} */
var elementMap = buildMap(pEdges, pNodes);
/**
* @param {NodeListOf<SVGGElement>} pEdges
* @param {NodeListOf<SVGGElement>} pNodes
* @return {{[key: string]: SVGGElement[]}}
*/
function buildMap(pEdges, pNodes) {
var title2NodeMap = buildTitle2NodeMap(pNodes);
return nodeListToArray(pEdges).reduce(addEdgeToMap(title2NodeMap), {});
}
/**
* @param {NodeListOf<SVGGElement>} pNodes
* @return {{[key: string]: SVGGElement}}
*/
function buildTitle2NodeMap(pNodes) {
return nodeListToArray(pNodes).reduce(addNodeToMap, {});
}
function addNodeToMap(pMap, pNode) {
var titleText = getTitleText(pNode);
if (titleText) {
pMap[titleText] = pNode;
}
return pMap;
}
function addEdgeToMap(pNodeMap) {
return function (pEdgeMap, pEdge) {
/** @type {string} */
var titleText = getTitleText(pEdge);
if (titleText) {
var edge = pryEdgeFromTitle(titleText);
pEdgeMap[titleText] = [pNodeMap[edge.from], pNodeMap[edge.to]];
(pEdgeMap[edge.from] || (pEdgeMap[edge.from] = [])).push(pEdge);
(pEdgeMap[edge.to] || (pEdgeMap[edge.to] = [])).push(pEdge);
}
return pEdgeMap;
};
}
/**
*
* @param {string} pString
* @return {{from?: string; to?:string;}}
*/
function pryEdgeFromTitle(pString) {
var nodeNames = pString.split(/\s*->\s*/);
return {
from: nodeNames.shift(),
to: nodeNames.shift(),
};
}
/**
*
* @param {string} pTitleText
* @return {SVGGElement[]}
*/
function get(pTitleText) {
return (pTitleText && elementMap[pTitleText]) || [];
}
return {
get: get,
};
}
/**
* @param {SVGGElement} pGElement
* @return {string?}
*/
function getTitleText(pGElement) {
/** @type {SVGTitleElement} */
var title = pGElement && pGElement.querySelector("title");
/** @type {string} */
var titleText = title && title.textContent;
if (titleText) {
titleText = titleText.trim();
}
return titleText;
}
/**
* @param {NodeListOf<Element>} pNodeList
* @return {Element[]}
*/
function nodeListToArray(pNodeList) {
var lReturnValue = [];
pNodeList.forEach(function (pElement) {
lReturnValue.push(pElement);
});
return lReturnValue;
}
function resetNodesAndEdges() {
nodeListToArray(document.querySelectorAll(".current")).forEach(
removeHighlight
);
}
/**
* @param {SVGGElement} pGElement
*/
function removeHighlight(pGElement) {
if (pGElement && pGElement.classList) {
pGElement.classList.remove("current");
}
}
/**
* @param {SVGGElement} pGroup
*/
function addHighlight(pGroup) {
if (pGroup && pGroup.classList) {
pGroup.classList.add("current");
}
}
var hints = {
HIDDEN: 1,
SHOWN: 2,
state: this.HIDDEN,
show: function () {
document.getElementById("hints").removeAttribute("style");
hints.state = hints.SHOWN;
},
hide: function () {
document.getElementById("hints").style = "display:none";
hints.state = hints.HIDDEN;
},
toggle: function () {
if ((hints.state || hints.HIDDEN) === hints.HIDDEN) {
hints.show();
} else {
hints.hide();
}
},
};
/** @param {KeyboardEvent} pKeyboardEvent */
function keyboardEventHandler(pKeyboardEvent) {
if (pKeyboardEvent.key === "Escape") {
resetNodesAndEdges();
gMode.setToHover();
hints.hide();
}
if (pKeyboardEvent.key === "F1") {
pKeyboardEvent.preventDefault();
hints.toggle();
}
}
document.getElementById("close-hints").addEventListener("click", hints.hide);
document.getElementById("button_help").addEventListener("click", hints.toggle);
</script> </body>
</html>