hacklab/strudel
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

remove graphviz

Browse source
This commit is contained in:
Felix Roos 2024-05-17 18:41:02 +02:00
parent a9fa6f14fb
commit 5f8da04cd8
5 changed files with 96 additions and 55 deletions
Download patch file Download diff file Expand all files Collapse all files

43
packages/tidal/graph.mjs
View file

@ -1,43 +0,0 @@
import { Graphviz } from '@hpcc-js/wasm';
import toDot from 'jgf-dot';
const graphvizLoaded = Graphviz.load();
function walk(node, branch = [0], parent) {
let nodes = [];
let edges = [];
const color = 'white';
const current = {
id: branch.join('-'),
color,
fontcolor: color,
label: node.type.replace('\\', 'lambda'), // backslash kills graphviz..
};
nodes.push(current);
parent && edges.push({ source: parent.id, target: current.id, color });
if (node.children.length) {
node.children.forEach((child, j) => {
const { nodes: childNodes, edges: childEdges } = walk(child, branch.concat([j]), current);
nodes = nodes.concat(childNodes || []);
edges = edges.concat(childEdges || []);
});
}
return { nodes, edges };
}
export async function renderGraph(tree, container) {
const { nodes, edges } = walk(tree.rootNode);
const graphviz = await graphvizLoaded;
let dot = toDot({
graph: {
nodes,
edges,
},
});
dot = dot.split('\n');
dot.splice(1, 0, 'bgcolor="transparent"');
dot.splice(1, 0, 'color="white"');
dot = dot.join('\n');
const svg = await graphviz.layout(dot, 'svg', 'dot', {});
container.innerHTML = svg;
}

1
packages/tidal/index.html
View file

@ -23,7 +23,6 @@
<body style="margin: 0; padding: 0">
<textarea id="code" style="width: 100%; height: 200px"></textarea>
<pre id="result"></pre>
<div id="graph" style="display: flex; width: 100%; margin: auto; justify-content: center"></div>
<script type="module" src="/main.js"></script>
</body>
</html>

9
packages/tidal/main.js
View file

@ -1,12 +1,9 @@
import { run, parse } from 'hs2js';
import { renderGraph } from './graph.mjs';
import { initStrudel, reify, late, samples, stack } from '@strudel/web';
initStrudel({
prebake: () => samples('github:tidalcycles/dirt-samples'),
});
const graphContainer = document.getElementById('graph');
const textarea = document.getElementById('code');
if (window.location.hash) {
textarea.value = atob(window.location.hash.slice(1));
@ -60,12 +57,6 @@ async function update() {
}
console.log('parsed tree');
console.log(tree.rootNode.toString());
try {
renderGraph(tree, graphContainer);
} catch (err) {
console.warn('could not render graph');
console.error(err);
}
try {
let patterns = {};
window.p = (name, pattern) => {

2
packages/tidal/package.json
View file

@ -27,8 +27,6 @@
},
"homepage": "https://github.com/tidalcycles/strudel#readme",
"dependencies": {
"@hpcc-js/wasm": "^2.15.3",
"jgf-dot": "^1.1.1",
"@strudel/web": "workspace:*",
"hs2js": "workspace:*"
},