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
|
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-body">
{{#runmode}}
<div class="pull-right">
<a href="?do=runmode">{{lang_runmodeMachines}}</a>: <b>{{runmode}}</b>
</div>
{{/runmode}}
<div>
{{lang_knownMachines}}: <b>{{known}}</b> 
<a href="?do=Statistics&show=summary&filters={{query}}~,~state=on">{{lang_onlineMachines}}</a>: <b>{{online}}</b> 
<a href="?do=Statistics&show=summary&filters={{query}}~,~state=occupied">{{lang_inUseMachines}}</a>: <b>{{used}}</b> (<b>{{usedpercent}}%</b>)
</div>
{{#badhdd}}
<div>
<span class="glyphicon glyphicon-exclamation-sign red"></span>
<a href="?do=Statistics&show=list&filters={{query}}~,~badsectors>=10">
{{lang_withBadSectors}}:
</a>
<b>{{badhdd}}</b>
</div>
{{/badhdd}}
</div>
</div>
<div>
{{#json}}
<canvas id="usagehist" style="width:100%;height:150px"></canvas>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
var markings = {{{markings}}};
var markMax = Math.max(...markings) * 3;
var showLegend = markMax > 0;
if (markMax < 8) markMax = 8;
var oldDraw = Chart.prototype._drawDatasets;
Chart.prototype._drawDatasets = function () {
if (this.chartArea) {
var ctx = this.ctx;
var chartArea = this.chartArea;
var meta = this.getDatasetMeta(0);
ctx.save();
var end = Math.min(meta.data.length, markings.length) - 1;
for (var i = 0; i < end; ++i) {
var start = meta.data[i].x;
var stop = meta.data[i+1].x;
ctx.fillStyle = 'rgba(16, 64, 255, ' + (!!markings[i] * .05 + markings[i] / markMax) + ')';
ctx.fillRect(start, chartArea.top, stop - start, chartArea.bottom - chartArea.top);
}
ctx.restore();
}
// Perform regular chart draw
oldDraw.call(this);
};
var data = {{{json}}};
var sel = false;
new Chart(document.getElementById('usagehist').getContext('2d'), {type: 'line', data: data, options: {
responsive: true,
animation: false,
pointRadius: 0,
pointHitRadius: 6,
interaction: { mode: 'index' },
plugins: {
subtitle: {
display: showLegend,
text: '{{lang_graphLectureTitle}}',
position: 'bottom',
},
legend: {position: 'left' },
}
}});
}, false);
</script>
{{/json}}
</div>
</div>
|
