Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Moved all plot objects into one .js file #5456

Merged
merged 4 commits into from
Nov 23, 2021
Merged

Moved all plot objects into one .js file #5456

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
d6b6e44
Removed all plot objects from corresponding .html files and grouped t…
blakeaowens Nov 17, 2021
72a2e81
Attempt #1 to fix failing integration test
blakeaowens Nov 17, 2021
ede91df
Merge branch 'dev' into plot-changes
valentijnscholten Nov 18, 2021
a65f6ba
Merge branch 'dev' into plot-changes
valentijnscholten Nov 19, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2,331 changes: 2,331 additions & 0 deletions dojo/static/dojo/js/metrics.js
View file
Open in desktop

Large diffs are not rendered by default.

499 changes: 83 additions & 416 deletions dojo/templates/dojo/dashboard-metrics.html
View file
Open in desktop

Large diffs are not rendered by default.

140 changes: 23 additions & 117 deletions dojo/templates/dojo/dashboard.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@
</div>
<!-- /.panel-heading -->
<div class="panel-body">
<div class="chart" id="donut-chart"></div>
<div class="chart" id="homepage_pie_chart"></div>
</div>
<!-- /.panel-body -->
</div>
Expand All @@ -121,7 +121,7 @@
</div>
<!-- /.panel-heading -->
<div class="panel-body">
<div class="chart" id="line-chart"></div>
<div class="chart" id="homepage_severity_plot"></div>
</div>
<!-- /.panel-body -->
</div>
Expand Down Expand Up @@ -242,128 +242,34 @@
<script src="{% static "JUMFlot/javascripts/jquery.flot.mouse.js" %}"></script>
<script src="{% static "JUMFlot/javascripts/jquery.flot.bubbles.js" %}"></script>
{% endif %}
<script src="{% static "dojo/js/metrics.js" %}"></script>
<script>
$(function () {
var options = {
xaxes: [{
mode: 'time'
}],
yaxes: [{
min: 0
}],
series: {
lines: {
show: true
},
points: {
show: true
}
},
grid: {
hoverable: true,
borderWidth: 1,
borderColor: '#e7e7e7',
var critical = "{{critical}}";
var high = "{{high}}";
var medium = "{{medium}}";
var low = "{{low}}";
var info = "{{info}}";
homepage_pie_chart(critical, high, medium, low, info);

},
tooltip: true,
};
chart_div();
severity_pie();

function chart_div() {
var critical = [],
high = [],
medium = [],
low = [];

{% for month in by_month %}
month = {{month|safe}};
ttp = new Date(month['y'] + '-01').getTime();
critical.push([ttp, month['a']]);
high.push([ttp, month['b']]);
medium.push([ttp, month['c']]);
low.push([ttp, month['d']]);
{% endfor %}


var plotObj = $.plot($("#line-chart"), [{
data: critical,
label: " Critical",
color: "#d9534f",
}, {
data: high,
label: " High",
color: '#f0ad4e',
}, {
data: medium,
label: " Medium",
color: '#f0de28',
}, {
data: low,
label: " Low",
color: '#337ab7',
}],
options);
}

function severity_pie() {
var data = [{
label: "Critical",
color: "#d9534f",
data: {{critical}}
}, {
label: "High",
color: "#f0ad4e",
data: {{high}}
}, {
label: "Medium",
color: "#f0de28",
data: {{medium}}
}, {
label: "Low",
color: "#337ab7",
data: {{low}}
}, {
label: "Informational",
color: "#E0E0E0",
data: {{info}}
}];

var plotObj = $.plot($("#donut-chart"), data, {
series: {
pie: {
innerRadius: 0.5,
show: true,
radius: 1,
label: {
show: false,
radius: 2 / 3,
formatter: function (label, series) {
return '<div style="font-size:8pt;text-align:center;padding:2px;color:black;z-index:9999;">' + label + '<br/>' + series.data[0][1] + '</div>';

},

}
}
},
grid: {
hoverable: true,
},
tooltip:true,
tooltipOpts: {
content: function(label, xval, yval, flotItem) {
return label+"<br>"+yval
}
}
});
}
critical = [];
high = [];
medium = [];
low = [];
info = [];
{% for month in by_month %}
month = {{month|safe}};
ttp = new Date(month['y'] + '-01').getTime();
critical.push([ttp, month['a']]);
high.push([ttp, month['b']]);
medium.push([ttp, month['c']]);
low.push([ttp, month['d']]);
{% endfor %}
homepage_severity_plot(critical, high, medium, low);

{% if punchcard %}

punchcard("#punchcard", {{ punchcard|safe }}, {{ ticks|safe }});

{% endif %}

});

</script>
Expand Down
155 changes: 8 additions & 147 deletions dojo/templates/dojo/endpoint_pdf_report.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -257,16 +257,12 @@ <h6>Notes</h6>
<script src="{{ host }}{% static "flot/jquery.flot.time.js" %}"></script>
<script src="{{ host }}{% static "flot/jquery.flot.stack.js" %}"></script>
<script src="{{ host }}{% static "flot-axis/jquery.flot.axislabels.js" %}"></script>
<script src="{{ host }}{% static "dojo/js/metrics.js" %}"></script>
<script type="text/javascript">
$(function () {
finding_age();
open_findings();
});

function finding_age() {
var data = {};
var data_1 = []
var ticks = []
var data_1 = [];
var ticks = [];
{% for f in findings %}
if (data[{{ f.age }}]) {
data[{{ f.age }}] += 1
Expand All @@ -283,59 +279,14 @@ <h6>Notes</h6>
}
i++;
});


var dataset = [
{data: data_1, color: "#337ab7", fillColor: "#337ab7"}
];

var options = {
series: {
bars: {
show: true,
fill: true,
fillColor: "#337ab7"
}
},
bars: {
align: "center",
barWidth: 0.5
},
xaxis: {
axisLabel: "Days Open",
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: 'Verdana, Arial',
axisLabelPadding: 10,
ticks: ticks,
},
yaxis: {
axisLabel: "Number of Findings",
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: 'Verdana, Arial',
axisLabelPadding: 3,
},
legend: {
show: false,
},
grid: {
borderWidth: 1,
borderColor: '#e7e7e7',
}
};


$.plot("#finding_age", dataset, options);
}
;
function open_findings() {
finding_age(data_1, ticks);

var critical = 0;
var high = 0;
var medium = 0;
var low = 0;
var info = 0;
var ticks = [
ticks = [
[0, "Critical"], [1, "High"], [2, "Medium"], [3, "Low"], [4, "Info"]
];

Expand Down Expand Up @@ -368,98 +319,8 @@ <h6>Notes</h6>
var d5 = [
[4, info],
];

var data = [
{
label: "Critical",
data: d1,
bars: {
show: true,
fill: true,
lineWidth: 1,
order: 1,
fillColor: "#d9534f"
},
color: "#d9534f"
},
{
label: "High",
data: d2,
bars: {
show: true,
fill: true,
lineWidth: 1,
order: 2,
fillColor: "#f0ad4e"
},
color: "#f0ad4e"
},
{
label: "Medium",
data: d3,
bars: {
show: true,
fill: true,
lineWidth: 1,
order: 3,
fillColor: "#f0de28"
},
color: "#f0de28"
},
{
label: "Low",
data: d4,
bars: {
show: true,
fill: true,
lineWidth: 1,
order: 4,
fillColor: "#337ab7"
},
color: "#337ab7"
},
{
label: "info",
data: d5,
bars: {
show: true,
fill: true,
lineWidth: 1,
order: 4,
fillColor: "#80699B"
},
color: "#80699B"
}
];

$.plot("#open_findings", data, {
series: {
stack: true,
bars: {
show: true,
barWidth: .9,
'align': "center",
},

},
grid: {
hoverable: false,
borderWidth: 1,
borderColor: '#e7e7e7',

},
tooltip: false,
legend: {
show: false,
position: "ne"
},
xaxis: {
ticks: ticks,
},

});
}
;
open_findings(d1, d2, d3, d4, d5, ticks);
});

window.onload = function () {
var toc = "";
Expand Down
Loading