From b3e5f468a1724e3e80b370aeb58067a9f9c08b03 Mon Sep 17 00:00:00 2001
From: RaidMax <raidmax@live.com>
Date: Wed, 27 Feb 2019 20:13:15 -0600
Subject: [PATCH] finish implementation of per server top stats page

---
 Plugins/Stats/Controllers/StatsController.cs  |  2 +-
 Plugins/Stats/Helpers/StatManager.cs          |  1 +
 .../Stats/Components/TopPlayers/_List.cshtml  |  2 +-
 Plugins/Web/StatsWeb/Views/Stats/Index.cshtml |  9 ++++-----
 WebfrontCore/wwwroot/css/bootstrap-custom.css | 17 ++++++++++++-----
 .../wwwroot/css/bootstrap-custom.scss         | 19 ++++++++++++++-----
 WebfrontCore/wwwroot/js/loader.js             |  4 ++--
 WebfrontCore/wwwroot/js/stats.js              |  4 +++-
 8 files changed, 38 insertions(+), 20 deletions(-)

diff --git a/Plugins/Stats/Controllers/StatsController.cs b/Plugins/Stats/Controllers/StatsController.cs
index bbc2f77dd..0ea8df0aa 100644
--- a/Plugins/Stats/Controllers/StatsController.cs
+++ b/Plugins/Stats/Controllers/StatsController.cs
@@ -18,7 +18,7 @@ namespace IW4MAdmin.Plugins.Stats.Web.Controllers
         {
             ViewBag.Title = Utilities.CurrentLocalization.LocalizationIndex.Set["WEBFRONT_STATS_INDEX_TITLE"];
             ViewBag.Description = Utilities.CurrentLocalization.LocalizationIndex.Set["WEBFRONT_STATS_INDEX_DESC"];
-            ViewBag.Servers = Manager.GetServers().Select(_server => new ServerInfo() { Name = _server.Hostname, ID = _server.GetHashCode() });
+            ViewBag.Servers = Manager.GetServers().Select(_server => new ServerInfo() { Name = _server.Hostname, ID = _server.EndPoint });
 
             return View("Index");
         }
diff --git a/Plugins/Stats/Helpers/StatManager.cs b/Plugins/Stats/Helpers/StatManager.cs
index 871b99d74..ab7eb1e3f 100644
--- a/Plugins/Stats/Helpers/StatManager.cs
+++ b/Plugins/Stats/Helpers/StatManager.cs
@@ -155,6 +155,7 @@ namespace IW4MAdmin.Plugins.Stats.Helpers
                 var finished = topPlayers.Select(s => new TopStatsInfo()
                 {
                     ClientId = s.ClientId,
+                    Id = (int?)serverId ?? 0,
                     Deaths = s.Deaths,
                     Kills = s.Kills,
                     KDR = Math.Round(s.KDR, 2),
diff --git a/Plugins/Web/StatsWeb/Views/Stats/Components/TopPlayers/_List.cshtml b/Plugins/Web/StatsWeb/Views/Stats/Components/TopPlayers/_List.cshtml
index c67bee115..d9afb1e9d 100644
--- a/Plugins/Web/StatsWeb/Views/Stats/Components/TopPlayers/_List.cshtml
+++ b/Plugins/Web/StatsWeb/Views/Stats/Components/TopPlayers/_List.cshtml
@@ -61,7 +61,7 @@
             <span class="text-muted">@loc["WEBFRONT_PROFILE_LSEEN"]</span><span class="text-primary"> @stat.LastSeen </span><span class="text-muted">@loc["WEBFRONT_PENALTY_TEMPLATE_AGO"]</span>
         </div>
 
-        <div class="col-md-6 client-rating-graph" id="rating_history_@stat.ClientId" data-history="@Html.Raw(Json.Serialize(stat.PerformanceHistory))">
+        <div class="col-md-6 client-rating-graph" id="rating_history_@(stat.ClientId + "_" + stat.Id)" data-history="@Html.Raw(Json.Serialize(stat.PerformanceHistory))">
 
         </div>
 
diff --git a/Plugins/Web/StatsWeb/Views/Stats/Index.cshtml b/Plugins/Web/StatsWeb/Views/Stats/Index.cshtml
index e9e361f46..26c03c37d 100644
--- a/Plugins/Web/StatsWeb/Views/Stats/Index.cshtml
+++ b/Plugins/Web/StatsWeb/Views/Stats/Index.cshtml
@@ -1,4 +1,4 @@
-<ul class="nav nav-tabs" role="tablist" id="stats_top_players">
+<ul class="nav nav-tabs border-top" role="tablist" id="stats_top_players">
     <li class="nav-item">
         <a class="nav-link active top-players-link" href="#server_0" role="tab" data-toggle="tab" aria-selected="true" data-serverid="0">All Servers</a>
     </li>
@@ -11,15 +11,14 @@
     }
 </ul>
 
-<div class="tab-content striped border-bottom">
+<div class="tab-content border-bottom">
     <div role="tabpanel" class="tab-pane active" id="server_0">
-        @await Component.InvokeAsync("TopPlayers", new { count = 50, offset = 0 })
+        @await Component.InvokeAsync("TopPlayers", new { count = 10, offset = 0 })
     </div>
 
     @foreach (var server in ViewBag.Servers)
     {
         <div role="tabpanel" class="tab-pane" id="server_@server.ID">
-            @await Component.InvokeAsync("TopPlayers", new { count = 50, offset = 0, serverId = server.ID })
         </div>
     }
 </div>
@@ -30,5 +29,5 @@
         <script type="text/javascript" src="~/js/loader.js"></script>
         <script type="text/javascript" src="~/js/stats.js"></script>
     </environment>
-    <script>initLoader('/Stats/GetTopPlayersAsync', '#server_0', 50);</script>
+    <script>initLoader('/Stats/GetTopPlayersAsync', '#server_0', 10);</script>
 }
diff --git a/WebfrontCore/wwwroot/css/bootstrap-custom.css b/WebfrontCore/wwwroot/css/bootstrap-custom.css
index ea0af9ad6..408974946 100644
--- a/WebfrontCore/wwwroot/css/bootstrap-custom.css
+++ b/WebfrontCore/wwwroot/css/bootstrap-custom.css
@@ -6418,20 +6418,27 @@ form *, select {
   right: 1em; }
 
 .nav-tabs, .nav-tabs .nav-link.active {
-  border-color: #007ACC;
+  border-width: 0;
+  color: #007ACC;
   background-color: rgba(0, 0, 0, 0.2);
   color: #fff !important; }
 
+.nav-tabs .nav-link.active {
+  border-bottom-width: 1px;
+  border-bottom-color: #007ACC !important; }
+
 .nav-tabs .nav-link:hover {
-  border-color: #007ACC;
-  background-color: rgba(0, 0, 0, 0.2);
-  border-width: 2px; }
+  background-color: #222222;
+  color: #007ACC;
+  border-width: 0 0 1px 0;
+  border-bottom-color: #007ACC; }
 
 .nav-tabs .nav-link {
   border-radius: 0;
   padding: 1rem;
   color: #6c757d;
-  border-width: 2px; }
+  border-width: 0 0 1px 0;
+  border-bottom-color: transparent; }
 
 .nav-tabs .nav-link.active {
   border-bottom-color: transparent; }
diff --git a/WebfrontCore/wwwroot/css/bootstrap-custom.scss b/WebfrontCore/wwwroot/css/bootstrap-custom.scss
index 9e6eadea6..aec928600 100644
--- a/WebfrontCore/wwwroot/css/bootstrap-custom.scss
+++ b/WebfrontCore/wwwroot/css/bootstrap-custom.scss
@@ -221,22 +221,31 @@ form *, select {
 }
 
 .nav-tabs, .nav-tabs .nav-link.active {
-    border-color: $blue;
+    border-width: 0;
+    color: $blue;
     background-color: rgba(0, 0, 0, 0.2);
     color: $white !important;
 }
 
+.nav-tabs .nav-link.active
+{
+    border-bottom-width: 1px;
+    border-bottom-color: $blue !important;
+}
+
 .nav-tabs .nav-link:hover {
-    border-color: $blue;
-    background-color: rgba(0, 0, 0, 0.2);
-    border-width: 2px;
+    background-color: #222222;
+    color: $blue;
+    border-width: 0 0 1px 0;
+    border-bottom-color: $blue;
 }
 
 .nav-tabs .nav-link {
     border-radius: 0;
     padding: 1rem;
     color: #6c757d;
-    border-width: 2px;
+    border-width: 0 0 1px 0;
+    border-bottom-color: transparent;
 }
 
 .nav-tabs .nav-link.active {
diff --git a/WebfrontCore/wwwroot/js/loader.js b/WebfrontCore/wwwroot/js/loader.js
index b6513b7d8..944800aad 100644
--- a/WebfrontCore/wwwroot/js/loader.js
+++ b/WebfrontCore/wwwroot/js/loader.js
@@ -4,11 +4,11 @@ let isLoaderLoading = false;
 let loadUri = '';
 let loaderResponseId = '';
 
-function initLoader(location, loaderId, count = 10) {
+function initLoader(location, loaderId, count = 10, start = count) {
     loadUri = location;
     loaderResponseId = loaderId;
     loadCount = count;
-    loaderOffset = count;
+    loaderOffset = start;
     setupListeners();
 }
 
diff --git a/WebfrontCore/wwwroot/js/stats.js b/WebfrontCore/wwwroot/js/stats.js
index bb80a74db..1728fadd9 100644
--- a/WebfrontCore/wwwroot/js/stats.js
+++ b/WebfrontCore/wwwroot/js/stats.js
@@ -74,7 +74,9 @@ $(document).ready(function () {
     });
 
     $('.top-players-link').click(function (event) {
-        initLoader('/Stats/GetTopPlayersAsync?serverId=' + $(this).data('serverid'), $(this).attr('href'), 50);
+        $($(this).attr('href')).html('');
+        initLoader('/Stats/GetTopPlayersAsync?serverId=' + $(this).data('serverid'), $(this).attr('href'), 10, 0);
+        loadMoreItems();
     });
 });