IW4M-Admin/WebfrontCore/wwwroot/js/server.js

100 lines
3.3 KiB
JavaScript
Raw Normal View History

function getPlayerHistoryChart(playerHistory, i, width, color, maxClients) {
2018-02-21 20:29:23 -05:00
///////////////////////////////////////
// thanks to canvasjs :(
playerHistory.forEach(function (item, i) {
playerHistory[i].x = new Date(playerHistory[i].x);
});
return new CanvasJS.Chart(`server_history_${i}`, {
backgroundColor: '#191919',
2018-02-21 20:29:23 -05:00
height: 100,
width: width,
animationEnabled: true,
toolTip: {
contentFormatter: function (e) {
const date = moment.utc(e.entries[0].dataPoint.x);
return date.local().format('h:mm A') + " - " + e.entries[0].dataPoint.y + " players";
2018-02-21 20:29:23 -05:00
}
},
axisX: {
interval: 1,
gridThickness: 0,
lineThickness: 0,
tickThickness: 0,
margin: 0,
valueFormatString: " "
2018-02-21 20:29:23 -05:00
},
axisY: {
gridThickness: 0,
lineThickness: 0,
tickThickness: 0,
minimum: 0,
maximum: maxClients + 1,
2018-02-21 20:29:23 -05:00
margin: 0,
valueFormatString: " ",
labelMaxWidth: 0
2018-02-21 20:29:23 -05:00
},
legend: {
maxWidth: 0,
maxHeight: 0,
dockInsidePlotArea: true
2018-02-21 20:29:23 -05:00
},
data: [{
showInLegend: false,
type: "splineArea",
color: color,
2018-02-21 20:29:23 -05:00
markerSize: 0,
dataPoints: playerHistory
2018-02-21 20:29:23 -05:00
}]
});
//////////////////////////////////////
}
var charts = {};
$('.server-history-row').each(function (index, element) {
let clientHistory = $(this).data('clienthistory');
let serverId = $(this).data('serverid');
let maxClients = parseInt($('#server_header_' + serverId + ' .server-maxclients').text());
2019-07-27 16:23:45 -04:00
let primaryColor = window.getComputedStyle(document.body).getPropertyValue('--primary').trim();
let color = $(this).data('online') === 'True' ? primaryColor.endsWith('80') ? primaryColor : primaryColor + '80' : '#ff6060';
2018-02-21 20:29:23 -05:00
let width = $('.server-header').first().width();
let historyChart = getPlayerHistoryChart(clientHistory, serverId, width, color, maxClients);
2018-02-21 20:29:23 -05:00
historyChart.render();
charts[serverId] = historyChart;
});
$(window).resize(function () {
$('.server-history-row').each(function (index) {
let serverId = $(this).data('serverid');
charts[serverId].options.width = $('.server-header').first().width();
charts[serverId].render();
2018-02-21 20:29:23 -05:00
});
});
2018-02-21 20:29:23 -05:00
function refreshClientActivity() {
$('.server-history-row').each(function (index) {
let serverId = $(this).data("serverid");
$.get({
url: "/server/clientactivity/" + serverId,
cache: false
})
2018-02-21 20:29:23 -05:00
.done(function (response) {
const clientCount = $(response).find('.col-6 span').length;
$('#server_header_' + serverId + ' .server-clientcount').text(clientCount);
2018-02-21 20:29:23 -05:00
$('#server_clientactivity_' + serverId).html(response);
})
.fail(function (jqxhr, textStatus, error) {
$('#server_clientactivity_' + serverId).html('');
2018-02-21 20:29:23 -05:00
});
});
}
2019-07-19 15:54:39 -04:00
$(document).ready(function () {
$('.server-join-button').click(function (e) {
$(this).children('.server-header-ip-address').show();
});
2019-07-19 15:54:39 -04:00
});
setInterval(refreshClientActivity, 2000);