mirror of
https://github.com/plan-player-analytics/Plan.git
synced 2024-12-21 05:50:18 +08:00
Updates HTML files
This commit is contained in:
Fuzzlemann
parent
1f931ed885
commit
71f7210a82
@ -278,6 +278,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body onload="countUpTimer()">
|
||||
@ -382,7 +383,8 @@
|
||||
<i class="fa fa-calendar-plus-o" aria-hidden="true"></i> Total Login times:
|
||||
%totallogins%<br/>
|
||||
<i class="fa fa-user-circle-o" aria-hidden="true"></i> Average Unique Players/Day:
|
||||
%avguniquejoins%<br>
|
||||
%avguniquejoins% | <i class="fa fa-user-plus" aria-hidden="true"></i> Average New/Day:
|
||||
%newperday%<br>
|
||||
<b><i class="fa fa-crosshairs" aria-hidden="true"></i></b> Player kills: %playerkills% | <i
|
||||
class="fa fa-crosshairs" aria-hidden="true"></i> Mob kills: %mobkills% | <i
|
||||
class="fa fa-meh-o" aria-hidden="true"></i> Deaths: %deaths%</p>
|
||||
@ -473,7 +475,9 @@
|
||||
</div>
|
||||
<canvas id="playerChartDay2" width="1000" height="350" style="width: 95%;"></canvas>
|
||||
<p><i class="fa fa-user-circle" aria-hidden="true"></i> Unique Players: %uniquejoinsday% | <i
|
||||
class="fa fa-user-circle-o" aria-hidden="true"></i> Unique/Day: %avguniquejoinsday%</p>
|
||||
class="fa fa-user-circle-o" aria-hidden="true"></i> Unique/Day: %avguniquejoinsday% | <i
|
||||
class="fa fa-user-plus" aria-hidden="true"></i> New/Day: %newperdayday%
|
||||
</p>
|
||||
</div>
|
||||
<div class=" box column">
|
||||
<div class="headerbox">
|
||||
@ -497,7 +501,10 @@
|
||||
</div>
|
||||
<canvas id="playerChartWeek" width="1000" height="350" style="width: 95%;"></canvas>
|
||||
<p><i class="fa fa-user-circle" aria-hidden="true"></i> Unique Players: %uniquejoinsweek% | <i
|
||||
class="fa fa-user-circle-o" aria-hidden="true"></i> Unique/Day: %avguniquejoinsweek%</p>
|
||||
class="fa fa-user-circle-o" aria-hidden="true"></i> Unique/Day: %avguniquejoinsweek% |
|
||||
<i
|
||||
class="fa fa-user-plus" aria-hidden="true"></i> New/Day: %newperdayweek%
|
||||
</p>
|
||||
</div>
|
||||
<div class=" box column">
|
||||
<div class="headerbox">
|
||||
@ -521,7 +528,9 @@
|
||||
</div>
|
||||
<canvas id="playerChartMonth" width="1000" height="350" style="width: 95%;"></canvas>
|
||||
<p><i class="fa fa-user-circle" aria-hidden="true"></i> Unique Players: %uniquejoinsmonth% | <i
|
||||
class="fa fa-user-circle-o" aria-hidden="true"></i> Unique/Day: %avguniquejoinsmonth%
|
||||
class="fa fa-user-circle-o" aria-hidden="true"></i> Unique/Day: %avguniquejoinsmonth% |
|
||||
<i
|
||||
class="fa fa-user-plus" aria-hidden="true"></i> New/Day: %newperdaymonth%
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -717,8 +726,8 @@
|
||||
</div>
|
||||
<div class="box column">
|
||||
<canvas id="cpu24h" width="1000" height="600" style="width: 95%;"></canvas>
|
||||
<p>If Graph displays '-1' usage is not available for this platform.</p>
|
||||
</div>
|
||||
<p>If CPU Graph displays '-1' CPU usage is not available for this platform.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab">
|
||||
@ -855,8 +864,8 @@
|
||||
var x = document.getElementById("main");
|
||||
x.style.transform = "translate3d(0px,0px,0)";
|
||||
x.style.width = "" + navButtons.length * 100 + "%";
|
||||
for (var i = 0; i < navButtons.length; i++) {
|
||||
navButtons[i].onclick = openFunc(i);
|
||||
for (i = 0; i < navButtons.length; i++) {
|
||||
navButtons[i].onclick = openFunc(i)
|
||||
tabs[i].style.width = "" + 100 / navButtons.length + "%";
|
||||
}
|
||||
x.style.opacity = "1";
|
||||
@ -914,6 +923,7 @@
|
||||
setTimeout('countUpTimer()', 1000);
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<script src="https://www.kryogenix.org/code/browser/sorttable/sorttable.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.bundle.js"></script>
|
||||
@ -925,78 +935,144 @@
|
||||
var ctxweek = document.getElementById("playerChartWeek");
|
||||
var ctxmonth = document.getElementById("playerChartMonth");
|
||||
var dataday = {
|
||||
datasets: [
|
||||
{
|
||||
label: "Players Online",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#%playersgraphfill%",
|
||||
borderColor: "#%playersgraphcolor%",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#%playersgraphcolor%",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#%playersgraphcolor%",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %datascatterday% ,
|
||||
datasets: [
|
||||
{
|
||||
label: "Players Online",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#%playersgraphfill%",
|
||||
borderColor: "#%playersgraphcolor%",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#%playersgraphcolor%",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#%playersgraphcolor%",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %datascatterday%
|
||||
},
|
||||
{
|
||||
label: "New Players",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#fff",
|
||||
borderColor: "#7dcc24",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#7dcc24",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#7dcc24",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %npdataday%
|
||||
}]
|
||||
}
|
||||
var dataweek = {
|
||||
datasets: [
|
||||
{
|
||||
label: "Players Online",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#%playersgraphfill%",
|
||||
borderColor: "#%playersgraphcolor%",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#%playersgraphcolor%",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#%playersgraphcolor%",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %datascatterweek% ,
|
||||
datasets: [
|
||||
{
|
||||
label: "Players Online",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#%playersgraphfill%",
|
||||
borderColor: "#%playersgraphcolor%",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#%playersgraphcolor%",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#%playersgraphcolor%",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %datascatterweek% ,
|
||||
},
|
||||
{
|
||||
label: "New Players",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#fff",
|
||||
borderColor: "#7dcc24",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#7dcc24",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#7dcc24",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %npdataweek%
|
||||
}]
|
||||
}
|
||||
var datamonth = {
|
||||
datasets: [
|
||||
{
|
||||
label: "Players Online",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#%playersgraphfill%",
|
||||
borderColor: "#%playersgraphcolor%",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#%playersgraphcolor%",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#%playersgraphcolor%",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %datascattermonth% ,
|
||||
datasets: [
|
||||
{
|
||||
label: "Players Online",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#%playersgraphfill%",
|
||||
borderColor: "#%playersgraphcolor%",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#%playersgraphcolor%",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#%playersgraphcolor%",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %datascattermonth% ,
|
||||
},
|
||||
{
|
||||
label: "New Players",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#fff",
|
||||
borderColor: "#7dcc24",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#7dcc24",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#7dcc24",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %npdatamonth%
|
||||
}]
|
||||
}
|
||||
var playersChartDay = new Chart(ctxday, {
|
||||
@ -1112,6 +1188,7 @@
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// TPS Graph 7d
|
||||
@ -1210,6 +1287,7 @@
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// TPS Graph 24h
|
||||
@ -1308,6 +1386,7 @@
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// CPU Graph 24h
|
||||
@ -1316,6 +1395,7 @@
|
||||
datasets: [
|
||||
{
|
||||
label: "CPU Usage",
|
||||
yAxisID: 'A',
|
||||
fill: false,
|
||||
lineTension: 0.1,
|
||||
borderColor: "#e0d264",
|
||||
@ -1334,6 +1414,27 @@
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %cpuscatterday%
|
||||
}, {
|
||||
label: "Memory Usage",
|
||||
yAxisID: 'B',
|
||||
fill: false,
|
||||
lineTension: 0.1,
|
||||
borderColor: "#7dcc24",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#7dcc24",
|
||||
pointBackgroundColor: "#7dcc24",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#7dcc24",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %ramscatterday%
|
||||
}]
|
||||
};
|
||||
var cpuChart = new Chart(ctxcpu, {
|
||||
@ -1352,6 +1453,7 @@
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
id: 'A',
|
||||
type: 'linear',
|
||||
position: 'left',
|
||||
ticks: {
|
||||
@ -1360,17 +1462,30 @@
|
||||
},
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'CPU Usage'
|
||||
labelString: 'CPU Usage (%)'
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
}, {
|
||||
id: 'B',
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
position: 'right',
|
||||
ticks: {
|
||||
suggestedMax: %maxram%,
|
||||
suggestedMin: 0
|
||||
},
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Memory Usage (Mt)'
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// CPU Graph 7d
|
||||
@ -1379,6 +1494,7 @@
|
||||
datasets: [
|
||||
{
|
||||
label: "CPU Usage",
|
||||
yAxisID: 'A',
|
||||
fill: false,
|
||||
lineTension: 0.1,
|
||||
borderColor: "#e0d264",
|
||||
@ -1397,6 +1513,27 @@
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %cpuscatterweek%
|
||||
}, {
|
||||
label: "Memory Usage",
|
||||
yAxisID: 'B',
|
||||
fill: false,
|
||||
lineTension: 0.1,
|
||||
borderColor: "#7dcc24",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#7dcc24",
|
||||
pointBackgroundColor: "#7dcc24",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#7dcc24",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %ramscatterday%
|
||||
}]
|
||||
};
|
||||
var cpuChart = new Chart(ctxcpu, {
|
||||
@ -1415,6 +1552,7 @@
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
id: 'A',
|
||||
type: 'linear',
|
||||
position: 'left',
|
||||
ticks: {
|
||||
@ -1423,16 +1561,29 @@
|
||||
},
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'CPU Usage'
|
||||
labelString: 'CPU Usage (%)'
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
}, {
|
||||
id: 'B',
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
position: 'right',
|
||||
ticks: {
|
||||
suggestedMax: %maxram%,
|
||||
suggestedMin: 0
|
||||
},
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Memory Usage (Mt)'
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// ActivityPie Graph
|
||||
@ -1460,6 +1611,7 @@
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// GMPie Graph
|
||||
@ -1487,6 +1639,7 @@
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// Session start puchcard bubblechart
|
||||
@ -1568,6 +1721,7 @@
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// Session length distribution barchart
|
||||
@ -1620,6 +1774,7 @@
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<script>
|
||||
// Geolocation map
|
||||
@ -1652,8 +1807,8 @@
|
||||
var layout = {
|
||||
title: '',
|
||||
autosize: false,
|
||||
height: 1000,
|
||||
width: 1500,
|
||||
width: window.innerWidth*0.7,
|
||||
height: window.innerHeight*0.7,
|
||||
geo:{
|
||||
showframe: false,
|
||||
showcoastlines: false,
|
||||
@ -1663,7 +1818,6 @@
|
||||
}
|
||||
};
|
||||
Plotly.plot(CLOROPLETH, data, layout, {showLink: false});
|
||||
|
||||
</script>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
@ -7,313 +7,313 @@
|
||||
<link rel="icon" href="https://puu.sh/tK0KL/6aa2ba141b.ico" type="image/x-icon"/>
|
||||
<script src="https://use.fontawesome.com/df48eb908b.js"></script>
|
||||
<style>
|
||||
header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 88px;
|
||||
padding: 0px;
|
||||
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%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: #5cb239;
|
||||
overflow-x: hidden;
|
||||
transition: 0.5s;
|
||||
padding-top: 88px;
|
||||
text-align: left;
|
||||
}
|
||||
.sidenav p {
|
||||
width: 100%;
|
||||
padding: 8px 8px 8px 16px;
|
||||
text-decoration: none;
|
||||
background-color: #89c471;
|
||||
color: #fff;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 88px;
|
||||
padding: 0px;
|
||||
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%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: #5cb239;
|
||||
overflow-x: hidden;
|
||||
transition: 0.5s;
|
||||
padding-top: 88px;
|
||||
text-align: left;
|
||||
}
|
||||
.sidenav p {
|
||||
width: 100%;
|
||||
padding: 8px 8px 8px 16px;
|
||||
text-decoration: none;
|
||||
background-color: #89c471;
|
||||
color: #fff;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
|
||||
.sidenav a {
|
||||
margin: 10px 0px;
|
||||
width: 100%;
|
||||
padding: 8px 8px 8px 16px;
|
||||
text-decoration: none;
|
||||
background-color: #89c471;
|
||||
font-size: 22px;
|
||||
color: #fff;
|
||||
display: block;
|
||||
transition: 0.3s;
|
||||
z-index: 1;
|
||||
}
|
||||
.sidenav a {
|
||||
margin: 10px 0px;
|
||||
width: 100%;
|
||||
padding: 8px 8px 8px 16px;
|
||||
text-decoration: none;
|
||||
background-color: #89c471;
|
||||
font-size: 22px;
|
||||
color: #fff;
|
||||
display: block;
|
||||
transition: 0.3s;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.sidenav a.active {
|
||||
background-color: #5da341
|
||||
}
|
||||
.sidenav a.active {
|
||||
background-color: #5da341
|
||||
}
|
||||
|
||||
.sidenav a:hover, .offcanvas a:focus{
|
||||
background-color: #5da341;
|
||||
}
|
||||
.sidenav a:hover, .offcanvas a:focus{
|
||||
background-color: #5da341;
|
||||
}
|
||||
|
||||
.main-limiter {
|
||||
margin-left: 15%;
|
||||
width: 85%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.main-limiter {
|
||||
margin-left: 15%;
|
||||
width: 85%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.main-wrapper {
|
||||
padding-top: 88px;
|
||||
transform: translate3d(0, 0, 0);
|
||||
opacity: 0;
|
||||
transition: 1.5s;
|
||||
}
|
||||
.main-wrapper {
|
||||
padding-top: 88px;
|
||||
transform: translate3d(0, 0, 0);
|
||||
opacity: 0;
|
||||
transition: 1.5s;
|
||||
}
|
||||
|
||||
.box {
|
||||
background-color: #fff;
|
||||
padding: 5px;
|
||||
text-decoration: none;
|
||||
color: #000;
|
||||
text-align: left;
|
||||
margin: 5px;
|
||||
padding: 5px;
|
||||
}
|
||||
.box {
|
||||
background-color: #fff;
|
||||
padding: 5px;
|
||||
text-decoration: none;
|
||||
color: #000;
|
||||
text-align: left;
|
||||
margin: 5px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.box p {
|
||||
color: #000;
|
||||
}
|
||||
.box p {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.tab {
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
float: left;
|
||||
display: flex;
|
||||
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;
|
||||
background-color: #348e0f;
|
||||
padding: 8px 14px;
|
||||
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;
|
||||
border-style: solid;
|
||||
border-color: #348e0f;
|
||||
padding: 8px 14px;
|
||||
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;
|
||||
border: none;
|
||||
color: white;
|
||||
outline: 0;
|
||||
text-decoration:none!important;
|
||||
}
|
||||
.button:hover {
|
||||
background-color: #267F00;
|
||||
}
|
||||
.table {
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
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;
|
||||
font-weight: bold;
|
||||
cursor: default;
|
||||
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%;
|
||||
}
|
||||
}
|
||||
.tab {
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
float: left;
|
||||
display: flex;
|
||||
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;
|
||||
background-color: #348e0f;
|
||||
padding: 8px 14px;
|
||||
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;
|
||||
border-style: solid;
|
||||
border-color: #348e0f;
|
||||
padding: 8px 14px;
|
||||
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;
|
||||
border: none;
|
||||
color: white;
|
||||
outline: 0;
|
||||
text-decoration:none!important;
|
||||
}
|
||||
.button:hover {
|
||||
background-color: #267F00;
|
||||
}
|
||||
.table {
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
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;
|
||||
font-weight: bold;
|
||||
cursor: default;
|
||||
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%;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
@ -582,8 +582,8 @@
|
||||
x.style.transform = "translate3d(0px,0px,0)";
|
||||
x.style.width = ""+navButtons.length*100+"%";
|
||||
|
||||
for (var i = 0; i < navButtons.length; i++) {
|
||||
navButtons[i].onclick = openFunc(i);
|
||||
for (i=0; i < navButtons.length; i++) {
|
||||
navButtons[i].onclick = openFunc(i)
|
||||
tabs[i].style.width = ""+100/navButtons.length+"%";
|
||||
}
|
||||
x.style.opacity = "1";
|
||||
@ -714,46 +714,46 @@
|
||||
var ctxweek = document.getElementById("playerChartWeek");
|
||||
var dataweek = {
|
||||
datasets: [{
|
||||
label: "Online",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#%playersgraphfill%",
|
||||
borderColor: "#%playersgraphcolor%",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#%playersgraphcolor%",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#%playersgraphcolor%",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %dataweek% ,
|
||||
label: "Online",
|
||||
fill: true,
|
||||
lineTension: 0.1,
|
||||
backgroundColor: "#%playersgraphfill%",
|
||||
borderColor: "#%playersgraphcolor%",
|
||||
borderCapStyle: 'butt',
|
||||
borderDash: [],
|
||||
borderDashOffset: 0.0,
|
||||
borderJoinStyle: 'miter',
|
||||
pointBorderColor: "#%playersgraphcolor%",
|
||||
pointBackgroundColor: "#fff",
|
||||
pointBorderWidth: 1,
|
||||
pointHoverRadius: 5,
|
||||
pointHoverBackgroundColor: "#%playersgraphcolor%",
|
||||
pointHoverBorderColor: "#8fabc6",
|
||||
pointHoverBorderWidth: 2,
|
||||
pointRadius: 1,
|
||||
pointHitRadius: 10,
|
||||
spanGaps: false,
|
||||
data: %dataweek% ,
|
||||
}]};
|
||||
var playersChartWeek = new Chart(ctxweek, {
|
||||
type: 'scatter',
|
||||
data: dataweek,
|
||||
options: {
|
||||
tooltips: {
|
||||
callbacks: {
|
||||
label: function(tooltipItems, data) {
|
||||
var newDate = new Date();
|
||||
newDate.setTime(tooltipItems.xLabel);
|
||||
dateString = newDate.toUTCString();
|
||||
return dateString +': '+ tooltipItems.yLabel+ ' Players';
|
||||
}
|
||||
}
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
display: true,
|
||||
ticks: {
|
||||
callback: function(value, index, values) {
|
||||
type: 'scatter',
|
||||
data: dataweek,
|
||||
options: {
|
||||
tooltips: {
|
||||
callbacks: {
|
||||
label: function(tooltipItems, data) {
|
||||
var newDate = new Date();
|
||||
newDate.setTime(tooltipItems.xLabel);
|
||||
dateString = newDate.toUTCString();
|
||||
return dateString +': '+ tooltipItems.yLabel+ ' Players';
|
||||
}
|
||||
}
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
display: true,
|
||||
ticks: {
|
||||
callback: function(value, index, values) {
|
||||
switch (value) {
|
||||
case 0:
|
||||
return '0';
|
||||
@ -763,17 +763,17 @@
|
||||
return '';
|
||||
};
|
||||
},
|
||||
suggestedMax: %graphmaxplayers%,
|
||||
suggestedMin: 0
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
suggestedMax: %graphmaxplayers%,
|
||||
suggestedMin: 0
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
display: false
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
var ctxpunch = document.getElementById("punchcard");
|
||||
var datapunch = {
|
||||
datasets: [
|
||||
|
||||
Loading…
Reference in New Issue
Block a user