Upstream/Plan
1
0
Fork 0
mirror of https://github.com/plan-player-analytics/Plan.git synced 2025-01-08 17:37:34 +01:00
Code Issues Projects Releases Wiki Activity

Reworked online activity overview graphs

Browse Source 
- Placed all 3 graphs under 3 different tabs
- Renamed 'Unique & New' -> 'Day by Day' graph
- Added PunchCard graph
This commit is contained in:
Rsl1122 2019-08-13 20:45:56 +03:00
parent 417738c560
commit e69944fc2e
6 changed files with 85 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
Plan/common/src/main/java/com/djrapitops/plan/system/json/GraphJSONParser.java
View File

@ -17,6 +17,7 @@
package com.djrapitops.plan.system.json;
import com.djrapitops.plan.data.container.Ping;
import com.djrapitops.plan.data.container.Session;
import com.djrapitops.plan.data.store.mutators.MutatorFunctions;
import com.djrapitops.plan.data.store.mutators.PingMutator;
import com.djrapitops.plan.data.store.mutators.TPSMutator;
@ -25,10 +26,7 @@ import com.djrapitops.plan.data.time.WorldTimes;
import com.djrapitops.plan.db.Database;
import com.djrapitops.plan.db.access.queries.analysis.ActivityIndexQueries;
import com.djrapitops.plan.db.access.queries.analysis.PlayerCountQueries;
import com.djrapitops.plan.db.access.queries.objects.GeoInfoQueries;
import com.djrapitops.plan.db.access.queries.objects.PingQueries;
import com.djrapitops.plan.db.access.queries.objects.TPSQueries;
import com.djrapitops.plan.db.access.queries.objects.WorldTimesQueries;
import com.djrapitops.plan.db.access.queries.objects.*;
import com.djrapitops.plan.system.database.DBSystem;
import com.djrapitops.plan.system.settings.config.PlanConfig;
import com.djrapitops.plan.system.settings.paths.TimeSettings;
@ -187,4 +185,13 @@ public class GraphJSONParser {
",\"avg_ping_series\":" + pingGraph.getAvgGraph().toHighChartsSeries() +
",\"max_ping_series\":" + pingGraph.getMaxGraph().toHighChartsSeries() + '}';
}
public Map<String, Object> punchCardJSONAsMap(UUID serverUUID) {
long now = System.currentTimeMillis();
long monthAgo = now - TimeUnit.DAYS.toMillis(30L);
List<Session> sessions = dbSystem.getDatabase().query(
SessionQueries.fetchServerSessionsWithoutKillOrWorldData(monthAgo, now, serverUUID)
);
return Collections.singletonMap("punchCard", graphs.special().punchCard(sessions).getDots());
}
}

2
Plan/common/src/main/java/com/djrapitops/plan/system/webserver/pages/json/GraphsJSONHandler.java
View File

@ -76,6 +76,8 @@ public class GraphsJSONHandler implements PageHandler {
return new JSONResponse(graphJSON.geolocationGraphsJSONAsMap(serverUUID));
case "ping":
return new JSONResponse(graphJSON.pingGraphsJSON(serverUUID));
case "punchCard":
return new JSONResponse(graphJSON.punchCardJSONAsMap(serverUUID));
default:
throw new BadRequestException("unknown 'type' parameter: " + type);
}

7
Plan/common/src/main/resources/assets/plan/web/js/graphs.js
View File

@ -143,7 +143,8 @@ function onlineActivityCalendar(id, events, firstDay) {
events: events,
height: 'parent',
height: 490,
contentHeight: 485,
header: {
left: 'title',
center: '',
@ -151,9 +152,7 @@ function onlineActivityCalendar(id, events, firstDay) {
}
});
setTimeout(function () {
$(id).fullCalendar('render')
}, 1000);
$(id).fullCalendar('render')
}
function performanceChart(id, playersOnlineSeries, tpsSeries, cpuSeries, ramSeries, entitySeries, chunkSeries) {

91
Plan/common/src/main/resources/assets/plan/web/server.html
View File

@ -338,30 +338,50 @@
</div>
<div class="row">
<!-- New & Unique Players Chart -->
<div class="col-xl-6 col-lg-6 col-sm-12">
<!-- Online Activity Charts -->
<div class="col-xl-12 col-lg-12 col-sm-12">
<div class="card shadow mb-4">
<div
class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
<h6 class="m-0 font-weight-bold col-black"><i
class="fas fa-fw fa-chart-area col-blue"></i>
New & Unique Players</h6>
</div>
<div class="chart-area" id="uniqueChart"><span class="loader"></span></div>
</div>
</div>
<!-- Calendar -->
<div class="col-xl-6 col-lg-6 col-sm-12">
<div class="card shadow mb-4">
<div
class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
<h6 class="m-0 font-weight-bold col-black"><i
class="far fa-fw fa-calendar-alt col-teal"></i>
Calendar</h6>
</div>
<div class="chart-area" id="calendar" style="height: 500px;">
<span class="loader"></span>
<ul class="nav nav-tabs" id="onlineActivityTab" role="tablist">
<li class="nav-item">
<a aria-controls="home" aria-selected="true" class="nav-link active col-black"
data-toggle="tab" href="#unique-tab" id="online-unique-tab" role="tab"><i
class="fa fa-fw fa-chart-area col-blue"></i> Day by Day</a>
</li>
<li class="nav-item">
<a aria-controls="profile" aria-selected="false" class="nav-link col-black"
data-toggle="tab"
href="#calendar-tab" id="online-calendar-tab" role="tab"><i
class="far fa-fw fa-calendar col-teal"></i> Server Calendar</a>
</li>
<li class="nav-item">
<a aria-controls="contact" aria-selected="false" class="nav-link col-black"
data-toggle="tab" href="#punchcard-tab" id="online-punchcard-tab"
role="tab"><i class="fa fa-fw fa-braille col-black"></i> Punchcard
30d</a>
</li>
</ul>
<div class="tab-content" id="onlineActivityTabContent">
<div aria-labelledby="online-unique-tab" class="tab-pane fade show active"
id="unique-tab"
role="tabpanel">
<div class="chart-area" id="uniqueChart"><span class="loader"></span></div>
</div>
<div aria-labelledby="online-calendar-tab" class="tab-pane fade" id="calendar-tab"
role="tabpanel">
<div class="row">
<div class="col-lg-2 col-sm" style="height: 0;"></div>
<div class="col-lg-8 col-sm-12" style="height: 550px;">
<div class="chart-area" id="calendar">
<span class="loader"></span>
</div>
</div>
<div class="col-lg-2 col-sm" style="height: 0;"></div>
</div>
</div>
<div aria-labelledby="online-punchcard-tab" class="tab-pane fade" id="punchcard-tab"
role="tabpanel">
<div class="chart-area" id="punchCard"><span class="loader"></span></div>
</div>
</div>
</div>
</div>
@ -961,7 +981,7 @@
<!-- Performance Charts -->
<div class="col-xl-12 col-lg-12 col-sm-12">
<div class="card shadow mb-4">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<ul class="nav nav-tabs" id="performanceChartTab" role="tablist">
<li class="nav-item">
<a aria-controls="home" aria-selected="true" class="nav-link active col-black"
data-toggle="tab" href="#all" id="performance-all-tab" role="tab"><i
@ -998,7 +1018,7 @@
class="fa fa-fw fa-hdd col-blue-grey"></i> Disk Space</a>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-content" id="performanceChartTabContent">
<div aria-labelledby="performance-all-tab" class="tab-pane fade show active"
id="all"
role="tabpanel">
@ -1603,13 +1623,32 @@
jsonRequest("../v1/graph?type=serverCalendar&server=${serverName}", function (json, error) {
if (json) {
var clicked = false;
$('#online-calendar-tab').click(function () {
if (!clicked) {
onlineActivityCalendar('#calendar', json.data, json.firstDay);
clicked = true;
}
});
$('#calendar').text('');
onlineActivityCalendar('#calendar', json.data, json.firstDay);
} else if (error) {
$('#calendar').text("Failed to load calendar data: " + error)
}
});
jsonRequest("../v1/graph?type=punchCard&server=${serverName}", function (json, error) {
if (json) {
var punchCardSeries = {
name: 'Relative Join Activity',
color: v.colors.punchCard,
data: json.punchCard
};
punchCard('punchCard', punchCardSeries);
} else if (error) {
$('#punchCard').text("Failed to load graph data: " + error)
}
});
setLoadingText('Sorting players table..');
jsonRequest("../v1/players?server=${serverName}", function (playersTableJson, error) {

2
Plan/common/src/main/resources/assets/plan/web/vendor/fullcalendar/fullcalendar.min.css vendored
View File

File diff suppressed because one or more lines are too long

5
Plan/json-endpoints.md
View File

@ -74,8 +74,8 @@ Obtain html for data extension tabs and navigation.
Returns:
```javascript
{
navigation: String (html),
tabs: String (html)
String (html),
tabs;: String (html)
}
```
@ -106,6 +106,7 @@ Type | Description
`activity` | Activity stack graph and pie graph data
`geolocation` | World Map and bar graph data. World Map uses iso-a3 specification of Country codes and Bar graph uses country names.
`ping` | Min, Avg, Max ping graph data.
`punchCard` | PunchCard graph data. (Scatter plot)
### `GET /v1/player`