Skip to content

Commit e409bfe

Browse files
whyboriswhyboris
committed
split graphs into pages
1 parent 4c86832 commit e409bfe

15 files changed

+118
-85
lines changed

‎bin/index.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,6 @@ function showHelpMessage() {
5050
*/
5151
function proceed() {
5252
var functionMap = extract_1.processFiles(withoutNodeModules);
53-
// generateGraphViz(functionMap);
5453
startServer(functionMap);
5554
}
5655
/**
@@ -62,6 +61,8 @@ function startServer(functionMap) {
6261
var app = express();
6362
var path = require('path');
6463
app.use(express.static(path.join(__dirname, '..', 'graphing')));
64+
app.use('/graphviz', express.static(path.join(__dirname, '..', 'graphing/graphviz')));
65+
app.use('/cascade', express.static(path.join(__dirname, '..', 'graphing/cascade')));
6566
app.get('/hi', function (req, res) {
6667
res.json(convert_1.convertForD3(functionMap));
6768
});

‎graphing/graph.js renamed to ‎graphing/cascade/graph.js

File renamed without changes.

‎graphing/cascade/index.html

+77
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
<!DOCTYPE html>
2+
3+
<head>
4+
<title>TypeScript Call Graph</title>
5+
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
6+
<style>
7+
.observablehq--inspect {
8+
display: none;
9+
}
10+
11+
.heading {
12+
font-family: sans-serif;
13+
margin: 20px 5px 0;
14+
}
15+
16+
a {
17+
display: block;
18+
margin: 10px;
19+
font-family: sans-serif;
20+
font-size: 12px;
21+
}
22+
</style>
23+
</head>
24+
25+
<body>
26+
27+
<div id="graph" style="text-align: center;"></div>
28+
29+
<script type="module">
30+
import define from "./index.js";
31+
import { Runtime, Library, Inspector } from "./runtime.js";
32+
33+
const runtime = new Runtime();
34+
const main = runtime.module(define, Inspector.into(document.body));
35+
36+
// Save to SVG & PNG
37+
setTimeout(() => {
38+
// Thank you @gustavohenke for the Gist: https://gist.github.com/gustavohenke/9073132
39+
var svg = document.querySelector("svg");
40+
var svgData = new XMLSerializer().serializeToString(svg);
41+
42+
var canvas = document.createElement("canvas");
43+
var ctx = canvas.getContext("2d");
44+
45+
var svgSize = svg.getBoundingClientRect();
46+
canvas.width = svgSize.width;
47+
canvas.height = svgSize.height;
48+
49+
var img = document.createElement("img");
50+
img.setAttribute("src", "data:image/svg+xml;base64," + btoa(svgData));
51+
52+
img.onload = function () {
53+
ctx.drawImage(img, 0, 0);
54+
55+
const pngBase64 = canvas.toDataURL("image/png");
56+
57+
const a = document.createElement("a");
58+
a.download = "callgraph.png";
59+
a.href = pngBase64;
60+
a.innerHTML = "download as PNG";
61+
document.body.appendChild(a);
62+
63+
const svgBase64 = "data:image/svg+xml;base64," + btoa(svgData);
64+
65+
const b = document.createElement("a");
66+
b.download = "callgraph.svg";
67+
b.href = svgBase64;
68+
b.innerHTML = "download as SVG";
69+
document.body.appendChild(b);
70+
71+
};
72+
73+
}, 350);
74+
75+
76+
</script>
77+
</body>

‎graphing/index.js renamed to ‎graphing/cascade/index.js

File renamed without changes.

‎graphing/runtime.js renamed to ‎graphing/cascade/runtime.js

File renamed without changes.

‎graphing/d3-graphviz.js renamed to ‎graphing/graphviz/d3-graphviz.js

File renamed without changes.

‎graphing/d3-graphviz.js.map renamed to ‎graphing/graphviz/d3-graphviz.js.map

File renamed without changes.

‎graphing/d3.v5.min.js renamed to ‎graphing/graphviz/d3.v5.min.js

File renamed without changes.

‎graphing/graphvizlib.wasm renamed to ‎graphing/graphviz/graphvizlib.wasm

File renamed without changes.

‎graphing/graphviz/index.html

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<!DOCTYPE html>
2+
3+
<head>
4+
<title>TypeScript Call Graph</title>
5+
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
6+
<style>
7+
8+
</style>
9+
</head>
10+
11+
<body>
12+
13+
<script src="./d3.v5.min.js"></script>
14+
<script src="./index.min.js"></script>
15+
<script src="./d3-graphviz.js"></script>
16+
17+
<div id="graph" style="text-align: center;"></div>
18+
19+
<script>
20+
const url = '../dot';
21+
22+
fetch(url).then((response) => {
23+
response.text().then((data) => {
24+
d3.select("#graph").graphviz()
25+
.renderDot(JSON.parse(data));
26+
});
27+
});
28+
</script>
29+
</body>

‎graphing/index.min.js renamed to ‎graphing/graphviz/index.min.js

File renamed without changes.

‎graphing/index.min.js.map renamed to ‎graphing/graphviz/index.min.js.map

File renamed without changes.

‎graphing/index.html

+8-77
Original file line numberDiff line numberDiff line change
@@ -1,91 +1,22 @@
11
<!DOCTYPE html>
2+
23
<head>
34
<title>TypeScript Call Graph</title>
45
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
56
<style>
6-
.observablehq--inspect {
7-
display: none;
8-
}
9-
.heading {
10-
font-family: sans-serif;
11-
margin: 20px 5px 0;
12-
}
13-
a {
14-
display: block;
15-
margin: 10px;
16-
font-family: sans-serif;
17-
font-size: 12px;
18-
}
7+
198
</style>
209
</head>
2110

2211
<body>
12+
<h2>
13+
WELCOME !!!
14+
</h2>
2315

24-
<script src="./d3.v5.min.js"></script>
25-
<script src="./index.min.js"></script>
26-
<script src="./d3-graphviz.js"></script>
27-
28-
<div id="graph" style="text-align: center;"></div>
29-
30-
<script type="module">
31-
import define from "./index.js";
32-
import { Runtime, Library, Inspector } from "./runtime.js";
33-
34-
const runtime = new Runtime();
35-
const main = runtime.module(define, Inspector.into(document.body));
36-
37-
// Save to SVG & PNG
38-
setTimeout(() => {
39-
// Thank you @gustavohenke for the Gist: https://gist.github.com/gustavohenke/9073132
40-
var svg = document.querySelector( "svg" );
41-
var svgData = new XMLSerializer().serializeToString( svg );
42-
43-
var canvas = document.createElement( "canvas" );
44-
var ctx = canvas.getContext( "2d" );
45-
46-
var svgSize = svg.getBoundingClientRect();
47-
canvas.width = svgSize.width;
48-
canvas.height = svgSize.height;
49-
50-
var img = document.createElement( "img" );
51-
img.setAttribute( "src", "data:image/svg+xml;base64," + btoa( svgData ) );
52-
53-
img.onload = function() {
54-
ctx.drawImage( img, 0, 0 );
55-
56-
const pngBase64 = canvas.toDataURL("image/png");
57-
58-
const a = document.createElement("a");
59-
a.download = "callgraph.png";
60-
a.href = pngBase64;
61-
a.innerHTML = "download as PNG";
62-
document.body.appendChild(a);
63-
64-
const svgBase64 = "data:image/svg+xml;base64," + btoa( svgData );
65-
66-
const b = document.createElement("a");
67-
b.download = "callgraph.svg";
68-
b.href = svgBase64;
69-
b.innerHTML = "download as SVG";
70-
document.body.appendChild(b);
71-
72-
};
73-
74-
// const c = document.createElement("img");
75-
// c.src = "temp.png";
76-
// document.body.appendChild(c);
77-
78-
}, 350);
79-
80-
const url = './dot';
16+
<a href="cascade/index.html">Cascade</a>
8117

82-
fetch(url).then((response) => {
83-
response.text().then((data) => {
84-
d3.select("#graph").graphviz()
85-
.renderDot(JSON.parse(data));
86-
});
87-
});
18+
<br>
8819

20+
<a href="graphviz/index.html">Graphviz</a>
8921

90-
</script>
9122
</body>

‎index.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -61,8 +61,6 @@ function showHelpMessage(): void {
6161
function proceed(): void {
6262
const functionMap: Map<string, string[]> = processFiles(withoutNodeModules);
6363

64-
// generateGraphViz(functionMap);
65-
6664
startServer(functionMap);
6765
}
6866

@@ -78,6 +76,8 @@ function startServer(functionMap): void {
7876
const path = require('path');
7977

8078
app.use(express.static(path.join(__dirname, '..', 'graphing')));
79+
app.use('/graphviz', express.static(path.join(__dirname, '..', 'graphing/graphviz')));
80+
app.use('/cascade', express.static(path.join(__dirname, '..', 'graphing/cascade')));
8181

8282
app.get('/hi', function (req, res) {
8383
res.json(convertForD3(functionMap));

‎package-lock.json

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

0 commit comments

Comments
 (0)