Skip to content

Commit 1e4a94a

Browse files
kiranbandikiranbandi
committed
filter panel updated for dead genealogies
1 parent dcdd37c commit 1e4a94a

File tree

8 files changed

+126
-102
lines changed

8 files changed

+126
-102
lines changed

‎build/assets/bundle.js‎

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎build/assets/style.css‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ body {
33
}
44

55
.filterPanel {
6-
height: 135px;
76
padding: 0px 5%;
87
text-align: center;
98
}
@@ -20,7 +19,6 @@ button#recreatePlot {
2019
#sliderContainer {
2120
width: 50%;
2221
vertical-align: middle;
23-
margin-right: 1.5em;
2422
}
2523

2624
#loaderText {
@@ -246,4 +244,8 @@ h3.descriptionHeader {
246244
font-size: 0.75em;
247245
color: #534b4b;
248246
padding: 0px 1em;
247+
}
248+
249+
.filterPanel>p {
250+
font-size: 1.1em;
249251
}

‎build/index.html‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,10 +43,12 @@ <h3 class="SubHeadingTitle noCapital">Fetching data ...</h3>
4343
<div id='circos-root' class='hide'>
4444
<div class='filterPanel'>
4545
<h3 class='SubHeadingTitle plotTitle'>Data Filter Panel</h3>
46+
<p>Move the slider to choose the range of versions for which the genealogy plot needs to be generated.By default the genealogy plot for all available versions is shown below.</p>
47+
<p>The checkbox can be selected to also view the clone genealogies that have dissapeared or have split and are no longer alive.</p>
4648
<div id="sliderContainer"></div>
4749
<div>
4850
<input type="checkbox" id="filterGenealogy" />
49-
<label for="filterGenealogy" class='SubHeadingTitle'>Split and Dissapeared Genealogies</label>
51+
<label for="filterGenealogy" class='SubHeadingTitle'>View Dead Genealogies</label>
5052
</div>
5153
<div>
5254
<button class='button' id='recreatePlot'>FILTER</button>

‎src/app.js‎

Lines changed: 20 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -77,20 +77,35 @@ function start(cloneData, linkGenealogy = {}) {
7777

7878
// initialize slider
7979
slider(minRange, maxRange, cloneData.versionCount, (min, max) => {
80-
minRange = min - 1;
81-
maxRange = max - 1;
80+
minRange = min;
81+
maxRange = max;
8282
});
8383

8484
// tab switch implementation - show hide depending on button press , by default only description is shown
8585
d3.selectAll('#recreatePlot').on('click', () => {
86-
87-
circularMap(cloneData, linkGenealogy);
88-
86+
let filterOptions = {};
87+
filterOptions['includeDeadGenealogies'] = d3.select('#filterGenealogy').property('checked');
88+
filterCloneData(cloneData, minRange, maxRange);
89+
circularMap(cloneData, linkGenealogy, filterOptions);
8990
})
9091

9192
// calling circular map
9293
circularMap(cloneData, linkGenealogy);
9394
// calling linear map
9495
matrix(cloneData, linkGenealogy);
9596

97+
}
98+
99+
function filterCloneData(cloneData, minRange, maxRange) {
100+
101+
let { genealogyList, deadGenealogyList, versionCount, uniqueVersionList } = cloneData,
102+
filteredVersionList = uniqueVersionList.slice(minRange - 1, maxRange - 1);
103+
104+
cloneData.genealogyList = _.filter(genealogyList, (changeList) => {
105+
106+
debugger;
107+
108+
})
109+
110+
96111
}

‎src/changeMap.js‎

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
// Change visualisation for each individual genealogy for a given source or target version
2+
export default function(d3container, dataNode, linkGenealogy, headerContent) {
3+
4+
let changeSubContainer = d3container.append('div').attr('class', 'changeSubContainer');
5+
6+
changeSubContainer.append('h3')
7+
.attr('class', 'descriptionContainerHeader SubHeadingTitle plotTitle')
8+
.text("Change Description for " + headerContent);
9+
10+
changeSubContainer.append('h3')
11+
.attr('class', 'descriptionContainerHeader SubHeadingTitle plotTitle')
12+
.text(sanitizeChangeType(dataNode.changeType));
13+
14+
let sourceCloneContainer = changeSubContainer.append('div')
15+
.attr('class', 'sourceCloneContainer cloneDescriptionContainer'),
16+
targetCloneContainer = changeSubContainer.append('div')
17+
.attr('class', 'targetCloneContainer cloneDescriptionContainer');
18+
19+
20+
sourceCloneContainer.append('h3').attr('class', 'descriptionHeader').text('source');
21+
targetCloneContainer.append('h3').attr('class', 'descriptionHeader').text('target');
22+
sourceCloneContainer.append('p').text('Version : ' + dataNode.source.version);
23+
sourceCloneContainer.append('p').text('Clone Type : ' + dataNode.source.cloneType);
24+
sourceCloneContainer.append('p').text('Class ID : ' + dataNode.source.classId);
25+
targetCloneContainer.append('p').text('Version : ' + dataNode.target.version);
26+
targetCloneContainer.append('p').text('Clone Type : ' + dataNode.target.cloneType);
27+
targetCloneContainer.append('p').text('Clone Class ID : ' + dataNode.target.classId);
28+
29+
let sourceGenealogyKey = dataNode.source.version + '@' + dataNode.source.classId,
30+
targetGenealogyKey = dataNode.target.version + '@' + dataNode.target.classId,
31+
{ genealogyMapSource, genealogyMapTarget } = linkGenealogy,
32+
genealogyInfo = genealogyMapSource[sourceGenealogyKey] || genealogyMapTarget[targetGenealogyKey] || false;
33+
34+
35+
if (genealogyInfo) {
36+
changeSubContainer.append('h3')
37+
.attr('class', 'SubHeadingTitle plotTitle historyTitle')
38+
.text('Detailed Description');
39+
// .text('Detailed Description ' + ", Genealogy ID : " + genealogyInfo._attributes.gid);
40+
41+
} else {
42+
changeSubContainer.append('h3')
43+
.attr('class', 'SubHeadingTitle plotTitle historyTitle').text('Detailed Data for ' + headerContent + ' not available');
44+
return;
45+
}
46+
47+
let detailedContainer = changeSubContainer.append('div').attr('class', 'detailedContainer');
48+
49+
let sourcedetailedContainer = detailedContainer.append('div')
50+
.attr('class', 'cloneDescriptionContainer'),
51+
targetdetailedContainer = detailedContainer.append('div')
52+
.attr('class', 'cloneDescriptionContainer');
53+
54+
if (genealogyInfo.multiClass) {
55+
56+
sourcedetailedContainer.append('p').text('Number of Lines : ' + genealogyInfo.class[0]._attributes.nlines);
57+
sourcedetailedContainer.append('p').text('Number of Fragments : ' + genealogyInfo.class[0]._attributes.nfragments);
58+
sourcedetailedContainer.append('h3').attr('class', 'descriptionHeader').text('Source Fragments');
59+
_.each(genealogyInfo.class[0].source, (sourceValue) => {
60+
let fragment = sourcedetailedContainer.append('div').attr('class', 'fragmentContainer');
61+
fragment.append('p').text('File : ' + sourceValue._attributes.file + " , " + 'Start Line Number : ' + sourceValue._attributes.startline + "," + ' End Line Number : ' + sourceValue._attributes.endline);
62+
});
63+
64+
targetdetailedContainer.append('p').text('Number of Lines : ' + genealogyInfo.class[1]._attributes.nlines);
65+
targetdetailedContainer.append('p').text('Number of Fragments : ' + genealogyInfo.class[1]._attributes.nfragments);
66+
targetdetailedContainer.append('h3').attr('class', 'descriptionHeader').text(' Target Fragments');
67+
_.each(genealogyInfo.class[1].source, (targetValue) => {
68+
let fragment = targetdetailedContainer.append('div').attr('class', 'fragmentContainer');
69+
fragment.append('p').text('File : ' + targetValue._attributes.file + " , " + 'Start Line Number : ' + targetValue._attributes.startline + "," + ' End Line Number : ' + targetValue._attributes.endline);
70+
});
71+
72+
}
73+
74+
}
75+
76+
function sanitizeChangeType(changeInfo) {
77+
let change = changeInfo.split(" "),
78+
changeType = change[0].split("_").join(" "),
79+
fragmentChange = change[1].split("_").join(" ");
80+
return "Change Type : " + changeType + " , Clone Fragments Change : " + fragmentChange;
81+
}

‎src/circularMap.js‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,26 +5,29 @@ import { blueColor, redColor, greenColor, purpleColor } from './colors';
55
import cloneMap from './cloneMap';
66
import legend from './legend';
77

8-
export default function(cloneData, linkGenealogy) {
8+
export default function(cloneData, linkGenealogy, filterOptions = {}) {
99

1010
let { genealogyList, projectName, genealogyInfo, versionCount, uniqueVersionList } = cloneData, { clientWidth } = document.body,
1111
squareRange = clientWidth < window.innerHeight ? clientWidth : window.innerHeight,
1212
width = squareRange,
13-
radius = width / 2;
13+
radius = width / 2,
14+
includeDeadGenealogies = filterOptions.includeDeadGenealogies || false;
1415

1516
let circularMainContainer = d3.select('#root .circularMainContainer');
1617

17-
1818
if (circularMainContainer.node()) {
1919
circularMainContainer.selectAll('*').remove();
20+
d3.select('.mainContainer').remove();
2021
} else {
2122
circularMainContainer = d3.select('#circos-root').append('div').attr('class', 'circularMainContainer');
2223
// add the legend at the top before rendering the actual plot
2324
legend('#circos-root');
2425
}
2526

26-
// toggle to view the dead and split genealogy list
27-
// genealogyList = genealogyList.concat(cloneData.deadGenealogyList);
27+
if (includeDeadGenealogies) {
28+
// toggle to view the dead and split genealogy list
29+
genealogyList = genealogyList.concat(cloneData.deadGenealogyList);
30+
}
2831

2932
circularMainContainer.style("width", width + 'px');
3033

‎src/cloneMap.js‎

Lines changed: 1 addition & 83 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { symbol, symbolCircle, symbolSquare, symbolTriangle, symbolStar } from "
33
import _ from 'lodash';
44
import { blueColor, redColor, greenColor, grayColor, purpleColor } from './colors';
55
import changeLegends from './changeLegends';
6+
import changeMap from './changeMap';
67

78
// This code was initally written for multiple genealogies
89
// but is being used only for a single genealogy at a time
@@ -161,87 +162,4 @@ function markerClicked(data, index) {
161162
changeMap(changeDescriptionContainer, sourceChangeNode, linkGenealogy, 'Following Change');
162163
}
163164

164-
}
165-
166-
167-
// Change visualisation for each individual genealogy for a given source or target version
168-
function changeMap(d3container, dataNode, linkGenealogy, headerContent) {
169-
170-
let changeSubContainer = d3container.append('div').attr('class', 'changeSubContainer');
171-
172-
changeSubContainer.append('h3')
173-
.attr('class', 'descriptionContainerHeader SubHeadingTitle plotTitle')
174-
.text("Change Description for " + headerContent);
175-
176-
changeSubContainer.append('h3')
177-
.attr('class', 'descriptionContainerHeader SubHeadingTitle plotTitle')
178-
.text(sanitizeChangeType(dataNode.changeType));
179-
180-
let sourceCloneContainer = changeSubContainer.append('div')
181-
.attr('class', 'sourceCloneContainer cloneDescriptionContainer'),
182-
targetCloneContainer = changeSubContainer.append('div')
183-
.attr('class', 'targetCloneContainer cloneDescriptionContainer');
184-
185-
186-
sourceCloneContainer.append('h3').attr('class', 'descriptionHeader').text('source');
187-
targetCloneContainer.append('h3').attr('class', 'descriptionHeader').text('target');
188-
sourceCloneContainer.append('p').text('Version : ' + dataNode.source.version);
189-
sourceCloneContainer.append('p').text('Clone Type : ' + dataNode.source.cloneType);
190-
sourceCloneContainer.append('p').text('Class ID : ' + dataNode.source.classId);
191-
targetCloneContainer.append('p').text('Version : ' + dataNode.target.version);
192-
targetCloneContainer.append('p').text('Clone Type : ' + dataNode.target.cloneType);
193-
targetCloneContainer.append('p').text('Clone Class ID : ' + dataNode.target.classId);
194-
195-
let sourceGenealogyKey = dataNode.source.version + '@' + dataNode.source.classId,
196-
targetGenealogyKey = dataNode.target.version + '@' + dataNode.target.classId,
197-
{ genealogyMapSource, genealogyMapTarget } = linkGenealogy,
198-
genealogyInfo = genealogyMapSource[sourceGenealogyKey] || genealogyMapTarget[targetGenealogyKey] || false;
199-
200-
201-
if (genealogyInfo) {
202-
changeSubContainer.append('h3')
203-
.attr('class', 'SubHeadingTitle plotTitle historyTitle')
204-
.text('Detailed Description');
205-
// .text('Detailed Description ' + ", Genealogy ID : " + genealogyInfo._attributes.gid);
206-
207-
} else {
208-
changeSubContainer.append('h3')
209-
.attr('class', 'SubHeadingTitle plotTitle historyTitle').text('Detailed Data for ' + headerContent + ' not available');
210-
return;
211-
}
212-
213-
let detailedContainer = changeSubContainer.append('div').attr('class', 'detailedContainer');
214-
215-
let sourcedetailedContainer = detailedContainer.append('div')
216-
.attr('class', 'cloneDescriptionContainer'),
217-
targetdetailedContainer = detailedContainer.append('div')
218-
.attr('class', 'cloneDescriptionContainer');
219-
220-
if (genealogyInfo.multiClass) {
221-
222-
sourcedetailedContainer.append('p').text('Number of Lines : ' + genealogyInfo.class[0]._attributes.nlines);
223-
sourcedetailedContainer.append('p').text('Number of Fragments : ' + genealogyInfo.class[0]._attributes.nfragments);
224-
sourcedetailedContainer.append('h3').attr('class', 'descriptionHeader').text('Source Fragments');
225-
_.each(genealogyInfo.class[0].source, (sourceValue) => {
226-
let fragment = sourcedetailedContainer.append('div').attr('class', 'fragmentContainer');
227-
fragment.append('p').text('File : ' + sourceValue._attributes.file + " , " + 'Start Line Number : ' + sourceValue._attributes.startline + "," + ' End Line Number : ' + sourceValue._attributes.endline);
228-
});
229-
230-
targetdetailedContainer.append('p').text('Number of Lines : ' + genealogyInfo.class[1]._attributes.nlines);
231-
targetdetailedContainer.append('p').text('Number of Fragments : ' + genealogyInfo.class[1]._attributes.nfragments);
232-
targetdetailedContainer.append('h3').attr('class', 'descriptionHeader').text(' Target Fragments');
233-
_.each(genealogyInfo.class[1].source, (targetValue) => {
234-
let fragment = targetdetailedContainer.append('div').attr('class', 'fragmentContainer');
235-
fragment.append('p').text('File : ' + targetValue._attributes.file + " , " + 'Start Line Number : ' + targetValue._attributes.startline + "," + ' End Line Number : ' + targetValue._attributes.endline);
236-
});
237-
238-
}
239-
240-
}
241-
242-
function sanitizeChangeType(changeInfo) {
243-
let change = changeInfo.split(" "),
244-
changeType = change[0].split("_").join(" "),
245-
fragmentChange = change[1].split("_").join(" ");
246-
return "Change Type : " + changeType + " , Clone Fragments Change : " + fragmentChange;
247165
}

‎src/processGcadOutput.js‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,6 @@ export default function(cloneResponse) {
1111
genealogyInfo = responseArray.slice(1, 5).join('\n'),
1212
versionCount = Number(genealogyInfo.split('\n')[0].slice(20));
1313

14-
let count = 0;
15-
1614
// Genealogy of every clone set is represented in a single line that starts with "[Version" so we look for every line that starts with that
1715
// and then process that line and the next 7 lines following it as a bunch because they contain info regarding this clone set
1816
let lineIndex = 0,
@@ -57,7 +55,7 @@ export default function(cloneResponse) {
5755
return { genealogyList, deadGenealogyList, projectName, genealogyInfo, versionCount, uniqueVersionList };
5856
}
5957

60-
function splitAndParseCloneSet(cloneSetString) {
58+
function splitAndParseCloneSet(cloneSetString, count) {
6159
// Split the entire string by tab and then read through the list sequentially
6260
// since we will be getting the genealogy information between 2 clones at a time
6361
// we will be grouping the result into clone sets so 1->2->3->4 would be grouped as [{1,2},{2,3},{3,4}]
@@ -90,6 +88,11 @@ function splitAndParseCloneSet(cloneSetString) {
9088
genealogyType = 'split';
9189
break;
9290
}
91+
// inconclusive genealogy type , so tagged as dead genealogies
92+
if (changeType.indexOf('n/a') > -1) {
93+
genealogyType = 'disappeared';
94+
break;
95+
}
9396

9497
target = cloneSetStringSplit[loopIndex + 2].slice(1, -1).split(',');
9598
// To get the version from the segment we isolate version by splitting with ':' and then get the second part

0 commit comments

Comments
 (0)