1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
|
{{define "content"}}
<main class="container-fluid my-4">
<div class="chart-wrapper mb-5">
<h2 class="h4">Processed Patch Series (weekly)</h2>
<p class="text-muted small">How many patch series have been extracted/triaged/built/fuzzed each week.</p>
<div id="processed_chart_div" style="width: 100%; height: 400px;"></div>
<p class="text-muted small">Click and drag to zoom into a time range. Right-click to reset.</p>
</div>
<hr class="my-4">
<div class="chart-wrapper mb-4">
<h2 class="h4">Findings (weekly)</h2>
<p class="text-muted small">How many kernel crashes or kernel build/boot errors have been detected each week.</p>
<div id="findings_chart_div" style="width: 100%; height: 400px;"></div>
<p class="text-muted small">Click and drag to zoom into a time range. Right-click to reset.</p>
</div>
<hr class="my-4">
<div class="chart-wrapper mb-4">
<h2 class="h4">Reports (weekly)</h2>
<p class="text-muted small">How many reports with findings have been published.</p>
<div id="reports_chart_div" style="width: 100%; height: 400px;"></div>
<p class="text-muted small">Click and drag to zoom into a time range. Right-click to reset.</p>
</div>
<hr class="my-4">
<div class="chart-wrapper mb-4">
<h2 class="h4">Wait Time before Fuzzing (avg hours, weekly)</h2>
<p class="text-muted small">How many hours have passed since the moment the series was published and the moment we started fuzzing it.</p>
<div id="avg_wait_chart_div" style="width: 100%; height: 400px;"></div>
<p class="text-muted small">Click and drag to zoom into a time range. Right-click to reset.</p>
</div>
<hr class="my-4">
<div class="chart-wrapper mb-4">
<h2 class="h4">Status Distribution (weekly)</h2>
<p class="text-muted small">
<b>Processed:</b> Among the processed series, how many have been actually fuzzed.<br />
<b>Skipped:</b> Among the processed series, how many were skipped during triage (e.g. because no proper base commit was found).<br />
<b>Some steps skipped:</b> Among the processed series, how often did we skip the fuzzing step (e.g. because the patch/patch series did not modify the code we compile).
</p>
<div id="distribution_chart_div" style="width: 100%; height: 400px;"></div>
<p class="text-muted small">Click and drag to zoom into a time range. Right-click to reset.</p>
</div>
</main>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawAllCharts);
const processedData = [
{{range .Processed}}
[new Date({{.Date.Format "2006-01-02"}}), {{.Count}}],
{{end}}
];
const findingsData = [
{{range .Findings}}
[new Date({{.Date.Format "2006-01-02"}}), {{.Count}}],
{{end}}
];
const delayData = [
{{range .Delay}}
[new Date({{.Date.Format "2006-01-02"}}), {{.DelayHours}}],
{{end}}
];
const distributionData = [
{{range .Distribution}}
[new Date({{.Date.Format "2006-01-02"}}), {{.Finished}}, {{.Skipped}}, {{.WithFailedSteps}}, {{.WithSkippedSteps}}],
{{end}}
];
const reportsData = [
{{range .Reports}}
[new Date({{.Date.Format "2006-01-02"}}), {{.Count}}],
{{end}}
];
function drawAllCharts() {
drawChart('processed_chart_div', processedData, '#007bff');
drawChart('findings_chart_div', findingsData, '#dc3545');
drawChart('reports_chart_div', reportsData, '#dc3545');
drawChart('avg_wait_chart_div', delayData, 'black');
drawDistributionChart();
}
function drawChart(chartDivId, chartData, chartColor) {
const data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'Count');
data.addRows(chartData);
const options = {
legend: { position: 'none' },
hAxis: { title: 'Date', format: 'MMM dd, yyyy', gridlines: { color: 'transparent' } },
vAxis: { title: 'Count', minValue: 0 },
colors: [chartColor],
explorer: {
actions: ['dragToZoom', 'rightClickToReset'],
axis: 'horizontal',
keepInBounds: true,
maxZoomIn: 4.0
}
};
const chart = new google.visualization.LineChart(document.getElementById(chartDivId));
chart.draw(data, options);
}
function drawDistributionChart() {
const data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'Processed');
data.addColumn('number', 'Skipped');
data.addColumn('number', 'Some steps failed');
data.addColumn('number', 'Some steps skipped');
data.addRows(distributionData);
const options = {
isStacked: 'percent',
legend: { position: 'top', maxLines: 2 },
hAxis: { title: 'Date', format: 'MMM dd, yyyy', gridlines: { color: 'transparent' } },
vAxis: {
minValue: 0,
format: '#%'
},
colors: ['#28a745', '#ffc107', '#ffcccb', '#d5f0c0'],
areaOpacity: 0.8
};
const chart = new google.visualization.AreaChart(document.getElementById('distribution_chart_div'));
chart.draw(data, options);
}
</script>
{{end}}
|
