--- /dev/null
+tr.graphing.RefTable = function (radar) {
+ var self = {};
+ var injectionElement;
+
+ function blipsByCycle () {
+ // set up empty blip arrays for each cycle
+ var cycles = {};
+ radar.cycles()
+ .map(function (cycle) {
+ return {
+ order: cycle.order(),
+ name: cycle.name()
+ };
+ })
+ .sort(function (a, b) {
+ if (a.order === b.order) {
+ return 0;
+ } else if (a.order < b.order) {
+ return -1;
+ } else {
+ return 1;
+ }
+ })
+ .forEach(function (cycle) {
+ cycles[cycle.name] = [];
+ });
+
+ // group blips by cycle
+ var blips = [];
+ var quadrants = radar.quadrants();
+ Object.keys(quadrants).forEach(function (quadrant) {
+ blips = blips.concat(quadrants[quadrant].blips());
+ });
+
+ blips.forEach(function (blip) {
+ cycles[blip.cycle().name()].push(blip);
+ });
+
+ return cycles;
+ }
+
+ self.init = function (selector) {
+ injectionElement = document.querySelector(selector || 'body');
+ return self;
+ };
+
+ self.render = function () {
+ var blips = blipsByCycle();
+
+ var html = '<table class="radar-ref-table">';
+
+ Object.keys(blips).forEach(function (cycle) {
+ html += '<tr class="radar-ref-status-group"><td colspan="3">' + cycle + '</td></tr>';
+
+ blips[cycle].forEach(function (blip) {
+ html += '<tr>' +
+ '<td>' + blip.number() + '</td>' +
+ '<td>' + blip.name() + '</td>' +
+ '<td>' + blip.description() + '</td>' +
+ '</tr>';
+ });
+ });
+
+ html += '</table>';
+
+ injectionElement.innerHTML = html;
+ };
+
+ return self;
+};
--- /dev/null
+describe('tr.graphing.RefTable', function () {
+ var radar, toolsQuadrant, techniquesQuadrant, platformsQuadrant, languageFramework, element;
+
+ beforeEach(function () {
+ toolsQuadrant = new tr.models.Quadrant('Tools');
+ techniquesQuadrant = new tr.models.Quadrant('Techniques');
+ platformsQuadrant = new tr.models.Quadrant('Platforms');
+ languageFramework = new tr.models.Quadrant('Languages');
+
+ radar = new tr.models.Radar();
+ radar.setFirstQuadrant(toolsQuadrant);
+ radar.setSecondQuadrant(techniquesQuadrant);
+ radar.setThirdQuadrant(platformsQuadrant);
+ radar.setFourthQuadrant(languageFramework);
+
+ element = { innerHTML: '' };
+ spyOn(document, 'querySelector').andReturn(element);
+ });
+
+ describe('render', function () {
+ it("groups blips by cycle", function () {
+ var adopt = new tr.models.Cycle('Adopt');
+ var assess = new tr.models.Cycle('Assess');
+
+ toolsQuadrant.add([
+ new tr.models.Blip('foo', adopt, true, 'this is foo'),
+ new tr.models.Blip('bar', assess, true, 'this is bar'),
+ new tr.models.Blip('baz', adopt, true, 'this is baz')
+ ]);
+
+ var table = new tr.graphing.RefTable(radar);
+ table.init('#some-id').render();
+
+ expect(element.innerHTML).toEqual(
+ '<table class="radar-ref-table">' +
+ '<tr class="radar-ref-status-group"><td colspan="3">Adopt</td></tr>' +
+ '<tr><td>-1</td><td>foo</td><td>this is foo</td></tr>' +
+ '<tr><td>-1</td><td>baz</td><td>this is baz</td></tr>' +
+ '<tr class="radar-ref-status-group"><td colspan="3">Assess</td></tr>' +
+ '<tr><td>-1</td><td>bar</td><td>this is bar</td></tr>' +
+ '</table>');
+ });
+
+ it("respects the assigned order of cycles", function () {
+ var adopt = new tr.models.Cycle('Adopt', 1);
+ var assess = new tr.models.Cycle('Assess', 3);
+ var hold = new tr.models.Cycle('Hold', 2);
+
+ toolsQuadrant.add([
+ new tr.models.Blip('foo', adopt, true, 'this is foo'),
+ new tr.models.Blip('bar', assess, true, 'this is bar'),
+ new tr.models.Blip('baz', hold, true, 'this is baz')
+ ]);
+
+ var table = new tr.graphing.RefTable(radar);
+ table.init('#some-id').render();
+
+ expect(element.innerHTML).toEqual(
+ '<table class="radar-ref-table">' +
+ '<tr class="radar-ref-status-group"><td colspan="3">Adopt</td></tr>' +
+ '<tr><td>-1</td><td>foo</td><td>this is foo</td></tr>' +
+ '<tr class="radar-ref-status-group"><td colspan="3">Hold</td></tr>' +
+ '<tr><td>-1</td><td>baz</td><td>this is baz</td></tr>' +
+ '<tr class="radar-ref-status-group"><td colspan="3">Assess</td></tr>' +
+ '<tr><td>-1</td><td>bar</td><td>this is bar</td></tr>' +
+ '</table>');
+ });
+ });
+});