Skip to content
This repository was archived by the owner on Apr 16, 2020. It is now read-only.

Commit b2aef51

Browse files
pgtepgte
committed
report: sections with collapsible accordions
1 parent dda7b5e commit b2aef51

File tree

1 file changed

+181
-194
lines changed

1 file changed

+181
-194
lines changed

‎src/report-templates/results.html

Lines changed: 181 additions & 194 deletions
Original file line numberDiff line numberDiff line change
@@ -11,95 +11,114 @@
1111
<body class="container">
1212
<h1 class="centered">IPFS Benchmarks Report</h1>
1313

14-
<table class="table table-striped">
15-
<tbody>
16-
{{#each .}}
17-
{{#each suites}}
18-
<tr>
19-
<th>{{suite}}</th>
20-
<td>
21-
<div class="well">
22-
<div style="float: left; width: 200px">
23-
<canvas height="200" id="{{suite}}/mean"></canvas>
24-
<script>
25-
var canvas = document.getElementById('{{suite}}/mean')
26-
var options = {
27-
type: 'horizontalBar',
28-
data: {
29-
labels: [
30-
{{#each results}}
31-
'{{env}}'{{#unless @last}},{{/unless}}
32-
{{/each}}
33-
],
34-
datasets: [
35-
{
36-
label: 'mean',
37-
backgroundColor: [
38-
'rgba(255, 99, 132, 0.2)',
39-
'rgba(54, 162, 235, 0.2)',
40-
'rgba(255, 206, 86, 0.2)'
41-
],
42-
borderColor: [
43-
'rgba(255,99,132,1)',
44-
'rgba(54, 162, 235, 1)',
45-
'rgba(255, 206, 86, 1)'
46-
],
47-
data: [
48-
{{#each results}}
49-
{{stats.mean}}{{#unless @last}},{{/unless}}
50-
{{/each}}
51-
]
52-
}
53-
]
54-
}
14+
{{#each .}}
15+
{{#each suites}}
16+
<h2>{{suite}}</h2>
17+
18+
<div class="panel-group" id="{{suite}}-accordion" role="tablist" aria-multiselectable="true">
19+
20+
<div class="panel panel-default">
21+
<div class="panel-heading" role="tab" id="{{suite}}-graphics-headingOne">
22+
<h4 class="panel-title">
23+
<a role="button" data-toggle="collapse" data-parent="#{{suite}}-accordion" href="#{{suite}}-graphics" aria-expanded="true" aria-controls="{{suite}}-graphics">
24+
Graphics
25+
</a>
26+
</h4>
27+
</div>
28+
<div id="{{suite}}-graphics" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="{{suite}}-graphics-headingOne">
29+
<div class="panel-body">
30+
<div style="float: left; width: 200px">
31+
<canvas height="200" id="{{suite}}/mean"></canvas>
32+
<script>
33+
var canvas = document.getElementById('{{suite}}/mean')
34+
var options = {
35+
type: 'horizontalBar',
36+
data: {
37+
labels: [
38+
{{#each results}}
39+
'{{env}}'{{#unless @last}},{{/unless}}
40+
{{/each}}
41+
],
42+
datasets: [
43+
{
44+
label: 'mean',
45+
backgroundColor: [
46+
'rgba(255, 99, 132, 0.2)',
47+
'rgba(54, 162, 235, 0.2)',
48+
'rgba(255, 206, 86, 0.2)'
49+
],
50+
borderColor: [
51+
'rgba(255,99,132,1)',
52+
'rgba(54, 162, 235, 1)',
53+
'rgba(255, 206, 86, 1)'
54+
],
55+
data: [
56+
{{#each results}}
57+
{{stats.mean}}{{#unless @last}},{{/unless}}
58+
{{/each}}
59+
]
60+
}
61+
]
5562
}
56-
var chart = new Chart(canvas, options)
57-
</script>
58-
</div>
63+
}
64+
var chart = new Chart(canvas, options)
65+
</script>
66+
</div>
5967

60-
<div style="float: left; width: 200px">
61-
<canvas height="200" id="{{suite}}/variance"></canvas>
62-
<script>
63-
var canvas = document.getElementById('{{suite}}/variance')
64-
var options = {
65-
type: 'horizontalBar',
66-
data: {
67-
labels: [
68-
{{#each results}}
69-
'{{env}}'{{#unless @last}},{{/unless}}
70-
{{/each}}
71-
],
72-
datasets: [
73-
{
74-
label: 'variance',
75-
backgroundColor: [
76-
'rgba(255, 99, 132, 0.2)',
77-
'rgba(54, 162, 235, 0.2)',
78-
'rgba(255, 206, 86, 0.2)'
79-
],
80-
borderColor: [
81-
'rgba(255,99,132,1)',
82-
'rgba(54, 162, 235, 1)',
83-
'rgba(255, 206, 86, 1)'
84-
],
85-
data: [
86-
{{#each results}}
87-
{{stats.variance}}{{#unless @last}},{{/unless}}
88-
{{/each}}
89-
]
90-
}
91-
]
92-
}
68+
<div style="float: left; width: 200px">
69+
<canvas height="200" id="{{suite}}/variance"></canvas>
70+
<script>
71+
var canvas = document.getElementById('{{suite}}/variance')
72+
var options = {
73+
type: 'horizontalBar',
74+
data: {
75+
labels: [
76+
{{#each results}}
77+
'{{env}}'{{#unless @last}},{{/unless}}
78+
{{/each}}
79+
],
80+
datasets: [
81+
{
82+
label: 'variance',
83+
backgroundColor: [
84+
'rgba(255, 99, 132, 0.2)',
85+
'rgba(54, 162, 235, 0.2)',
86+
'rgba(255, 206, 86, 0.2)'
87+
],
88+
borderColor: [
89+
'rgba(255,99,132,1)',
90+
'rgba(54, 162, 235, 1)',
91+
'rgba(255, 206, 86, 1)'
92+
],
93+
data: [
94+
{{#each results}}
95+
{{stats.variance}}{{#unless @last}},{{/unless}}
96+
{{/each}}
97+
]
98+
}
99+
]
93100
}
94-
var chart = new Chart(canvas, options)
95-
</script>
96-
</div>
101+
}
102+
var chart = new Chart(canvas, options)
103+
</script>
104+
</div>
97105

98-
<div class="clearfix"></div>
106+
<div class="clearfix"></div>
107+
</div>
108+
</div>
109+
</div>
99110

100-
</div>
101-
<a class="clearfix btn btn-primary" role="button" data-toggle="collapse" data-target="#{{suite}}-data" aria-expanded="false" aria-controls="{{suite}}-data">Show data</a>
102-
<table class="table table-striped collapse" id="{{suite}}-data">
111+
<div class="panel panel-default">
112+
<div class="panel-heading" role="tab" id="{{suite}}-data-headingOne">
113+
<h4 class="panel-title">
114+
<a role="button" data-toggle="collapse" data-parent="#{{suite}}-accordion" href="#{{suite}}-data" aria-expanded="true" aria-controls="{{suite}}-data">
115+
Data
116+
</a>
117+
</h4>
118+
</div>
119+
<div id="{{suite}}-data" class="panel-collapse collapse" role="tabpanel" aria-labelledby="{{suite}}-data-headingOne">
120+
<div class="panel-body">
121+
<table class="table table-striped">
103122
<thead>
104123
<tr>
105124
<th>Environment</th>
@@ -125,118 +144,86 @@ <h1 class="centered">IPFS Benchmarks Report</h1>
125144
{{/each}}
126145
</tbody>
127146
</table>
128-
</td>
129-
</tr>
130-
{{/each}}
131-
{{/each}}
132-
</tbody>
133-
</table>
134-
135-
<section>
136-
<h2>Details</h2>
137-
{{#each .}}
138-
{{#each suites}}
139-
<h3><a id="{{name}}"></a>Suite {{suite}}</h3>
140-
{{#each results}}
141-
<h4><a id="{{suite}}/{{name}}"></a>{{../suite}}/{{name}}:</h4>
142-
<p>Context:</p>
143-
<table class="table table-striped">
144-
<tbody>
145-
<tr>
146-
<th>Name</th>
147-
<td>{{name}}</td>
148-
</tr>
149-
<tr>
150-
<th>When</th>
151-
<td>{{now}}</td>
152-
</tr>
153-
<tr>
154-
<th>Code</th>
155-
<td><pre>{{code}}</pre></td>
156-
</tr>
157-
<tr>
158-
<th>Platform</th>
159-
<td>
160-
{{platform.description}}
161-
</td>
162-
</tr>
163-
<tr>
164-
<th>CPUs</th>
165-
<td>
166-
{{#each cpus}}
167-
<table class="table table-striped">
168-
<tbody>
169-
<tr>
170-
<th>Model</th>
171-
<td>{{model}}</td>
172-
</tr>
173-
<tr>
174-
<th>Speed</th>
175-
<td>{{speed}}</td>
176-
</tr>
177-
</tbody>
178-
</table>
179-
{{/each}}
180-
</td>
181-
</tr>
182-
<tr>
183-
<th>Load Average</th>
184-
<td>{{loadavg}}</td>
185-
</tr>
186-
</tbody>
187-
</table>
147+
</div>
148+
</div>
149+
</div>
188150

189-
<p>Results:</p>
151+
<div class="panel panel-default">
152+
<div class="panel-heading" role="tab" id="{{suite}}-environment-headingOne">
153+
<h4 class="panel-title">
154+
<a role="button" data-toggle="collapse" data-parent="#{{suite}}-accordion" href="#{{suite}}-environment" aria-expanded="true" aria-controls="{{suite}}-environment">
155+
Environment
156+
</a>
157+
</h4>
158+
</div>
159+
<div id="{{suite}}-environment" class="panel-collapse collapse" role="tabpanel" aria-labelledby="{{suite}}-environment-headingOne">
160+
<div class="panel-body">
161+
{{#each results}}
162+
<h4>{{env}}</h4>
163+
<table class="table table-striped">
164+
<tbody>
165+
<tr>
166+
<th>Name</th>
167+
<td>{{name}}</td>
168+
</tr>
169+
<tr>
170+
<th>When</th>
171+
<td>{{now}}</td>
172+
</tr>
173+
<tr>
174+
<th>Code</th>
175+
<td><pre>{{code}}</pre></td>
176+
</tr>
177+
<tr>
178+
<th>Platform</th>
179+
<td>
180+
{{platform.description}}
181+
</td>
182+
</tr>
183+
<tr>
184+
<th>CPUs</th>
185+
<td>
186+
{{#each cpus}}
187+
<table class="table table-striped">
188+
<tbody>
189+
<tr>
190+
<th>Model</th>
191+
<td>{{model}}</td>
192+
</tr>
193+
<tr>
194+
<th>Speed</th>
195+
<td>{{speed}}</td>
196+
</tr>
197+
</tbody>
198+
</table>
199+
{{/each}}
200+
</td>
201+
</tr>
202+
<tr>
203+
<th>Load Average</th>
204+
<td>{{loadavg}}</td>
205+
</tr>
206+
</tbody>
207+
</table>
190208

191-
<table class="table table-striped">
192-
<tbody>
193-
<tr>
194-
<th>Count</th>
195-
<td>{{count}}</td>
196-
</tr>
197-
<tr>
198-
<th>Hz</th>
199-
<td>{{hz}}</td>
200-
</tr>
201-
<tr>
202-
<th>Stats</th>
203-
<td>
204-
<table class="table table-striped">
205-
<tbody>
206-
<tr>
207-
<th>Mean</th>
208-
<td>{{stats.mean}}</td>
209-
</tr>
210-
<tr>
211-
<th>Variance</th>
212-
<td>{{stats.variance}}</td>
213-
</tr>
214-
<tr>
215-
<th>Deviation</th>
216-
<td>{{stats.deviation}}</td>
217-
</tr>
218-
<tr>
219-
<th>MOE</th>
220-
<td>{{stats.moe}}</td>
221-
</tr>
222-
<tr>
223-
<th>RME</th>
224-
<td>{{stats.rme}}</td>
225-
</tr>
226-
<tr>
227-
<th>SEM</th>
228-
<td>{{stats.sem}}</td>
229-
</tr>
230-
</tbody>
231-
</table>
232-
</td>
233-
</tr>
234-
</tbody>
235-
</table>
236-
<hr>
237-
{{/each}}
238-
{{/each}}
209+
<table class="table table-striped">
210+
<tbody>
211+
<tr>
212+
<th>Count</th>
213+
<td>{{count}}</td>
214+
</tr>
215+
<tr>
216+
<th>Hz</th>
217+
<td>{{hz}}</td>
218+
</tr>
219+
</tbody>
220+
</table>
221+
{{/each}}
222+
</div>
223+
</div>
224+
</div>
225+
</div>
239226
{{/each}}
240-
</section>
227+
{{/each}}
241228
</body>
242229
</html>

0 commit comments

Comments
 (0)