mirror of
https://gitlab.com/crafty-controller/crafty-4.git
synced 2024-08-30 18:23:09 +00:00
241 lines
10 KiB
HTML
241 lines
10 KiB
HTML
<div class="row">
|
|
<div class="col-sm-12 grid-margin">
|
|
<div class="card">
|
|
<div class="card-body pt-3 pb-3">
|
|
<div class="row">
|
|
<div class="col-sm-4 mr-2">
|
|
{% if data['server_stats']['running'] %}
|
|
<b>{{ translate('serverStats', 'serverStatus', data['lang']) }}:</b> <span id="status"
|
|
class="text-success">{{ translate('serverStats', 'online', data['lang']) }}</span><br />
|
|
<b>{{ translate('serverStats', 'serverStarted', data['lang']) }}:</b> <span id="started">{{
|
|
data['server_stats']['started'] }}</span><br />
|
|
<b>{{ translate('serverStats', 'serverUptime', data['lang']) }}:</b> <span id="uptime">{{
|
|
translate('serverStats', 'errorCalculatingUptime', data['lang']) }}</span>
|
|
{% elif data['server_stats']['crashed'] %}
|
|
<b>{{ translate('serverStats', 'serverStatus', data['lang']) }}:</b> <span id="status" class="text-danger">
|
|
<i class="fas fa-exclamation-triangle"></i> {{ translate('dashboard', 'crashed', data['lang'])
|
|
}}</span><br />
|
|
<b>{{ translate('serverStats', 'serverStarted', data['lang']) }}:</b> <span id="started"
|
|
class="text-danger"> <i class="fas fa-exclamation-triangle"></i> {{ translate('dashboard', 'crashed',
|
|
data['lang']) }}</span><br />
|
|
<b>{{ translate('serverStats', 'serverUptime', data['lang']) }}:</b> <span id="uptime" class="text-danger">
|
|
<i class="fas fa-exclamation-triangle"></i> {{ translate('dashboard', 'crashed', data['lang']) }}</span>
|
|
{% else %}
|
|
<b>{{ translate('serverStats', 'serverStatus', data['lang']) }}:</b> <span id="status"
|
|
class="text-warning">{{ translate('serverStats', 'offline', data['lang']) }}</span><br />
|
|
<b>{{ translate('serverStats', 'serverStarted', data['lang']) }}:</b> <span id="started"
|
|
class="text-warning">{{ translate('serverStats', 'offline', data['lang']) }}</span><br />
|
|
<b>{{ translate('serverStats', 'serverUptime', data['lang']) }}:</b> <span id="uptime"
|
|
class="text-warning">{{ translate('serverStats', 'offline', data['lang']) }}</span>
|
|
{% end %}
|
|
<br>
|
|
<b>{{ translate('serverStats', 'serverTimeZone', data['lang']) }}:</b> <span class="text-info">{{
|
|
data['serverTZ'] }}</span>
|
|
</div>
|
|
|
|
<div class="col-sm-3 mr-2">
|
|
<b>{{ translate('serverStats', 'cpuUsage', data['lang']) }}:</b> <span id="cpu">{{
|
|
data['server_stats']['cpu'] }}%</span> <br />
|
|
<b>{{ translate('serverStats', 'memUsage', data['lang']) }}:</b> <span id="mem">{{
|
|
data['server_stats']['mem'] }}</span> <br />
|
|
{% if data['server_stats']['int_ping_results'] %}
|
|
<b>{{ translate('serverStats', 'players', data['lang']) }}:</b> <span id="players">{{
|
|
data['server_stats']['online'] }} / {{ data['server_stats']['max'] }}</span><br />
|
|
{% else %}
|
|
<b>{{ translate('serverStats', 'players', data['lang']) }}:</b> <span id="players">0/0</span><br />
|
|
{% end %}
|
|
</div>
|
|
|
|
<div class="col-sm-3 mr-2">
|
|
{% if data['server_stats']['version'] != 'False' %}
|
|
<b>{{ translate('serverStats', 'version', data['lang']) }}:</b> <span id="version">{{
|
|
data['server_stats']['version'] }}</span><br />
|
|
<b>{{ translate('serverStats', 'description', data['lang']) }}:</b> <span id="input_motd"
|
|
style="max-width: 10px; max-height: 10px" class="input_motd">{{ data['server_stats']['desc'] }}</span>
|
|
<br />
|
|
{% else %}
|
|
<b>{{ translate('serverStats', 'version', data['lang']) }}:</b> <span id="version">{{
|
|
translate('serverStats', 'unableToConnect', data['lang']) }}</span> <br />
|
|
<b>{{ translate('serverStats', 'description', data['lang']) }}:</b> <span
|
|
style="max-width: 10px; max-height: 10px" id="input_motd" class="input_motd">{{ translate('serverStats',
|
|
'unableToConnect', data['lang']) }}</span> <br />
|
|
{% end %}
|
|
<b>Server Type: <span class="text-info">{{data['server_stats']['server_type']}}</span></b>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script src="/static/assets/vendors/moment/moment.min.js" type="text/javascript" charset="utf-8"></script>
|
|
<script src="/static/assets/js/motd.js"></script>
|
|
<script>
|
|
function durationToHumanizedString(duration) {
|
|
duration._data.months += duration._data.years * 12;
|
|
// 30.45833333333 = average month length, calculate with (31+28.5+31+30+31+30+31+31+30+31+30+31) / 12
|
|
duration._data.days += duration._data.months * 30.45833333333;
|
|
duration._data.hours += duration._data.days * 24;
|
|
|
|
let obj = {
|
|
hours: Math.round(duration._data.hours),
|
|
minutes: duration._data.minutes,
|
|
seconds: duration._data.seconds
|
|
}
|
|
|
|
if (Math.round(duration._data.days)) {
|
|
obj = {
|
|
days: Math.round(duration._data.days),
|
|
hours: Math.round(duration._data.hours -= duration._data.days * 24),
|
|
minutes: duration._data.minutes,
|
|
seconds: duration._data.seconds
|
|
}
|
|
}
|
|
|
|
output = Object.entries(obj)
|
|
.map(([type, num]) => {
|
|
// make them strings
|
|
returnData = num + ' ' + type;
|
|
// remove the s in the end if the data is -1 or 1
|
|
if (num == -1 || num == 1)
|
|
returnData = returnData.slice(0, -1)
|
|
return returnData;
|
|
})
|
|
.map((v, i, a) => // example input: [1,2,3], output: "1, 2 and 3"
|
|
v + (i !== a.length - 1
|
|
? i !== a.length - 2
|
|
? ', '
|
|
: ' and '
|
|
: '')).join('');
|
|
return output;
|
|
}
|
|
|
|
let uptime = document.querySelector('#uptime');
|
|
let started = document.querySelector('#started');
|
|
let startedUTC;
|
|
let startedLocal;
|
|
let uptimeLoop;
|
|
|
|
document.body.onload = (() => {
|
|
console.log('calculateTime');
|
|
|
|
startedUTC = "{{ data['server_stats']['started'] }}";
|
|
if (startedUTC != 'False') {
|
|
console.log('started utc:', startedUTC);
|
|
startedUTC = moment.utc(startedUTC, 'YYYY-MM-DD HH:mm:ss');
|
|
|
|
var browserUTCOffset = moment().utcOffset(); // This is in minutes
|
|
|
|
startedLocal = startedUTC.utcOffset(browserUTCOffset);
|
|
startedLocalFormatted = startedLocal.format('YYYY-MM-DD HH:mm:ss');
|
|
|
|
console.log('started local time:', startedLocalFormatted);
|
|
|
|
started.textContent = startedLocalFormatted
|
|
}
|
|
|
|
var calculateUptime = () => {
|
|
var msdiff = moment().diff(startedLocal);
|
|
var diff = moment.duration(msdiff);
|
|
uptime.textContent = durationToHumanizedString(diff);
|
|
}
|
|
|
|
if (uptime != null && started != null) {
|
|
console.log('startedLocal', startedLocal)
|
|
if (startedLocal) {
|
|
calculateUptime();
|
|
uptimeLoop = setInterval(calculateUptime, 1000);
|
|
}
|
|
}
|
|
|
|
initParser('input_motd', 'input_motd');
|
|
|
|
});
|
|
|
|
function update_server_details(server) {
|
|
server_status = document.getElementById('status');
|
|
server_started = document.getElementById('started');
|
|
server_uptime = document.getElementById('uptime');
|
|
server_cpu = document.getElementById('cpu');
|
|
server_mem = document.getElementById('mem');
|
|
server_players = document.getElementById('players');
|
|
server_version = document.getElementById('version');
|
|
server_input_motd = document.getElementById('input_motd');
|
|
|
|
/* TODO Update each element */
|
|
if (server.running) {
|
|
server_status.setAttribute("class", "text-success");
|
|
server_status.innerHTML = `{{ translate('serverStats', 'online', data['lang']) }}`;
|
|
|
|
startedUTC = server.started;
|
|
startedUTC = moment.utc(startedUTC, 'YYYY-MM-DD HH:mm:ss');
|
|
var browserUTCOffset = moment().utcOffset(); // This is in minutes
|
|
startedLocal = startedUTC.utcOffset(browserUTCOffset);
|
|
startedLocalFormatted = startedLocal.format('YYYY-MM-DD HH:mm:ss');
|
|
server_started.setAttribute("class", "");
|
|
server_started.innerHTML = startedLocalFormatted;
|
|
server_uptime.setAttribute("class", "");
|
|
if (!uptimeLoop) {
|
|
var calculateUptime = () => {
|
|
var msdiff = moment().diff(startedLocal);
|
|
var diff = moment.duration(msdiff);
|
|
uptime.textContent = durationToHumanizedString(diff);
|
|
}
|
|
uptimeLoop = setInterval(calculateUptime, 1000);
|
|
}
|
|
}
|
|
else {
|
|
if (server.crashed) {
|
|
server_status.setAttribute("class", "text-danger");
|
|
server_status.innerHTML = `<i class="fas fa-exclamation-triangle"></i> {{ translate('dashboard', 'crashed', data['lang']) }}`;
|
|
server_started.setAttribute("class", "text-danger");
|
|
server_started.innerHTML = `<i class="fas fa-exclamation-triangle"></i> {{ translate('dashboard', 'crashed', data['lang']) }}`;
|
|
clearInterval(uptimeLoop);
|
|
uptimeLoop = null;
|
|
server_uptime.setAttribute("class", "text-danger");
|
|
server_uptime.innerHTML = `<i class="fas fa-exclamation-triangle"></i> {{ translate('dashboard', 'crashed', data['lang']) }}`;
|
|
} else {
|
|
server_status.setAttribute("class", "text-warning");
|
|
server_status.innerHTML = `{{ translate('serverStats', 'offline', data['lang']) }}`;
|
|
server_started.setAttribute("class", "text-warning");
|
|
server_started.innerHTML = `{{ translate('serverStats', 'offline', data['lang']) }}`;
|
|
clearInterval(uptimeLoop);
|
|
uptimeLoop = null;
|
|
server_uptime.setAttribute("class", "text-warning");
|
|
server_uptime.innerHTML = `{{ translate('serverStats', 'offline', data['lang']) }}`;
|
|
}
|
|
}
|
|
|
|
server_cpu.innerHTML = server.cpu + ` %`;
|
|
server_mem.innerHTML = server.mem;
|
|
|
|
if (server.int_ping_results) {
|
|
server_players.innerHTML = server.online + `/` + server.max;
|
|
}
|
|
else {
|
|
server_players.innerHTML = `0/0`;
|
|
}
|
|
|
|
if (server.version) {
|
|
server_version.innerHTML = server.version;
|
|
server_input_motd.innerHTML = server.desc;
|
|
}
|
|
else {
|
|
server_version.innerHTML = `{{ translate('serverStats', 'unableToConnect', data['lang']) }}`;
|
|
server_input_motd.innerHTML = `{{ translate('serverStats', 'unableToConnect', data['lang']) }}`;
|
|
}
|
|
|
|
initParser('input_motd', 'input_motd');
|
|
|
|
}
|
|
|
|
$(window).ready(function () {
|
|
console.log("ready!");
|
|
|
|
//if (webSocket) {
|
|
webSocket.on('update_server_details', update_server_details);
|
|
//}
|
|
});
|
|
</script> |