dependency-cruiser-fork
Version:
Validate and visualize dependencies. With your rules. JavaScript, TypeScript, CoffeeScript. ES6, CommonJS, AMD.
63 lines (60 loc) • 1.71 kB
HTML
<script>
/** @type {SVGGElement} */
var edges = document.querySelectorAll('.edge');
/** @type {SVGGElement} */
var nodes = document.querySelectorAll('.node');
/** @type {{[key: string]: SVGGElement}} */
var nodeMap = {};
nodes.forEach(function (n) {
/** @type {SVGTitleElement} */
var title = n.querySelector('title');
var titleText = title && title.textContent;
if (titleText) {
nodeMap[titleText] = n;
}
});
/** @type {{[key: string]: SVGGElement[]}} */
var edgeMap = {};
edges.forEach(function (e) {
/** @type {SVGTitleElement} */
var title = e.querySelector('title');
var titleText = title && title.textContent;
if (titleText) {
var nodeNames = titleText.split('->');
edgeMap[titleText] = [nodeMap[nodeNames[0]], nodeMap[nodeNames[1]]];
(edgeMap[nodeNames[0]] || (edgeMap[nodeNames[0]] = [])).push(e);
(edgeMap[nodeNames[1]] || (edgeMap[nodeNames[1]] = [])).push(e);
}
});
document.body.onmouseover = onmouseover;
/** @type {string} */
var current;
/** @param ev {MouseEvent} */
function onmouseover(ev) {
/** @type {Element} */
var target = ev.target;
/** @type {SVGGElement} */
var nodeOrEdge = target.closest('.edge, .node');
/** @type {SVGTitleElement} */
var title = nodeOrEdge && nodeOrEdge.querySelector('title');
var titleText = title && title.textContent;
if (current === titleText) {
return;
}
var old = current && edgeMap[current];
if (old) {
old.forEach(function (g) {
g.classList.remove('current');
});
}
current = titleText;
var currentItems = edgeMap[current];
if (currentItems) {
currentItems.forEach(function (g) {
g.classList.add('current');
});
}
}
</script>
</body>
</html>