describe('tr.graphing.Radar', function () {
var radar;
- function buildSvg() {
- return d3.select("body").append("svg");
- }
-
beforeEach(function () {
radar = new tr.models.Radar();
spyOn(radar, 'cycles').andReturn([]);
});
+ describe('init', function () {
+ it('appends the svg', function () {
+ var radarGraph, selection;
+
+ radarGraph = new tr.graphing.Radar(500, radar);
+ selection = { append: jasmine.createSpy() };
+ spyOn(d3, 'select').andReturn(selection);
+
+ radarGraph.init();
+
+ expect(selection.append).toHaveBeenCalledWith('svg');
+ });
+
+ it('selects body if no selector provided', function () {
+ var radarGraph;
+
+ radarGraph = new tr.graphing.Radar(500, radar);
+ spyOn(d3, 'select').andCallThrough();
+
+ radarGraph.init();
+
+ expect(d3.select).toHaveBeenCalledWith('body');
+ });
+
+ it('selects the selector if provided', function () {
+ var radarGraph;
+
+ radarGraph = new tr.graphing.Radar(500, radar);
+ spyOn(d3, 'select').andCallThrough();
+
+ radarGraph.init('#radar');
+
+ expect(d3.select).toHaveBeenCalledWith('#radar');
+ });
+ });
+
it('sets the size', function () {
var svg, radarGraph;
- svg = buildSvg();
+
+ radarGraph = new tr.graphing.Radar(500, radar);
+ radarGraph.init();
+
+ svg = radarGraph.svg();
spyOn(svg, 'attr').andReturn(svg);
- radarGraph = new tr.graphing.Radar(svg, 500, radar);
+ radarGraph.plot();
expect(svg.attr).toHaveBeenCalledWith('width', 500);
expect(svg.attr).toHaveBeenCalledWith('height', 500);
describe('lines', function () {
it('plots a vertical line in the center', function () {
- var svg, radarGraph;
+ var radarGraph, svg;
- svg = buildSvg();
+ radarGraph = new tr.graphing.Radar(500, radar);
+ radarGraph.init();
+
+ svg = radarGraph.svg();
spyOn(svg, 'append').andReturn(svg);
spyOn(svg, 'attr').andReturn(svg);
- radarGraph = new tr.graphing.Radar(svg, 500, radar);
-
radarGraph.plot();
expect(svg.append).toHaveBeenCalledWith('line');
expect(svg.attr).toHaveBeenCalledWith('y1', 0);
expect(svg.attr).toHaveBeenCalledWith('x2', 500 / 2);
expect(svg.attr).toHaveBeenCalledWith('y2', 500);
- expect(svg.attr).toHaveBeenCalledWith('stroke-width', 5);
+ expect(svg.attr).toHaveBeenCalledWith('stroke-width', 14);
});
it('plots a horizontal line in the center', function () {
var svg, radarGraph;
- svg = buildSvg();
+ radarGraph = new tr.graphing.Radar(500, radar);
+ radarGraph.init();
+
+ svg = radarGraph.svg();
spyOn(svg, 'append').andReturn(svg);
spyOn(svg, 'attr').andReturn(svg);
- radarGraph = new tr.graphing.Radar(svg, 500, radar);
-
radarGraph.plot();
expect(svg.append).toHaveBeenCalledWith('line');
expect(svg.attr).toHaveBeenCalledWith('y1', 500 / 2);
expect(svg.attr).toHaveBeenCalledWith('x2', 500);
expect(svg.attr).toHaveBeenCalledWith('y2', 500 / 2);
- expect(svg.attr).toHaveBeenCalledWith('stroke-width', 5);
+ expect(svg.attr).toHaveBeenCalledWith('stroke-width', 14);
});
});
beforeEach(function () {
var radar;
- svg = buildSvg();
- spyOn(svg, 'append').andReturn(svg);
- spyOn(svg, 'attr').andReturn(svg);
-
radar = new tr.models.Radar();
spyOn(radar, 'cycles').andReturn([
new tr.models.Cycle('Adopt'),
new tr.models.Cycle('Hold')
]);
- radarGraph = new tr.graphing.Radar(svg, 500, radar);
+ radarGraph = new tr.graphing.Radar(500, radar);
+ radarGraph.init();
+
+ svg = radarGraph.svg();
+ spyOn(svg, 'append').andReturn(svg);
+ spyOn(svg, 'attr').andReturn(svg);
});
- it('plots the circles for the cicles', function () {
+ it('plots the circles for the cycles', function () {
radarGraph.plot();
expect(svg.append).toHaveBeenCalledWith('circle');
expect(svg.attr).toHaveBeenCalledWith('cy', 500 / 2);
expect(svg.attr).toHaveBeenCalledWith('r', 250);
});
+
+ it('adds the name of each cycle for the right side', function () {
+ var center = 500 / 2;
+ spyOn(svg, 'text').andReturn(svg);
+ radarGraph.plot();
+
+ expect(svg.append).toHaveBeenCalledWith('text');
+ expect(svg.attr).toHaveBeenCalledWith('y', center + 4);
+ expect(svg.attr).toHaveBeenCalledWith('x', 0 + 10);
+ expect(svg.text).toHaveBeenCalledWith('Adopt');
+
+ expect(svg.append).toHaveBeenCalledWith('text');
+ expect(svg.attr).toHaveBeenCalledWith('y', center + 4);
+ expect(svg.attr).toHaveBeenCalledWith('x', 0 + (center / 2) + 10);
+ expect(svg.text).toHaveBeenCalledWith('Hold');
+ });
+
+ it('adds the name of each cycle for the right side', function () {
+ var center = 500 / 2;
+ spyOn(svg, 'text').andReturn(svg);
+ radarGraph.plot();
+
+ expect(svg.append).toHaveBeenCalledWith('text');
+ expect(svg.attr).toHaveBeenCalledWith('y', center + 4);
+ expect(svg.attr).toHaveBeenCalledWith('x', 500 - 10);
+ expect(svg.attr).toHaveBeenCalledWith('text-anchor', 'end');
+ expect(svg.text).toHaveBeenCalledWith('Adopt');
+
+ expect(svg.append).toHaveBeenCalledWith('text');
+ expect(svg.attr).toHaveBeenCalledWith('y', center + 4);
+ expect(svg.attr).toHaveBeenCalledWith('x', 500 - (center / 2) - 10);
+ expect(svg.attr).toHaveBeenCalledWith('text-anchor', 'end');
+ expect(svg.text).toHaveBeenCalledWith('Hold');
+ });
});
});