initializing the graph in a DOM node
[tech-radar.git] / test / graphing / radar-spec.js
1 describe('tr.graphing.Radar', function () {
2 var radar;
3
4 beforeEach(function () {
5 radar = new tr.models.Radar();
6 spyOn(radar, 'cycles').andReturn([]);
7 });
8
9 describe('init', function () {
10 it('appends the svg', function () {
11 var radarGraph, selection;
12
13 radarGraph = new tr.graphing.Radar(500, radar);
14 selection = { append: jasmine.createSpy() };
15 spyOn(d3, 'select').andReturn(selection);
16
17 radarGraph.init();
18
19 expect(selection.append).toHaveBeenCalledWith('svg');
20 });
21
22 it('selects body if no selector provided', function () {
23 var radarGraph;
24
25 radarGraph = new tr.graphing.Radar(500, radar);
26 spyOn(d3, 'select').andCallThrough();
27
28 radarGraph.init();
29
30 expect(d3.select).toHaveBeenCalledWith('body');
31 });
32
33 it('selects the selector if provided', function () {
34 var radarGraph;
35
36 radarGraph = new tr.graphing.Radar(500, radar);
37 spyOn(d3, 'select').andCallThrough();
38
39 radarGraph.init('#radar');
40
41 expect(d3.select).toHaveBeenCalledWith('#radar');
42 });
43 });
44
45 it('sets the size', function () {
46 var svg, radarGraph;
47
48 radarGraph = new tr.graphing.Radar(500, radar);
49 radarGraph.init();
50
51 svg = radarGraph.svg();
52 spyOn(svg, 'attr').andReturn(svg);
53
54 radarGraph.plot();
55
56 expect(svg.attr).toHaveBeenCalledWith('width', 500);
57 expect(svg.attr).toHaveBeenCalledWith('height', 500);
58 });
59
60 describe('lines', function () {
61 it('plots a vertical line in the center', function () {
62 var radarGraph, svg;
63
64 radarGraph = new tr.graphing.Radar(500, radar);
65 radarGraph.init();
66
67 svg = radarGraph.svg();
68 spyOn(svg, 'append').andReturn(svg);
69 spyOn(svg, 'attr').andReturn(svg);
70
71 radarGraph.plot();
72
73 expect(svg.append).toHaveBeenCalledWith('line');
74 expect(svg.attr).toHaveBeenCalledWith('x1', 500 / 2);
75 expect(svg.attr).toHaveBeenCalledWith('y1', 0);
76 expect(svg.attr).toHaveBeenCalledWith('x2', 500 / 2);
77 expect(svg.attr).toHaveBeenCalledWith('y2', 500);
78 expect(svg.attr).toHaveBeenCalledWith('stroke-width', 14);
79 });
80
81 it('plots a horizontal line in the center', function () {
82 var svg, radarGraph;
83
84 radarGraph = new tr.graphing.Radar(500, radar);
85 radarGraph.init();
86
87 svg = radarGraph.svg();
88 spyOn(svg, 'append').andReturn(svg);
89 spyOn(svg, 'attr').andReturn(svg);
90
91 radarGraph.plot();
92
93 expect(svg.append).toHaveBeenCalledWith('line');
94 expect(svg.attr).toHaveBeenCalledWith('x1', 0);
95 expect(svg.attr).toHaveBeenCalledWith('y1', 500 / 2);
96 expect(svg.attr).toHaveBeenCalledWith('x2', 500);
97 expect(svg.attr).toHaveBeenCalledWith('y2', 500 / 2);
98 expect(svg.attr).toHaveBeenCalledWith('stroke-width', 14);
99 });
100 });
101
102 describe('circles', function () {
103 var svg, radarGraph;
104
105 beforeEach(function () {
106 var radar;
107
108 radar = new tr.models.Radar();
109 spyOn(radar, 'cycles').andReturn([
110 new tr.models.Cycle('Adopt'),
111 new tr.models.Cycle('Hold')
112 ]);
113 radarGraph = new tr.graphing.Radar(500, radar);
114 radarGraph.init();
115
116 svg = radarGraph.svg();
117 spyOn(svg, 'append').andReturn(svg);
118 spyOn(svg, 'attr').andReturn(svg);
119 });
120
121 it('plots the circles for the cycles', function () {
122 radarGraph.plot();
123
124 expect(svg.append).toHaveBeenCalledWith('circle');
125 expect(svg.attr).toHaveBeenCalledWith('cx', 500 / 2);
126 expect(svg.attr).toHaveBeenCalledWith('cy', 500 / 2);
127 expect(svg.attr).toHaveBeenCalledWith('r', Math.round(250 / 2));
128
129 expect(svg.append).toHaveBeenCalledWith('circle');
130 expect(svg.attr).toHaveBeenCalledWith('cx', 500 / 2);
131 expect(svg.attr).toHaveBeenCalledWith('cy', 500 / 2);
132 expect(svg.attr).toHaveBeenCalledWith('r', 250);
133 });
134
135 it('adds the name of each cycle for the right side', function () {
136 var center = 500 / 2;
137 spyOn(svg, 'text').andReturn(svg);
138 radarGraph.plot();
139
140 expect(svg.append).toHaveBeenCalledWith('text');
141 expect(svg.attr).toHaveBeenCalledWith('y', center + 4);
142 expect(svg.attr).toHaveBeenCalledWith('x', 0 + 10);
143 expect(svg.text).toHaveBeenCalledWith('Adopt');
144
145 expect(svg.append).toHaveBeenCalledWith('text');
146 expect(svg.attr).toHaveBeenCalledWith('y', center + 4);
147 expect(svg.attr).toHaveBeenCalledWith('x', 0 + (center / 2) + 10);
148 expect(svg.text).toHaveBeenCalledWith('Hold');
149 });
150
151 it('adds the name of each cycle for the right side', function () {
152 var center = 500 / 2;
153 spyOn(svg, 'text').andReturn(svg);
154 radarGraph.plot();
155
156 expect(svg.append).toHaveBeenCalledWith('text');
157 expect(svg.attr).toHaveBeenCalledWith('y', center + 4);
158 expect(svg.attr).toHaveBeenCalledWith('x', 500 - 10);
159 expect(svg.attr).toHaveBeenCalledWith('text-anchor', 'end');
160 expect(svg.text).toHaveBeenCalledWith('Adopt');
161
162 expect(svg.append).toHaveBeenCalledWith('text');
163 expect(svg.attr).toHaveBeenCalledWith('y', center + 4);
164 expect(svg.attr).toHaveBeenCalledWith('x', 500 - (center / 2) - 10);
165 expect(svg.attr).toHaveBeenCalledWith('text-anchor', 'end');
166 expect(svg.text).toHaveBeenCalledWith('Hold');
167 });
168 });
169 });