MISP
/
misp-dashboard
mirror of https://github.com/MISP/misp-dashboard
2
0
Fork 0
Code Issues Releases Wiki Activity

array nodes are represented as rectangle + do nothing on invalid node click

megaRefact
Sami Mokaddem 2018-08-23 09:49:57 +00:00
parent 7e54b8833d
commit 76c7b5fb10
1 changed files with 78 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

106
static/js/treeFromJson.js
View File

@ -140,13 +140,28 @@
nodeEnter.attr("class", "node nodeNoInteraction"); nodeEnter.attr("class", "node nodeNoInteraction");
} }
nodeEnter.filter(function(d) { var nodeEnterNotArray = nodeEnter.filter(function(d) {
return d.additionalNode === undefined || !d.additionalNode; var not_add = d.additionalNode === undefined || !d.additionalNode;
}) var not_arr = d.children === undefined || d.children[0].linkname === undefined;
return not_add && not_arr;
});
nodeEnterNotArray
.append("circle") .append("circle")
.attr("r", 1e-6) .attr("r", 1e-6)
.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; }); .style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });
var nodeEnterArray = nodeEnter.filter(function(d) {
var not_add = d.additionalNode === undefined || !d.additionalNode;
var is_arr = d.children !== undefined && d.children[0].linkname !== undefined;
return not_add && is_arr;
});
nodeEnterArray
.append("rect")
.attr("width", 0)
.attr("height", 0)
.attr("y", 0)
.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });
nodeEnter.append("text") nodeEnter.append("text")
.attr("x", function(d) { return d.children || d._children ? -13 : 13; }) .attr("x", function(d) { return d.children || d._children ? -13 : 13; })
.attr("dy", ".35em") .attr("dy", ".35em")
@ -164,6 +179,11 @@
.attr("r", 10) .attr("r", 10)
.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; }); .style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });
nodeUpdate.select("rect")
.attr("width", 20)
.attr("height", 20)
.attr("y", -10)
nodeUpdate.select("text") nodeUpdate.select("text")
.style("fill-opacity", 1); .style("fill-opacity", 1);
@ -176,6 +196,11 @@
nodeExit.select("circle") nodeExit.select("circle")
.attr("r", 1e-6); .attr("r", 1e-6);
nodeExit.select("rect")
.attr("width", 0)
.attr("height", 0)
.attr("y", 0)
nodeExit.select("text") nodeExit.select("text")
.style("fill-opacity", 1e-6); .style("fill-opacity", 1e-6);
@ -322,9 +347,10 @@
this.reset_selected(); this.reset_selected();
// select all nodes matching the clicked element // select all nodes matching the clicked element
var res; var resCircle;
var resRect;
if (clicked.data()[0].children === undefined) { // is leaf if (clicked.data()[0].children === undefined) { // is leaf
res = d3.selectAll(".node circle") resCircle = that.svg.selectAll(".node circle")
.filter(function(d) { .filter(function(d) {
if (d.depth == 0) { if (d.depth == 0) {
return false; return false;
@ -335,44 +361,66 @@
return c1 && c2; return c1 && c2;
}); });
} else { } else {
// check if children is leaf // check if children are leaf
var child = clicked.data()[0].children[0]; var child = clicked.data()[0].children[0];
if (that.isObject(child) || Array.isArray(child)) { if (that.isObject(child) || Array.isArray(child)) { // children are not leaves
// First child is not a node, should highlight the label instead // First child is not a node, should highlight the label instead
// --> simulate label click // --> simulate label click
let source = clicked.data()[0]; let source = clicked.data()[0];
let target = clicked.data()[0].children[0]; let target = child;
var resL = this.svg.selectAll("path.link").filter(function(d) { if (target.linkname !== undefined && target.linkname !== '') {
return d.source.id == source.id && d.target.id == target.id; var resL = this.svg.selectAll("path.link").filter(function(d) {
}); return d.source.id == source.id && d.target.id == target.id;
that.clickLabel(resL.data()[0]); });
that.clickLabel(resL.data()[0]);
}
return; return;
} else { } else { // children are leaves
res = d3.selectAll(".node circle") resCircle = that.svg.selectAll(".node circle")
.filter(function(d) {
return d.parent !== null && d.parent.id == clicked.data()[0].id;
});
resRect = that.svg.selectAll(".node rect")
.filter(function(d) { .filter(function(d) {
return d.parent !== null && d.parent.id == clicked.data()[0].id; return d.parent !== null && d.parent.id == clicked.data()[0].id;
}); });
} }
} }
res.data().forEach(function(elem) { var nodesData = [];
if (elem.picked !== undefined && elem.picked != '') { if(resCircle !== undefined) {
// alert || repick conflicting ???? resCircle.data().forEach(function(elem) {
console.log('Possible collision with '+elem.picked); if (elem.picked !== undefined && elem.picked != '') {
//alert('Possible collision with '+elem.picked); // alert || repick conflicting ????
} console.log('Possible collision with '+elem.picked);
elem.picked = that.currentPicking; //alert('Possible collision with '+elem.picked);
}); }
elem.picked = that.currentPicking;
nodesData.push(elem);
});
res.style('fill', itemColor) resCircle.style('fill', itemColor)
.style('fill-opacity', 1.0); .style('fill-opacity', 1.0);
}
if(resRect !== undefined) {
resRect.data().forEach(function(elem) {
if (elem.picked !== undefined && elem.picked != '') {
// alert || repick conflicting ????
console.log('Possible collision with '+elem.picked);
//alert('Possible collision with '+elem.picked);
}
elem.picked = that.currentPicking;
nodesData.push(elem);
});
resRect.style('fill', itemColor)
.style('fill-opacity', 1.0);
}
// find all paths // find all paths
var paths = []; var paths = [];
var nodes = d3.selectAll(".node circle").filter( nodesData.forEach(function(d, i) {
function(d) { return d.picked == that.currentPicking;}
);
nodes.data().forEach(function(d, i) {
paths[i] = that.find_full_path(d, []); paths[i] = that.find_full_path(d, []);
}); });
var instructions = this.compute_mapping_instructions(paths); var instructions = this.compute_mapping_instructions(paths);
@ -682,12 +730,14 @@
); );
var x = nodes.data()[0].name; var x = nodes.data()[0].name;
funXInput.text('"'+that.adjust_text_length(x)+'"'); funXInput.text('"'+that.adjust_text_length(x)+'"');
funXInput[0].innerHTML = '"'+that.adjust_text_length(x)+'"';
funXOuput[0].innerHTML = that.adjust_text_length('"'+f(x)+'"'); funXOuput[0].innerHTML = that.adjust_text_length('"'+f(x)+'"');
} catch(err) { // Error } catch(err) { // Error
if (err.name == 'SyntaxError') { if (err.name == 'SyntaxError') {
flag_continue = false; flag_continue = false;
funXOuput[0].innerHTML = $('<span class="funOutputError">'+err.name+'</span>')[0].outerHTML; funXOuput[0].innerHTML = $('<span class="funOutputError">'+err.name+'</span>')[0].outerHTML;
} else if (err.name == 'TypeError') { } else if (err.name == 'TypeError') {
funXInput[0].innerHTML = $('<span class="funOutputError">'+'Not picked yet'+'</span>')[0].outerHTML;
var html = $('<span></span>'); var html = $('<span></span>');
html.append($('<span class="funOutputError">'+'Not picked yet'+'</span>')); html.append($('<span class="funOutputError">'+'Not picked yet'+'</span>'));
html.append($('<span class="funOutputError">'+err.name+'</span>')); html.append($('<span class="funOutputError">'+err.name+'</span>'));