mirror of
https://github.com/plan-player-analytics/Plan.git
synced 2025-03-01 10:41:09 +01:00
Revert changes at analysis.html and player.html
This commit is contained in:
Fuzzlemann
parent
8186f06d96
commit
8121bb758d
@ -43,11 +43,15 @@ public class DataCacheHandler extends SessionCache {
|
||||
|
||||
// Cache
|
||||
private final HashMap<UUID, UserData> dataCache;
|
||||
|
||||
// Plan
|
||||
private final Plan plugin;
|
||||
private final Database db;
|
||||
|
||||
//Cache
|
||||
private Map<String, Integer> commandUse;
|
||||
private List<List<TPS>> unsavedTPSHistory;
|
||||
|
||||
// Queues
|
||||
private DataCacheSaveQueue saveTask;
|
||||
private DataCacheClearQueue clearTask;
|
||||
|
||||
@ -19,17 +19,14 @@
|
||||
background-color: #348e0f;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.header-content {
|
||||
padding: 5px 20px;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: Verdana, sans-serif;
|
||||
background-color: #ddd;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sidenav {
|
||||
height: 100%;
|
||||
width: 15%;
|
||||
@ -42,7 +39,6 @@
|
||||
padding-top: 88px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.sidenav p {
|
||||
width: 100%;
|
||||
padding: 8px 8px 8px 16px;
|
||||
@ -90,8 +86,7 @@
|
||||
.box {
|
||||
background-color: #fff;
|
||||
padding: 5px;
|
||||
text-decoration: none;
|
||||
!important;
|
||||
text-decoration: none;!important;
|
||||
color: #000
|
||||
text-align: left;
|
||||
margin: 5px;
|
||||
@ -101,7 +96,6 @@
|
||||
.box p {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.tab {
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
@ -110,32 +104,26 @@
|
||||
text-align: left;
|
||||
align-content: flex-start;
|
||||
}
|
||||
|
||||
.content {
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.row {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.columns {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.column {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.box-area {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.infobox {
|
||||
margin-left: 3px;
|
||||
color: white;
|
||||
@ -144,28 +132,23 @@
|
||||
border-radius: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.info-text {
|
||||
float: right;
|
||||
width: 50%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.info-number {
|
||||
font-size: x-large;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
float: right;
|
||||
font-size: medium;
|
||||
}
|
||||
|
||||
.info-icon {
|
||||
font-size: xx-large;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.headerbox {
|
||||
color: #348e0f;
|
||||
display: inline-block;
|
||||
@ -175,22 +158,18 @@
|
||||
border-radius: 10px;
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
.header-icon {
|
||||
font-size: xx-large;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.header-text {
|
||||
font-size: x-large;
|
||||
}
|
||||
|
||||
.header-label {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
border: 0px;
|
||||
}
|
||||
|
||||
.button {
|
||||
padding: 8px 14px;
|
||||
background-color: #348e0f;
|
||||
@ -199,11 +178,9 @@
|
||||
outline: 0;
|
||||
text-decoration:none!important;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
background-color: #267F00;
|
||||
}
|
||||
|
||||
.table {
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
@ -212,20 +189,16 @@
|
||||
padding: 8px 14px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
line-height: 270%;
|
||||
}
|
||||
|
||||
.link {
|
||||
color: #348e0f;
|
||||
text-decoration:none!important;
|
||||
}
|
||||
|
||||
.link:hover {
|
||||
color: #267F00;
|
||||
}
|
||||
|
||||
table.sortable thead {
|
||||
background-color: #348e0f;
|
||||
color:#fff;
|
||||
@ -234,89 +207,71 @@
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
table.sortable tbody {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after {
|
||||
content: " \25B4\25BE"
|
||||
}
|
||||
|
||||
.plugin-container {
|
||||
color: #000;
|
||||
height: 100%;
|
||||
max-height: 400px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.plugin-data {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
header img {
|
||||
float: right;
|
||||
padding: 5px;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
header p {
|
||||
float: right;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#navbutton {
|
||||
display: none;
|
||||
font-size: 40px;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 850px) {
|
||||
#navbutton {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.sidenav p {
|
||||
display: none;
|
||||
}
|
||||
|
||||
header {
|
||||
margin: 0px;
|
||||
padding 0px;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
header img {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
header p {
|
||||
margin: 0px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.tab {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.columns {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.row {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.sidenav {
|
||||
width: 0%;
|
||||
transition: 0s;
|
||||
}
|
||||
|
||||
.main-limiter {
|
||||
margin-left: 0%;
|
||||
width: 100%;
|
||||
@ -733,9 +688,6 @@
|
||||
</div>
|
||||
<canvas id="tps7d" width="1000" height="600" style="width: 95%;"></canvas>
|
||||
</div>
|
||||
<div class="box column">
|
||||
<canvas id="cpu7d" width="1000" height="600" style="width: 95%;"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="box column">
|
||||
@ -760,10 +712,6 @@
|
||||
</div>
|
||||
<canvas id="tps24h" width="1000" height="600" style="width: 95%;"></canvas>
|
||||
</div>
|
||||
<div class="box column">
|
||||
<canvas id="cpu24h" width="1000" height="600" style="width: 95%;"></canvas>
|
||||
</div>
|
||||
<p>If CPU Graph displays '-1' CPU usage is not available for this platform.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab">
|
||||
@ -878,28 +826,19 @@
|
||||
</div>
|
||||
<script>
|
||||
// Navigation & Refresh time clock
|
||||
var serverTime = new Date( % currenttime %
|
||||
)
|
||||
;
|
||||
var serverTime = new Date(%currenttime%);
|
||||
var now = new Date();
|
||||
var timediff = serverTime.getTime() - now.getTime();
|
||||
|
||||
function openNav() {
|
||||
document.getElementById("sidenav").style.width = "100%";
|
||||
document.getElementById("limiter").style.display = "none";
|
||||
document.getElementById("navbutton").onclick = function () {
|
||||
closeNav();
|
||||
};
|
||||
document.getElementById("navbutton").onclick = function () { closeNav(); };
|
||||
}
|
||||
|
||||
function closeNav() {
|
||||
document.getElementById("sidenav").style.width = "0%";
|
||||
document.getElementById("limiter").style.display = "block";
|
||||
document.getElementById("navbutton").onclick = function () {
|
||||
openNav();
|
||||
};
|
||||
document.getElementById("navbutton").onclick = function () { openNav(); };
|
||||
}
|
||||
|
||||
var navButtons = document.getElementsByClassName("nav-button");
|
||||
var tabs = document.getElementsByClassName("tab");
|
||||
var slideIndex = window.sessionStorage.getItem("AnalysisSlideIndex");
|
||||
@ -916,7 +855,6 @@
|
||||
x.style.opacity = "1";
|
||||
openFunc(slideIndex)();
|
||||
countUpTimer();
|
||||
|
||||
function openFunc(i) {
|
||||
return function() {
|
||||
if (window.getComputedStyle(document.getElementById("navbutton")).getPropertyValue('display') == "inline") {
|
||||
@ -934,26 +872,17 @@
|
||||
}
|
||||
var perc = - 100 / navButtons.length;
|
||||
slideIndex = i;
|
||||
if (slideIndex > max) {
|
||||
slideIndex = 0
|
||||
}
|
||||
;
|
||||
if (slideIndex < 0) {
|
||||
slideIndex = max
|
||||
}
|
||||
;
|
||||
if (slideIndex > max) {slideIndex = 0};
|
||||
if (slideIndex < 0) {slideIndex = max};
|
||||
window.sessionStorage.setItem("AnalysisSlideIndex", slideIndex);
|
||||
var value = slideIndex * perc;
|
||||
x.style.transition = "0.5s";
|
||||
x.style.transform = "translate3d(" + value + "%,0px,0)";
|
||||
};
|
||||
}
|
||||
|
||||
function countUpTimer() {
|
||||
var now = new Date();
|
||||
var begin = new Date( % refreshlong % -timediff
|
||||
)
|
||||
;
|
||||
var begin = new Date( %refreshlong% - timediff);
|
||||
var out = "";
|
||||
var seconds = now.getTime() - begin.getTime();
|
||||
seconds = Math.floor(seconds / 1000);
|
||||
@ -1011,8 +940,7 @@
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %datascatterday% ,
|
||||
}
|
||||
]
|
||||
}]
|
||||
}
|
||||
var dataweek = {
|
||||
datasets: [
|
||||
@ -1037,8 +965,7 @@
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %datascatterweek% ,
|
||||
}
|
||||
]
|
||||
}]
|
||||
}
|
||||
var datamonth = {
|
||||
datasets: [
|
||||
@ -1063,8 +990,7 @@
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %datascattermonth% ,
|
||||
}
|
||||
]
|
||||
}]
|
||||
}
|
||||
var playersChartDay = new Chart(ctxday, {
|
||||
type: 'scatter',
|
||||
@ -1086,16 +1012,14 @@
|
||||
ticks: {
|
||||
suggestedMax: %graphmaxplayers%
|
||||
}
|
||||
}
|
||||
],
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
})
|
||||
;
|
||||
});
|
||||
var playersChartDay2 = new Chart(ctxday2, {
|
||||
type: 'scatter',
|
||||
data: dataday,
|
||||
@ -1116,16 +1040,14 @@
|
||||
ticks: {
|
||||
suggestedMax: %graphmaxplayers%
|
||||
}
|
||||
}
|
||||
],
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
})
|
||||
;
|
||||
});
|
||||
var playersChartWeek = new Chart(ctxweek, {
|
||||
type: 'scatter',
|
||||
data: dataweek,
|
||||
@ -1146,16 +1068,14 @@
|
||||
ticks: {
|
||||
suggestedMax: %graphmaxplayers%
|
||||
}
|
||||
}
|
||||
],
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
})
|
||||
;
|
||||
});
|
||||
var playersChartMonth = new Chart(ctxmonth, {
|
||||
type: 'scatter',
|
||||
data: datamonth,
|
||||
@ -1176,16 +1096,14 @@
|
||||
ticks: {
|
||||
suggestedMax: %graphmaxplayers%
|
||||
}
|
||||
}
|
||||
],
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
})
|
||||
;
|
||||
});
|
||||
|
||||
</script>
|
||||
<script>
|
||||
@ -1234,12 +1152,9 @@
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
yAxisID: 'B',
|
||||
data:
|
||||
%
|
||||
datascatterweek %
|
||||
data: %datascatterweek%
|
||||
}]
|
||||
}
|
||||
;
|
||||
};
|
||||
var tpsChart = new Chart(ctxtps, {
|
||||
type: 'scatter',
|
||||
data: datatps,
|
||||
@ -1275,13 +1190,9 @@
|
||||
suggestedMax: %graphmaxplayers%,
|
||||
suggestedMin: 0
|
||||
},
|
||||
scaleLabel
|
||||
:
|
||||
{
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString
|
||||
:
|
||||
'Players'
|
||||
labelString: 'Players'
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
@ -1290,8 +1201,7 @@
|
||||
}]
|
||||
}
|
||||
}
|
||||
})
|
||||
;
|
||||
});
|
||||
|
||||
</script>
|
||||
<script>
|
||||
@ -1340,12 +1250,9 @@
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
yAxisID: 'B',
|
||||
data:
|
||||
%
|
||||
datascatterday %
|
||||
data: %datascatterday%
|
||||
}]
|
||||
}
|
||||
;
|
||||
};
|
||||
var tpsChart = new Chart(ctxtps, {
|
||||
type: 'scatter',
|
||||
data: datatps,
|
||||
@ -1380,80 +1287,10 @@
|
||||
ticks: {
|
||||
suggestedMax: %graphmaxplayers%,
|
||||
suggestedMin: 0
|
||||
},
|
||||
scaleLabel
|
||||
:
|
||||
{
|
||||
display: true,
|
||||
labelString
|
||||
:
|
||||
'Players'
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
})
|
||||
;
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// CPU Graph 24h
|
||||
var ctxcpu = document.getElementById("cpu24h");
|
||||
var datacpu = {
|
||||
datasets: [
|
||||
{
|
||||
label: "CPU Usage",
|
||||
fill: false,
|
||||
lineTension: 0.1,
|
||||
borderColor: "#e0d264",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#e0d264",
|
||||
pointBackgroundColor: "#ede5aa",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#e0d264",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: % cpuscatterday %
|
||||
}
|
||||
]
|
||||
}
|
||||
;
|
||||
var cpuChart = new Chart(ctxcpu, {
|
||||
type: 'scatter',
|
||||
data: datacpu,
|
||||
options: {
|
||||
tooltips: {
|
||||
callbacks: {
|
||||
label: function (tooltipItems, data) {
|
||||
var newDate = new Date();
|
||||
newDate.setTime(tooltipItems.xLabel);
|
||||
dateString = newDate.toUTCString();
|
||||
return dateString + ': ' + tooltipItems.yLabel + '%';
|
||||
}
|
||||
}
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
type: 'linear',
|
||||
position: 'left',
|
||||
ticks: {
|
||||
suggestedMax: 100,
|
||||
suggestedMin: 0
|
||||
},
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'CPU Usage'
|
||||
labelString: 'Players'
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
@ -1465,86 +1302,16 @@
|
||||
});
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// CPU Graph 7d
|
||||
var ctxcpu = document.getElementById("cpu7d");
|
||||
var datacpu = {
|
||||
datasets: [
|
||||
{
|
||||
label: "CPU Usage",
|
||||
fill: false,
|
||||
lineTension: 0.1,
|
||||
borderColor: "#e0d264",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#e0d264",
|
||||
pointBackgroundColor: "#ede5aa",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#e0d264",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: % cpuscatterweek %
|
||||
}
|
||||
]
|
||||
}
|
||||
;
|
||||
var cpuChart = new Chart(ctxcpu, {
|
||||
type: 'scatter',
|
||||
data: datacpu,
|
||||
options: {
|
||||
tooltips: {
|
||||
callbacks: {
|
||||
label: function (tooltipItems, data) {
|
||||
var newDate = new Date();
|
||||
newDate.setTime(tooltipItems.xLabel);
|
||||
dateString = newDate.toUTCString();
|
||||
return dateString + ': ' + tooltipItems.yLabel + '%';
|
||||
}
|
||||
}
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
type: 'linear',
|
||||
position: 'left',
|
||||
ticks: {
|
||||
suggestedMax: 100,
|
||||
suggestedMin: 0
|
||||
},
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'CPU Usage'
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
// ActivityPie Graph
|
||||
var ctxactivitypie = document.getElementById("activityPie");
|
||||
var dataActivityPie = {
|
||||
labels: %labelsactivity% ,
|
||||
datasets
|
||||
:
|
||||
[
|
||||
datasets: [
|
||||
{
|
||||
data: %activitydata% ,
|
||||
backgroundColor
|
||||
:
|
||||
[ % activitycolors %
|
||||
],
|
||||
hoverBackgroundColor: [ % activitycolors %
|
||||
]
|
||||
backgroundColor: [ %activitycolors% ],
|
||||
hoverBackgroundColor: [ %activitycolors% ]
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -1567,17 +1334,11 @@
|
||||
var ctxgmpie = document.getElementById("gmPie");
|
||||
var dataGmPie = {
|
||||
labels: %gmlabels% ,
|
||||
datasets
|
||||
:
|
||||
[
|
||||
datasets: [
|
||||
{
|
||||
data: %gmdata% ,
|
||||
backgroundColor
|
||||
:
|
||||
[ % gmcolors %
|
||||
],
|
||||
hoverBackgroundColor: [ % gmcolors %
|
||||
]
|
||||
backgroundColor: [ %gmcolors% ],
|
||||
hoverBackgroundColor: [ %gmcolors% ]
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -1617,7 +1378,6 @@
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
function hour(i) {
|
||||
switch (i) {
|
||||
case 25:
|
||||
@ -1631,22 +1391,16 @@
|
||||
return i + ':00';
|
||||
}
|
||||
}
|
||||
|
||||
var ctxpunch = document.getElementById("punchcard");
|
||||
var datapunch = {
|
||||
datasets: [
|
||||
{
|
||||
label: 'Player Join Punchcard',
|
||||
data: %datapunchcard% ,
|
||||
backgroundColor
|
||||
:
|
||||
"#222",
|
||||
hoverBackgroundColor
|
||||
:
|
||||
"#333",
|
||||
backgroundColor: "#222",
|
||||
hoverBackgroundColor: "#333",
|
||||
}]
|
||||
}
|
||||
;
|
||||
};
|
||||
var punchcardChart = new Chart(ctxpunch, {
|
||||
type: 'bubble',
|
||||
data: datapunch,
|
||||
@ -1688,66 +1442,29 @@
|
||||
var ctxDistribution = document.getElementById("sessiondistribution");
|
||||
var dataDistr = {
|
||||
labels: %labelssessiondistribution%,
|
||||
datasets
|
||||
:
|
||||
[
|
||||
datasets: [
|
||||
{
|
||||
label: 'Session Length Distribution',
|
||||
data: %datasessiondistribution% ,
|
||||
backgroundColor
|
||||
:
|
||||
"#89c471",
|
||||
fill
|
||||
:
|
||||
true,
|
||||
borderColor
|
||||
:
|
||||
"#348e0f",
|
||||
borderCapStyle
|
||||
:
|
||||
'butt',
|
||||
borderDash
|
||||
:
|
||||
[],
|
||||
borderDashOffset
|
||||
:
|
||||
0.0,
|
||||
borderJoinStyle
|
||||
:
|
||||
'miter',
|
||||
pointBorderColor
|
||||
:
|
||||
"#348e0f",
|
||||
pointBackgroundColor
|
||||
:
|
||||
"#fff",
|
||||
pointBorderWidth
|
||||
:
|
||||
1,
|
||||
pointHoverRadius
|
||||
:
|
||||
5,
|
||||
pointHoverBackgroundColor
|
||||
:
|
||||
"#348e0f",
|
||||
pointHoverBorderColor
|
||||
:
|
||||
"#348e0f",
|
||||
pointHoverBorderWidth
|
||||
:
|
||||
2,
|
||||
pointRadius
|
||||
:
|
||||
1,
|
||||
pointHitRadius
|
||||
:
|
||||
10,
|
||||
spanGaps
|
||||
:
|
||||
false,
|
||||
backgroundColor: "#89c471",
|
||||
fill: true,
|
||||
borderColor: "#348e0f",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#348e0f",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#348e0f",
|
||||
pointHoverBorderColor: "#348e0f",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
}]
|
||||
}
|
||||
;
|
||||
};
|
||||
var sessionDistributions = new Chart(ctxDistribution, {
|
||||
type: 'bar',
|
||||
data: dataDistr,
|
||||
@ -1779,53 +1496,27 @@
|
||||
type: 'choropleth',
|
||||
locationmode: "country names",
|
||||
locations: %geomapcountries% ,
|
||||
z
|
||||
: %
|
||||
geomapz % ,
|
||||
text
|
||||
: %
|
||||
geomapcodes % ,
|
||||
colorscale
|
||||
:
|
||||
[
|
||||
z: %geomapz% ,
|
||||
text: %geomapcodes% ,
|
||||
colorscale: [
|
||||
[0, 'rgb(38, 127, 0)'], [1, 'rgb(220, 220, 220)']],
|
||||
autocolorscale
|
||||
:
|
||||
false,
|
||||
reversescale
|
||||
:
|
||||
true,
|
||||
marker
|
||||
:
|
||||
{
|
||||
autocolorscale: false,
|
||||
reversescale: true,
|
||||
marker: {
|
||||
line: {
|
||||
color: 'rgb(100,100,100)',
|
||||
width
|
||||
:
|
||||
0.5
|
||||
width: 0.5
|
||||
}
|
||||
}
|
||||
,
|
||||
},
|
||||
tick0: 0,
|
||||
zmin
|
||||
:
|
||||
0,
|
||||
dtick
|
||||
:
|
||||
1000,
|
||||
colorbar
|
||||
:
|
||||
{
|
||||
zmin: 0,
|
||||
dtick: 1000,
|
||||
colorbar: {
|
||||
autotic: false,
|
||||
tickprefix
|
||||
:
|
||||
'',
|
||||
title
|
||||
:
|
||||
'Players'
|
||||
tickprefix: '',
|
||||
title: 'Players'
|
||||
}
|
||||
}]
|
||||
;
|
||||
}];
|
||||
var layout = {
|
||||
title: '',
|
||||
autosize: true,
|
||||
|
||||
@ -17,17 +17,14 @@
|
||||
background-color: #348e0f;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.header-content {
|
||||
padding: 5px 20px;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: Verdana, sans-serif;
|
||||
background-color: #ddd;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sidenav {
|
||||
height: 100%;
|
||||
width: 15%;
|
||||
@ -40,7 +37,6 @@
|
||||
padding-top: 88px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.sidenav p {
|
||||
width: 100%;
|
||||
padding: 8px 8px 8px 16px;
|
||||
@ -64,7 +60,7 @@
|
||||
}
|
||||
|
||||
.sidenav a.active {
|
||||
background-color: #5da341;
|
||||
background-color: #5da341
|
||||
}
|
||||
|
||||
.sidenav a:hover, .offcanvas a:focus{
|
||||
@ -107,31 +103,25 @@
|
||||
text-align: left;
|
||||
align-content: flex-start;
|
||||
}
|
||||
|
||||
.row {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.content {
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.columns {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.column {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.box-area {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.infobox {
|
||||
margin-left: 3px;
|
||||
color: white;
|
||||
@ -140,28 +130,23 @@
|
||||
border-radius: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.info-text {
|
||||
float: right;
|
||||
width: 50%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.info-number {
|
||||
font-size: x-large;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
float: right;
|
||||
font-size: medium;
|
||||
}
|
||||
|
||||
.info-icon {
|
||||
font-size: xx-large;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.headerbox {
|
||||
color: #348e0f;
|
||||
display: inline-block;
|
||||
@ -171,22 +156,18 @@
|
||||
border-radius: 10px;
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
.header-icon {
|
||||
font-size: xx-large;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.header-text {
|
||||
font-size: x-large;
|
||||
}
|
||||
|
||||
.header-label {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
border: 0px;
|
||||
}
|
||||
|
||||
.button {
|
||||
padding: 8px 14px;
|
||||
background-color: #348e0f;
|
||||
@ -195,11 +176,9 @@
|
||||
outline: 0;
|
||||
text-decoration:none!important;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
background-color: #267F00;
|
||||
}
|
||||
|
||||
.table {
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
@ -208,20 +187,16 @@
|
||||
padding: 8px 14px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
line-height: 270%;
|
||||
}
|
||||
|
||||
.link {
|
||||
color: #348e0f;
|
||||
text-decoration:none!important;
|
||||
}
|
||||
|
||||
.link:hover {
|
||||
color: #267F00;
|
||||
}
|
||||
|
||||
table.sortable thead {
|
||||
background-color: #348e0f;
|
||||
color:#fff;
|
||||
@ -230,142 +205,110 @@
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
table.sortable tbody {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after {
|
||||
content: " \25B4\25BE"
|
||||
}
|
||||
|
||||
.plugin-container {
|
||||
color: #000;
|
||||
height: 100%;
|
||||
max-height: 400px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.plugin-data {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.black {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.darkblue {
|
||||
color: #0000AA;
|
||||
}
|
||||
|
||||
.darkgreen {
|
||||
color: #00AA00;
|
||||
}
|
||||
|
||||
.darkaqua {
|
||||
color: #00AAAA;
|
||||
}
|
||||
|
||||
.darkred {
|
||||
color: #AA0000;
|
||||
}
|
||||
|
||||
.darkpurple {
|
||||
color: #AA00AA;
|
||||
}
|
||||
|
||||
.gold {
|
||||
color: #FFAA00;
|
||||
}
|
||||
|
||||
.gray {
|
||||
color: #AAAAAA;
|
||||
}
|
||||
|
||||
.darkgray {
|
||||
color: #555555;
|
||||
}
|
||||
|
||||
.blue {
|
||||
color: #5555FF;
|
||||
}
|
||||
|
||||
.green {
|
||||
color: #55FF55;
|
||||
}
|
||||
|
||||
.aqua {
|
||||
color: #55FFFF;
|
||||
}
|
||||
|
||||
.red {
|
||||
color: #FF5555;
|
||||
}
|
||||
|
||||
.pink {
|
||||
color: #FF55FF;
|
||||
}
|
||||
|
||||
.yellow {
|
||||
color: #FFFF55;
|
||||
}
|
||||
|
||||
.white {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
#navbutton {
|
||||
display: none;
|
||||
font-size: 40px;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 850px) {
|
||||
#navbutton {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.sidenav p {
|
||||
display: none;
|
||||
}
|
||||
|
||||
header {
|
||||
margin: 0px;
|
||||
padding 0px;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
header img {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
header p {
|
||||
margin: 0px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.tab {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.columns {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.row {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.sidenav {
|
||||
width: 0%;
|
||||
transition: 0s;
|
||||
}
|
||||
|
||||
.main-limiter {
|
||||
margin-left: 0%;
|
||||
width: 100%;
|
||||
@ -615,28 +558,19 @@
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var serverTime = new Date( % currenttime %
|
||||
)
|
||||
;
|
||||
var serverTime = new Date(%currenttime%);
|
||||
var now = new Date();
|
||||
var timediff = serverTime.getTime()-now.getTime();
|
||||
|
||||
function openNav() {
|
||||
document.getElementById("sidenav").style.width = "100%";
|
||||
document.getElementById("limiter").style.display = "none";
|
||||
document.getElementById("navbutton").onclick = function () {
|
||||
closeNav();
|
||||
};
|
||||
document.getElementById("navbutton").onclick = function () { closeNav(); };
|
||||
}
|
||||
|
||||
function closeNav() {
|
||||
document.getElementById("sidenav").style.width = "0%";
|
||||
document.getElementById("limiter").style.display = "block";
|
||||
document.getElementById("navbutton").onclick = function () {
|
||||
openNav();
|
||||
};
|
||||
document.getElementById("navbutton").onclick = function () { openNav(); };
|
||||
}
|
||||
|
||||
var navButtons = document.getElementsByClassName("nav-button");
|
||||
var tabs = document.getElementsByClassName("tab");
|
||||
var slideIndex = window.sessionStorage.getItem("InspectSlideIndex");
|
||||
@ -673,14 +607,8 @@
|
||||
}
|
||||
var perc = -100 / navButtons.length;
|
||||
slideIndex = i;
|
||||
if (slideIndex > max) {
|
||||
slideIndex = 0
|
||||
}
|
||||
;
|
||||
if (slideIndex < 0) {
|
||||
slideIndex = max
|
||||
}
|
||||
;
|
||||
if (slideIndex>max) {slideIndex=0};
|
||||
if (slideIndex<0) {slideIndex=max};
|
||||
window.sessionStorage.setItem("InspectSlideIndex", slideIndex);
|
||||
var value = slideIndex*perc;
|
||||
x.style.transition = "0.5s";
|
||||
@ -690,9 +618,7 @@
|
||||
|
||||
function countUpTimer() {
|
||||
var now = new Date();
|
||||
var begin = new Date( % refreshlong % -timediff
|
||||
)
|
||||
;
|
||||
var begin = new Date(%refreshlong%-timediff);
|
||||
var out = "";
|
||||
|
||||
var seconds = now.getTime() - begin.getTime();
|
||||
@ -742,7 +668,6 @@
|
||||
return i+':00';
|
||||
}
|
||||
}
|
||||
|
||||
function day(i) {
|
||||
switch (i) {
|
||||
case 0:
|
||||
@ -764,21 +689,14 @@
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
// Script for All charts using Chart.js
|
||||
var ctxgmpie = document.getElementById("gmPie");
|
||||
var dataGmPie = {
|
||||
labels: %gmlabels% ,
|
||||
datasets
|
||||
:
|
||||
[{
|
||||
datasets: [{
|
||||
data: %gmdata% ,
|
||||
backgroundColor
|
||||
:
|
||||
[ % gmcolors %
|
||||
],
|
||||
hoverBackgroundColor: [ % gmcolors %
|
||||
]
|
||||
backgroundColor: [ %gmcolors% ],
|
||||
hoverBackgroundColor: [ %gmcolors% ]
|
||||
}]
|
||||
}
|
||||
var GMPie = new Chart(ctxgmpie, {
|
||||
@ -816,10 +734,7 @@
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %dataweek% ,
|
||||
}
|
||||
]
|
||||
}
|
||||
;
|
||||
}]};
|
||||
var playersChartWeek = new Chart(ctxweek, {
|
||||
type: 'scatter',
|
||||
data: dataweek,
|
||||
@ -846,37 +761,29 @@
|
||||
return '1';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
;
|
||||
};
|
||||
},
|
||||
suggestedMax: %graphmaxplayers%,
|
||||
suggestedMin: 0
|
||||
}
|
||||
}
|
||||
],
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
})
|
||||
;
|
||||
});
|
||||
var ctxpunch = document.getElementById("punchcard");
|
||||
var datapunch = {
|
||||
datasets: [
|
||||
{
|
||||
label: 'Player Join Punchcard',
|
||||
data: %datapunchcard%,
|
||||
backgroundColor
|
||||
:
|
||||
"#222",
|
||||
hoverBackgroundColor
|
||||
:
|
||||
"#333",
|
||||
backgroundColor: "#222",
|
||||
hoverBackgroundColor: "#333",
|
||||
}]
|
||||
}
|
||||
;
|
||||
};
|
||||
var punchcardChart = new Chart(ctxpunch, {
|
||||
type: 'bubble',
|
||||
data: datapunch,
|
||||
@ -904,7 +811,6 @@
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
function hour(i) {
|
||||
switch (i) {
|
||||
case 25:
|
||||
@ -918,7 +824,6 @@
|
||||
return i+':00';
|
||||
}
|
||||
}
|
||||
|
||||
return day(tooltipItems.yLabel)+': '+hour(tooltipItems.xLabel);
|
||||
}
|
||||
}
|
||||
@ -948,66 +853,29 @@
|
||||
var ctxDistribution = document.getElementById("sessiondistribution");
|
||||
var dataDistr = {
|
||||
labels: %labelssessiondistribution%,
|
||||
datasets
|
||||
:
|
||||
[
|
||||
datasets: [
|
||||
{
|
||||
label: 'Session Length Distribution',
|
||||
data: %datasessiondistribution%,
|
||||
backgroundColor
|
||||
:
|
||||
"#89c471",
|
||||
fill
|
||||
:
|
||||
true,
|
||||
borderColor
|
||||
:
|
||||
"#348e0f",
|
||||
borderCapStyle
|
||||
:
|
||||
'butt',
|
||||
borderDash
|
||||
:
|
||||
[],
|
||||
borderDashOffset
|
||||
:
|
||||
0.0,
|
||||
borderJoinStyle
|
||||
:
|
||||
'miter',
|
||||
pointBorderColor
|
||||
:
|
||||
"#348e0f",
|
||||
pointBackgroundColor
|
||||
:
|
||||
"#fff",
|
||||
pointBorderWidth
|
||||
:
|
||||
1,
|
||||
pointHoverRadius
|
||||
:
|
||||
5,
|
||||
pointHoverBackgroundColor
|
||||
:
|
||||
"#348e0f",
|
||||
pointHoverBorderColor
|
||||
:
|
||||
"#348e0f",
|
||||
pointHoverBorderWidth
|
||||
:
|
||||
2,
|
||||
pointRadius
|
||||
:
|
||||
1,
|
||||
pointHitRadius
|
||||
:
|
||||
10,
|
||||
spanGaps
|
||||
:
|
||||
false,
|
||||
backgroundColor: "#89c471",
|
||||
fill: true,
|
||||
borderColor: "#348e0f",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#348e0f",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#348e0f",
|
||||
pointHoverBorderColor: "#348e0f",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
}]
|
||||
}
|
||||
;
|
||||
};
|
||||
var sessionDistributions = new Chart(ctxDistribution, {
|
||||
type: 'bar',
|
||||
data: dataDistr,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user