MISP/misp-galaxy
6
0
Fork 0
mirror of https://github.com/MISP/misp-galaxy.git synced 2024-11-26 08:47:18 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add [graph + table] scaling based on window

Browse source
This commit is contained in:
niclas 2024-03-15 09:41:36 +01:00
parent 53f1c2c311
commit c40130eab8
4 changed files with 15 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
tools/mkdocs/modules/galaxy.py
View file

@ -51,6 +51,9 @@ class Galaxy:
def _create_title_entry(self): def _create_title_entry(self):
entry = "" entry = ""
entry += f"[Hide Navigation](#){{ .md-button #toggle-navigation }}\n"
entry += f"[Hide TOC](#){{ .md-button #toggle-toc }}\n"
entry += f"<div class=\"clearfix\"></div>\n"
entry += f"[Edit :material-pencil:](https://github.com/MISP/misp-galaxy/edit/main/clusters/{self.json_file_name}){{ .md-button }}\n" entry += f"[Edit :material-pencil:](https://github.com/MISP/misp-galaxy/edit/main/clusters/{self.json_file_name}){{ .md-button }}\n"
entry += f"# {self.galaxy_name}\n" entry += f"# {self.galaxy_name}\n"
return entry return entry

14
tools/mkdocs/site/docs/01_attachements/javascripts/graph.js
View file

@ -290,18 +290,13 @@ document$.subscribe(function () {
.style("opacity", 0); .style("opacity", 0);
// Set up the dimensions of the graph // Set up the dimensions of the graph
var height = 1000;
var width = document.querySelector('.md-content__inner').offsetWidth; var width = document.querySelector('.md-content__inner').offsetWidth;
var height = width;
// var svg = d3.select(elementId).append("svg")
// .attr("width", width)
// .attr("height", height)
var svg = d3.select("div#container") var svg = d3.select("div#container")
.append("svg") .append("svg")
.attr("preserveAspectRatio", "xMinYMin meet") .attr("preserveAspectRatio", "xMinYMin meet")
.attr("viewBox", "0 0 825 1000") .attr("viewBox", "0 0 " + width + " " + height)
.classed("svg-content", true); .classed("svg-content", true);
// Create a force simulation // Create a force simulation
@ -337,10 +332,8 @@ document$.subscribe(function () {
.attr("class", d => "node galaxy-" + d.galaxy.replace(/\s+/g, '-').replace(/[\s.]/g, '-')); .attr("class", d => "node galaxy-" + d.galaxy.replace(/\s+/g, '-').replace(/[\s.]/g, '-'));
initializeNodeInteractions(node, link, tooltip, simulation, links, Parent_Node, NODE_RADIUS); initializeNodeInteractions(node, link, tooltip, simulation, links, Parent_Node, NODE_RADIUS);
createGalaxyColorLegend(svg, width, galaxies, colorScale, node, link, tooltip); createGalaxyColorLegend(svg, width, galaxies, colorScale, node, link, tooltip);
// Update positions on each simulation 'tick' // Update positions on each simulation 'tick'
simulation.on("tick", () => { simulation.on("tick", () => {
nodes.forEach(d => { nodes.forEach(d => {
@ -414,10 +407,9 @@ document$.subscribe(function () {
col_1: "checklist", col_1: "checklist",
col_3: "checklist", col_3: "checklist",
col_4: "checklist", col_4: "checklist",
col_widths: ["180px", "180px", "180px", "180px", "100px"],
col_types: ["string", "string", "string", "string", "number"], col_types: ["string", "string", "string", "string", "number"],
grid_layout: false, grid_layout: false,
responsive: false, responsive: true,
watermark: ["Filter table ...", "Filter table ...", "Filter table ...", "Filter table ..."], watermark: ["Filter table ...", "Filter table ...", "Filter table ...", "Filter table ..."],
auto_filter: { auto_filter: {
delay: 100 //milliseconds delay: 100 //milliseconds

4
tools/mkdocs/site/docs/01_attachements/stylesheets/graph.css
View file

@ -24,3 +24,7 @@
top: 0; top: 0;
left: 0; left: 0;
} }
.md-typeset__table {
width: 100%;
}

6
tools/mkdocs/utils/helper.py
View file

@ -69,7 +69,11 @@ def galaxy_transform_to_link(galaxy):
def generate_relations_table(cluster): def generate_relations_table(cluster):
relationships = cluster.relationships relationships = cluster.relationships
markdown = f"# {cluster.value} ({cluster.uuid}) \n\n" markdown = ""
markdown += f"[Hide Navigation](#){{ .md-button #toggle-navigation }}\n"
markdown += f"[Hide TOC](#){{ .md-button #toggle-toc }}\n"
markdown += f"<div class=\"clearfix\"></div>\n"
markdown += f"# {cluster.value} ({cluster.uuid}) \n\n"
markdown += f"{cluster.description} \n\n" markdown += f"{cluster.description} \n\n"
markdown += "|Cluster A | Galaxy A | Cluster B | Galaxy B | Level { .graph } |\n" markdown += "|Cluster A | Galaxy A | Cluster B | Galaxy B | Level { .graph } |\n"
markdown += "| --- | --- | --- | --- | --- |\n" markdown += "| --- | --- | --- | --- | --- |\n"