mirror of
https://gitlab.com/crafty-controller/crafty-4.git
synced 2025-01-19 09:45:28 +01:00
Working live graph
This commit is contained in:
Andrew
parent
6ad9863cbf
commit
037758accb
@ -1223,6 +1223,7 @@ class ServerInstance:
|
||||
"version": raw_ping_result.get("version"),
|
||||
"icon": raw_ping_result.get("icon"),
|
||||
"crashed": self.is_crashed,
|
||||
"created": datetime.datetime.now().strftime("%Y/%m/%d, %H:%M:%S"),
|
||||
},
|
||||
)
|
||||
total_players += int(raw_ping_result.get("online"))
|
||||
|
||||
@ -40,12 +40,12 @@
|
||||
<!-- 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 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/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/chartjs-plugin-zoom/1.2.1/chartjs-plugin-zoom.min.js"
|
||||
integrity="sha512-klQv6lz2YR+MecyFYMFRuU2eAl8IPRo6zHnsc9n142TJuJHS8CG0ix4Oq9na9ceeg1u5EkBfZsFcV3U7J51iew=="
|
||||
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
|
||||
@ -30,7 +30,7 @@
|
||||
{% if data['permissions']['Players'] in data['user_permissions'] and data['server_data']['type'] != 'minecraft-bedrock' %}
|
||||
<a class="dropdown-item {% if data['active_link'] == 'admin_controls' %}active{% end %}" href="/panel/server_detail?id={{ data['server_stats']['server_id']['server_id'] }}&subpage=admin_controls" role="tab" aria-selected="true"><i class="fas fa-users"></i> {{ translate('serverDetails', 'playerControls', data['lang']) }}</a>
|
||||
{% end %}
|
||||
<a class="dropdown-item {% if data['active_link'] == 'metrics' %}active{% end %}" href="/panel/server_detail?id={{ data['server_stats']['server_id']['server_id'] }}&subpage=metrics" role="tab" aria-selected="true"><i class='fas fa-chart-area'></i>Metrics</a>
|
||||
<a class="dropdown-item {% if data['active_link'] == 'metrics' %}active{% end %}" href="/panel/server_detail?id={{ data['server_stats']['server_id']['server_id'] }}&subpage=metrics" role="tab" aria-selected="true"><i class='fas fa-chart-area'></i>{{ translate('serverDetails', 'metrics', data['lang']) }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -51,6 +51,6 @@
|
||||
{% end %}
|
||||
<li class="nav-item term-nav-item">
|
||||
<a class="nav-link {% if data['active_link'] == 'metrics' %}active{% end %}" href="/panel/server_detail?id={{ data['server_stats']['server_id']['server_id'] }}&subpage=metrics" role="tab" aria-selected="true">
|
||||
<i class='fas fa-chart-area'></i>Metrics</a>
|
||||
<i class='fas fa-chart-area'></i>{{ translate('serverDetails', 'metrics', data['lang']) }}</a>
|
||||
</li>
|
||||
</ul>
|
||||
@ -38,8 +38,14 @@
|
||||
<span class="d-block d-sm-none">
|
||||
{% include "parts/m_server_controls_list.html %}
|
||||
</span>
|
||||
|
||||
|
||||
<button style="float: right; visibility: hidden;" class="btn btn-outline-success reset-button"
|
||||
id="reset-button"><i class="fas fa-undo"></i> {{ translate('serverMetrics', 'resetZoom', data['lang'])
|
||||
}}</button>
|
||||
{% if data['user_data']['hints'] %}
|
||||
<span data-html="true" class="hints text-center" title="Did you know?" , data-content="To zoom on the schedule hold your shift key then use your scroll wheel to zoom.<br><br>
|
||||
Alternatively hold the shift key then click and drag the area you'd like to zoom in on." ,
|
||||
data-placement="top"></span>
|
||||
{% end %}
|
||||
<canvas id="lineChart"></canvas>
|
||||
|
||||
</div>
|
||||
@ -50,7 +56,14 @@
|
||||
|
||||
|
||||
</div>
|
||||
<style>
|
||||
.popover-body {
|
||||
color: white !important;
|
||||
;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
var zoomed = false;
|
||||
//line
|
||||
var ctxL = document.getElementById("lineChart").getContext('2d');
|
||||
const players = []
|
||||
@ -61,11 +74,10 @@
|
||||
{% if 'minecraft-java' in data['server_stats']['server_type'] %}
|
||||
players.push("{{ item.online }}");
|
||||
{% end %}
|
||||
dates.push("{{ item.created }}");
|
||||
dates.push("{{ item.created.strftime('%Y/%m/%d, %H:%M:%S') }}");
|
||||
ram.push("{{ item.mem_percent }}")
|
||||
cpu.push("{{ item.cpu }}")
|
||||
{% end %}
|
||||
max_nums = [Math.max.apply(this, players), Math.max.apply(this, ram), Math.max.apply(this, cpu)]
|
||||
var hist_chart = new Chart(ctxL, {
|
||||
type: 'line',
|
||||
data: {
|
||||
@ -77,7 +89,7 @@
|
||||
'rgba(136, 98, 224, .5)',
|
||||
],
|
||||
borderWidth: 2,
|
||||
tension: 0
|
||||
lineTension: 0,
|
||||
},
|
||||
{
|
||||
label: "MEM",
|
||||
@ -86,7 +98,7 @@
|
||||
'rgba(33, 150, 243, .5)',
|
||||
],
|
||||
borderWidth: 2,
|
||||
tension: 0
|
||||
lineTension: 0,
|
||||
},
|
||||
{
|
||||
label: "CPU",
|
||||
@ -95,7 +107,7 @@
|
||||
'rgba(255, 175, 0, .5)',
|
||||
],
|
||||
borderWidth: 2,
|
||||
tension: 0
|
||||
lineTension: 0,
|
||||
},
|
||||
]
|
||||
},
|
||||
@ -103,8 +115,14 @@
|
||||
plugins: {
|
||||
zoom: {
|
||||
zoom: {
|
||||
onZoom({ hist_chart }) {
|
||||
console.log("zooming");
|
||||
document.getElementById("reset-button").style.visibility = "visible";
|
||||
zoomed = true;
|
||||
},
|
||||
wheel: {
|
||||
enabled: true,
|
||||
modifierKey: 'shift',
|
||||
},
|
||||
drag: {
|
||||
enabled: true,
|
||||
@ -114,20 +132,13 @@
|
||||
enabled: true
|
||||
},
|
||||
mode: 'x',
|
||||
modifierKey: 'shift',
|
||||
},
|
||||
},
|
||||
pan: {
|
||||
enabled: true,
|
||||
mode: "xy",
|
||||
threshhold: 1,
|
||||
pan: {
|
||||
enabled: true,
|
||||
mode: "xy",
|
||||
mode: "x",
|
||||
threshhold: 1,
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
},
|
||||
fill: false,
|
||||
lineTension: 5,
|
||||
@ -138,11 +149,70 @@
|
||||
},
|
||||
x: {
|
||||
position: 'right',
|
||||
min: -500,
|
||||
min: dates.length - 200,
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
$(window).ready(function () {
|
||||
$('body').click(function () {
|
||||
$('.hints').popover("hide");
|
||||
});
|
||||
});
|
||||
$(document).ready(function () {
|
||||
if ($(window).width() > 1000) {
|
||||
$('[data-toggle="popover"]').popover();
|
||||
$('.hints').popover("show");
|
||||
}
|
||||
webSocket.on('update_server_details', function (data) {
|
||||
dates.push(data.created);
|
||||
players.push(data.online);
|
||||
cpu.push(data.cpu)
|
||||
ram.push(data.mem_percent)
|
||||
data = {
|
||||
labels: dates,
|
||||
datasets: [{
|
||||
label: "Players",
|
||||
data: players,
|
||||
borderColor: [
|
||||
'rgba(136, 98, 224, .5)',
|
||||
],
|
||||
borderWidth: 2,
|
||||
lineTension: 0,
|
||||
},
|
||||
{
|
||||
label: "MEM",
|
||||
data: ram,
|
||||
borderColor: [
|
||||
'rgba(33, 150, 243, .5)',
|
||||
],
|
||||
borderWidth: 2,
|
||||
lineTension: 0,
|
||||
},
|
||||
{
|
||||
label: "CPU",
|
||||
data: cpu,
|
||||
borderColor: [
|
||||
'rgba(255, 175, 0, .5)',
|
||||
],
|
||||
borderWidth: 2,
|
||||
lineTension: 0,
|
||||
},
|
||||
]
|
||||
}
|
||||
if (!zoomed) {
|
||||
hist_chart.options.scales.x.min = dates.length - 200;
|
||||
}
|
||||
hist_chart.update(data)
|
||||
});
|
||||
|
||||
$(".reset-button").click(function () {
|
||||
console.log("resetting zoom");
|
||||
zoomed = false;
|
||||
hist_chart.resetZoom();
|
||||
document.getElementById("reset-button").style.visibility = "hidden";
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
{% end %}
|
||||
@ -351,7 +351,8 @@
|
||||
"playerControls": "Player Management",
|
||||
"schedule": "Schedule",
|
||||
"serverDetails": "Server Details",
|
||||
"terminal": "Terminal"
|
||||
"terminal": "Terminal",
|
||||
"metrics": "Metrics"
|
||||
},
|
||||
"serverFiles": {
|
||||
"clickUpload": "Click here to select your files",
|
||||
@ -472,6 +473,9 @@
|
||||
"stopScroll": "Stop Auto Scrolling",
|
||||
"updating": "Updating..."
|
||||
},
|
||||
"serverMetrics": {
|
||||
"resetZoom": "Reset Zoom"
|
||||
},
|
||||
"serverWizard": {
|
||||
"absoluteServerPath": "Absolute path to your server",
|
||||
"absoluteZipPath": "Absolute path to your server",
|
||||
@ -558,4 +562,4 @@
|
||||
"userSettings": "User Settings",
|
||||
"uses": "Number of uses allowed (-1==No Limit)"
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user