mirror of
https://gitlab.com/crafty-controller/crafty-4.git
synced 2024-08-30 18:23:09 +00:00
Still kinda broken, but this is cool
This commit is contained in:
parent
eec9f0fc95
commit
6ad9863cbf
@ -40,8 +40,15 @@
|
||||
<!-- Bootstrap Toggle -->
|
||||
<link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet">
|
||||
<script defer src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-zoom/0.6.6/chartjs-plugin-zoom.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.min.js"
|
||||
integrity="sha512-UXumZrZNiOwnTcZSHLOfcTs0aos2MzBWHXOHOuB0J/R44QB0dwY5JgfbvljXcklVf65Gc4El6RjZ+lnwd2az2g=="
|
||||
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.9.1/chart.min.js"
|
||||
integrity="sha512-ElRFoEQdI5Ht6kZvyzXhYG9NqjtkmlkfYk0wr6wHxU9JEHakS7UJZNeml5ALk+8IKlU6jDgMabC3vkumRokgJA=="
|
||||
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-zoom/1.2.1/chartjs-plugin-zoom.min.js"
|
||||
integrity="sha512-klQv6lz2YR+MecyFYMFRuU2eAl8IPRo6zHnsc9n142TJuJHS8CG0ix4Oq9na9ceeg1u5EkBfZsFcV3U7J51iew=="
|
||||
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
|
||||
<!-- End Bootstrap Toggle -->
|
||||
|
||||
|
@ -41,11 +41,7 @@
|
||||
|
||||
|
||||
<canvas id="lineChart"></canvas>
|
||||
<div class="text-center">
|
||||
<button class="btn btn-outline-info" onclick="toggle_players()">PLAYERS</button>
|
||||
<button class="btn btn-outline-primary" onclick="toggle_mem()">MEM</button>
|
||||
<button class="btn btn-outline-warning" onclick="toggle_cpu()">CPU</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -80,7 +76,8 @@
|
||||
borderColor: [
|
||||
'rgba(136, 98, 224, .5)',
|
||||
],
|
||||
borderWidth: 2
|
||||
borderWidth: 2,
|
||||
tension: 0
|
||||
},
|
||||
{
|
||||
label: "MEM",
|
||||
@ -88,7 +85,8 @@
|
||||
borderColor: [
|
||||
'rgba(33, 150, 243, .5)',
|
||||
],
|
||||
borderWidth: 2
|
||||
borderWidth: 2,
|
||||
tension: 0
|
||||
},
|
||||
{
|
||||
label: "CPU",
|
||||
@ -96,86 +94,55 @@
|
||||
borderColor: [
|
||||
'rgba(255, 175, 0, .5)',
|
||||
],
|
||||
borderWidth: 2
|
||||
borderWidth: 2,
|
||||
tension: 0
|
||||
},
|
||||
]
|
||||
},
|
||||
options: {
|
||||
plugins: {
|
||||
zoom: {
|
||||
zoom: {
|
||||
wheel: {
|
||||
enabled: true,
|
||||
},
|
||||
drag: {
|
||||
enabled: true,
|
||||
modifierKey: "shift"
|
||||
},
|
||||
pinch: {
|
||||
enabled: true
|
||||
},
|
||||
mode: 'x',
|
||||
modifierKey: 'shift',
|
||||
},
|
||||
},
|
||||
pan: {
|
||||
enabled: true,
|
||||
mode: "xy",
|
||||
threshhold: 1,
|
||||
pan: {
|
||||
enabled: true,
|
||||
mode: "xy",
|
||||
threshhold: 1,
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
fill: false,
|
||||
lineTension: 5,
|
||||
responsive: true,
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
min: 0,
|
||||
max: Math.max.apply(this, max_nums) + 5
|
||||
}
|
||||
}]
|
||||
y: {
|
||||
min: 0,
|
||||
},
|
||||
x: {
|
||||
position: 'right',
|
||||
min: -500,
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var mem_hidden = false;
|
||||
var cpu_hidden = false;
|
||||
var players_hidden = false;
|
||||
|
||||
function toggle_mem() {
|
||||
if (!mem_hidden) {
|
||||
hist_chart.data.datasets = hist_chart.data.datasets.filter(function (obj) { return obj.label != "MEM" });
|
||||
mem_hidden = true;
|
||||
// Repaint
|
||||
} else {
|
||||
hist_chart.data.datasets.splice(1, 0, {
|
||||
label: "MEM",
|
||||
data: ram,
|
||||
borderColor: [
|
||||
'rgba(33, 150, 243, .5)',
|
||||
],
|
||||
borderWidth: 2
|
||||
});
|
||||
mem_hidden = false;
|
||||
}
|
||||
hist_chart.update();
|
||||
|
||||
}
|
||||
function toggle_cpu() {
|
||||
if (!cpu_hidden) {
|
||||
hist_chart.data.datasets = hist_chart.data.datasets.filter(function (obj) { return obj.label != "CPU" });
|
||||
cpu_hidden = true;
|
||||
// Repaint
|
||||
} else {
|
||||
hist_chart.data.datasets.push({
|
||||
label: "CPU",
|
||||
data: cpu,
|
||||
borderColor: [
|
||||
'rgba(255, 175, 0, .5)',
|
||||
],
|
||||
borderWidth: 2
|
||||
});
|
||||
cpu_hidden = false;
|
||||
}
|
||||
hist_chart.update();
|
||||
|
||||
}
|
||||
function toggle_players() {
|
||||
if (!players_hidden) {
|
||||
hist_chart.data.datasets = hist_chart.data.datasets.filter(function (obj) { return obj.label != "Players" });
|
||||
players_hidden = true;
|
||||
// Repaint
|
||||
} else {
|
||||
hist_chart.data.datasets.splice(0, 0, {
|
||||
label: "Players",
|
||||
data: players,
|
||||
borderColor: [
|
||||
'rgba(136, 98, 224, .5)',
|
||||
],
|
||||
borderWidth: 2
|
||||
});
|
||||
players_hidden = false;
|
||||
}
|
||||
hist_chart.update();
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
{% end %}
|
Loading…
Reference in New Issue
Block a user