Passed
Push — master ( e14e22...172c7d )
by
unknown
03:44
created

graph-nodes.ts ➔ createNodeLabelPath   B

Complexity

Conditions 7

Size

Total Lines 28
Code Lines 22

Duplication

Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
eloc 22
dl 0
loc 28
rs 7.952
c 0
b 0
f 0
cc 7
1
import { DependencyLink, DependencyNode, NodeSelection, RenderedDependencyNode } from '../components/types';
2
import { BASE_FONT_SIZE, Colors } from '../utils/AppConsts';
3
import { select } from 'd3-selection';
4
import { selectAllNodes } from '../utils/helpers/Selectors';
5
6
export function createNodeLabels(labelNodesGroup: NodeSelection<SVGGElement>, nodes: DependencyNode[]) {
7
    labelNodesGroup
8
        .selectAll('g')
9
        .data(nodes)
10
        .append<SVGPathElement>('svg:path')
11
        .attr('class', 'label')
12
        .attr('fill', Colors.LIGHT_GREY)
13
        .attr('d', function({ isConsumer, isProvider }) {
14
            return createNodeLabelPath(this, isConsumer, isProvider);
15
        });
16
}
17
18
export function createNodes(labelNodesGroup: NodeSelection<SVGGElement>, nodes: DependencyNode[]) {
19
    return labelNodesGroup
20
        .selectAll<HTMLElement, DependencyNode>('g#labels')
21
        .data(nodes)
22
        .enter()
23
        .append<SVGGElement>('g')
24
        .attr('cursor', 'pointer')
25
        .append('text')
26
        .attr('font-size', BASE_FONT_SIZE)
27
        .attr('fill', Colors.BASIC_TEXT)
28
        .attr('text-anchor', 'middle')
29
        .text(d => d.name);
30
}
31
32
export function getTextDimensions(textElement: SVGTextElement | null) {
33
    if (textElement) {
34
        return select<SVGTextElement, DependencyNode>(textElement)
35
            .node()
36
            ?.getBBox();
37
    }
38
}
39
40
export function getNodeDimensions(selectedNode: DependencyNode): { width: number; height: number } {
41
    const foundNode = selectAllNodes()
42
        .filter((node: DependencyNode) => node.x === selectedNode.x && node.y === selectedNode.y)
43
        .node();
44
    return foundNode ? foundNode.getBBox() : { width: 200, height: 25 };
45
}
46
47
export function findMaxDependencyLevel(labelNodesGroup: NodeSelection<SVGGElement>) {
48
    return (
49
        Math.max(
50
            ...labelNodesGroup
51
                .selectAll<HTMLElement, DependencyNode>('g')
52
                .filter((node: DependencyNode) => node.level > 0)
53
                .data()
54
                .map((node: DependencyNode) => node.level)
55
        ) - 1
56
    );
57
}
58
59
export function areNodesConnected(a: DependencyNode, b: DependencyNode, links: DependencyLink[]) {
60
    return (
61
        a.index === b.index ||
62
        links.some(
63
            link =>
64
                (link.source.index === a.index && link.target.index === b.index) ||
65
                (link.source.index === b.index && link.target.index === a.index)
66
        )
67
    );
68
}
69
70
export function getHighLightedLabelColor(node: DependencyNode) {
71
    const { isConsumer, isProvider, level } = node;
72
73
    if (level === 1) {
74
        return Colors.CLIFTON_NAVY;
75
    }
76
77
    if (isConsumer || isProvider) {
78
        return Colors.MILLENNIUM_MINT;
79
    }
80
81
    return Colors.LIGHT_GREY;
82
}
83
84
export function getRenderedNodes(nodes: DependencyNode[]): RenderedDependencyNode[] {
85
    return nodes.filter((node): node is RenderedDependencyNode => node.x !== undefined && node.y !== undefined && node.width !== undefined);
86
}
87
88
export function createNodeLabelPath(node: SVGPathElement | null, isConsumer: boolean, isProvider: boolean) {
89
    const labelText = (node?.previousSibling || node?.nextSibling) as SVGTextElement | null;
90
    const labelTextDimensions = getTextDimensions(labelText);
91
92
    if (!labelTextDimensions) {
93
        return '';
94
    }
95
96
    const labelTextWidth = labelTextDimensions.width;
97
98
    if (isConsumer && isProvider) {
99
        return `M${-labelTextWidth / 2 + 4.5},35l9.37,14.59L${-labelTextWidth / 2 + 4.5},64.18h${labelTextWidth +
100
            45}l9-14.59L${labelTextWidth / 2 + 49.5},35H${-labelTextWidth / 2 + 4.5}z`;
101
    }
102
103
    if (isProvider) {
104
        return `M${labelTextWidth / 2 + 49.5},35H${-labelTextWidth / 2 + 4.5}l9.37,14.59L${-labelTextWidth / 2 +
105
            4.5},64.18h${labelTextWidth + 45}`;
106
    }
107
108
    if (isConsumer) {
109
        return `M${-labelTextWidth / 2 + 4.5},64.18h${labelTextWidth + 45}l9.42-14.59L${labelTextWidth / 2 + 49.5},35H${-labelTextWidth /
110
            2 +
111
            4.5}`;
112
    }
113
114
    return `M${-labelTextWidth / 2 + 4.5},64.18h${labelTextWidth + 55}L${labelTextWidth / 2 + 59.5},35H${-labelTextWidth / 2 + 4.5}`;
115
}
116