in src/UXClient/Components/HierarchyNavigation/HierarchyNavigation.ts [719:801]
private renderTree (data, target, locInTarget = null, skipLevels = null) {
if (Object.keys(data).length === 0) {
this.showNoResultsForSearch();
return;
} else {
this.noResultsElem.style('display', 'none');
if (this.mode === State.Filter) {
(this.viewTypesElem.node() as any).style.display = 'inline-flex';
}
}
let list, currentShowMore;
if (!locInTarget) {
list = target.append('ul').attr("role", target === this.hierarchyElem ? "tree" : "group");
} else {
if (locInTarget === '.tsi-show-more.tsi-show-more-hierarchy')
currentShowMore = target.selectAll('.tsi-show-more.tsi-show-more-hierarchy').filter(function(d, i,list) {
return i === list.length - 1;
});
else
currentShowMore = target.selectAll('.tsi-show-more.tsi-show-more-instance').filter(function(d, i,list) {
return i === list.length - 1;
});
currentShowMore.node().style.display = 'none';
currentShowMore.classed('tsi-target-loc', true);
}
if (locInTarget && skipLevels) {
while (skipLevels) {
data = data[Object.keys(data)[0]].children;
skipLevels--;
}
}
Object.keys(data).forEach(el => {
let li, newListElem;
let nodeNameToCheckIfExists = data[el] instanceof InstanceNode && data[el].name !== this.getString("Show More Instances") ? this.instanceNodeString(data[el]) : el;
if (locInTarget) {
if (target.selectAll(".tsi-name").nodes().find(e => e.innerText === nodeNameToCheckIfExists)) {return;}
li = target.insert('li', '.tsi-target-loc').classed('tsi-leaf', data[el].isLeaf);
} else {
if (list.selectAll(".tsi-name").nodes().find(e => e.innerText === nodeNameToCheckIfExists)) {return;}
li = list.append('li').classed('tsi-leaf', data[el].isLeaf);
}
li.attr("role", "none");
if(el === this.getString("Show More Hierarchies")) {
li.classed('tsi-show-more tsi-show-more-hierarchy', true)
.append('span')
.classed('tsi-hierarchyItem', true)
.attr('tabindex', 0)
.attr("role", "treeitem").attr('aria-expanded', false)
.attr('style', `padding-left: ${(data[el].level) * 18 + 20}px`).text(this.getString("Show more")).on('click keydown', function () {
if (Utils.isKeyDownAndNotEnter(d3.event)) {return; }
return data[el].onClick();
});
} else if (el === this.getString("Show More Instances")) {
li.classed('tsi-show-more tsi-show-more-instance', true)
.append('span')
.classed('tsi-hierarchyItem', true)
.attr('tabindex', 0)
.attr("role", "treeitem").attr('aria-expanded', false)
.attr('style', `padding-left: ${(data[el].level) * 18 + 20}px`).text(this.getString("Show more")).on('click keydown', function () {
if (Utils.isKeyDownAndNotEnter(d3.event)) {return; }
data[el].onClick();
});
} else {
newListElem = this.createHierarchyItemElem(data[el], el);
li.node().appendChild(newListElem.node());
}
data[el].node = li;
if (data[el].children) {
data[el].isExpanded = true;
data[el].node.classed('tsi-expanded', true);
this.renderTree(data[el].children, data[el].node);
}
if (data[el] instanceof HierarchyNode && el !== this.getString("Show More Hierarchies") && this.mode === State.Filter && data[el].cumulativeInstanceCount == 1 && !data[el].isExpanded) { //expand the last parent node by default to prevent additional click to see the filter results
newListElem.node().click();
}
});
if(locInTarget) {
currentShowMore.remove();
}
}