From dc07e72fb39a2cc768b8b3553f28f33f53bfd8a5 Mon Sep 17 00:00:00 2001
From: RaidMax <raidmax@live.com>
Date: Thu, 28 Apr 2022 11:42:23 -0500
Subject: [PATCH] improve loading of recent clients

---
 WebfrontCore/Controllers/ActionController.cs  |  5 ++-
 WebfrontCore/Views/Admin/AuditLog.cshtml      |  3 --
 WebfrontCore/Views/Client/Message/Find.cshtml |  3 --
 .../Views/Client/Profile/Index.cshtml         |  1 -
 .../Views/Client/Statistics/Index.cshtml      |  1 -
 WebfrontCore/Views/Penalty/List.cshtml        |  1 -
 .../Components/Client/_RecentClient.cshtml    | 24 -----------
 .../Components/Client/_RecentClients.cshtml   | 42 +++++++++----------
 .../Client/_RecentClientsContainer.cshtml     | 13 ++++++
 WebfrontCore/Views/Shared/_Layout.cshtml      |  1 +
 WebfrontCore/wwwroot/js/loader.js             | 11 ++++-
 11 files changed, 49 insertions(+), 56 deletions(-)
 delete mode 100644 WebfrontCore/Views/Shared/Components/Client/_RecentClient.cshtml
 create mode 100644 WebfrontCore/Views/Shared/Components/Client/_RecentClientsContainer.cshtml

diff --git a/WebfrontCore/Controllers/ActionController.cs b/WebfrontCore/Controllers/ActionController.cs
index 820e923a..6fb7711f 100644
--- a/WebfrontCore/Controllers/ActionController.cs
+++ b/WebfrontCore/Controllers/ActionController.cs
@@ -325,7 +325,10 @@ namespace WebfrontCore.Controllers
             }
             
             var clients = await Manager.GetClientService().GetRecentClients(request);
-            return View("~/Views/Shared/Components/Client/_RecentClients.cshtml", clients);
+
+            return request.Offset == 0
+                ? View("~/Views/Shared/Components/Client/_RecentClientsContainer.cshtml", clients)
+                : View("~/Views/Shared/Components/Client/_RecentClients.cshtml", clients);
         }
         
         public IActionResult RecentReportsForm()
diff --git a/WebfrontCore/Views/Admin/AuditLog.cshtml b/WebfrontCore/Views/Admin/AuditLog.cshtml
index 2e44516c..1acfa035 100644
--- a/WebfrontCore/Views/Admin/AuditLog.cshtml
+++ b/WebfrontCore/Views/Admin/AuditLog.cshtml
@@ -23,9 +23,6 @@
 </div>
 
 @section scripts {
-    <environment include="Development">
-        <script type="text/javascript" src="~/js/loader.js"></script>
-    </environment>
     <script>
         $(document).ready(function () {
             initLoader('/Admin/ListAuditLog', '#audit_log_table_body', @ViewBag.IntialOffset);
diff --git a/WebfrontCore/Views/Client/Message/Find.cshtml b/WebfrontCore/Views/Client/Message/Find.cshtml
index 46d0b381..27488b45 100644
--- a/WebfrontCore/Views/Client/Message/Find.cshtml
+++ b/WebfrontCore/Views/Client/Message/Find.cshtml
@@ -31,9 +31,6 @@ else
     </div>
 
     @section scripts {
-        <environment include="Development">
-            <script type="text/javascript" src="~/js/loader.js"></script>
-        </environment>
         <script>
         $(document).ready(function () {
             initLoader('/Message/FindNext?query=@ViewBag.Query', '#message_table_body', @Model.RetrievedResultCount, @ViewBag.QueryLimit);
diff --git a/WebfrontCore/Views/Client/Profile/Index.cshtml b/WebfrontCore/Views/Client/Profile/Index.cshtml
index bbb1e998..6ca15770 100644
--- a/WebfrontCore/Views/Client/Profile/Index.cshtml
+++ b/WebfrontCore/Views/Client/Profile/Index.cshtml
@@ -346,7 +346,6 @@
 
 @section scripts {
     <environment include="Development">
-        <script type="text/javascript" src="~/js/loader.js"></script>
         <script type="text/javascript" src="~/js/profile.js"></script>
     </environment>
     <script>initLoader('/Client/Meta/@Model.ClientId', '#profile_events', 30, 30, [{ 'name': 'metaFilterType', 'value': '@Model.MetaFilterType' }]);</script>
diff --git a/WebfrontCore/Views/Client/Statistics/Index.cshtml b/WebfrontCore/Views/Client/Statistics/Index.cshtml
index 473b6196..654611f6 100644
--- a/WebfrontCore/Views/Client/Statistics/Index.cshtml
+++ b/WebfrontCore/Views/Client/Statistics/Index.cshtml
@@ -41,7 +41,6 @@
 @section scripts
 {
     <environment include="Development">
-        <script type="text/javascript" src="~/js/loader.js"></script>
         <script type="text/javascript" src="~/js/stats.js"></script>
     </environment>
     <script>initLoader('/Stats/GetTopPlayersAsync', '#topPlayersContainer', 25);</script>
diff --git a/WebfrontCore/Views/Penalty/List.cshtml b/WebfrontCore/Views/Penalty/List.cshtml
index 7b878712..79270c55 100644
--- a/WebfrontCore/Views/Penalty/List.cshtml
+++ b/WebfrontCore/Views/Penalty/List.cshtml
@@ -86,7 +86,6 @@
 
 @section scripts {
     <environment include="Development">
-        <script type="text/javascript" src="~/js/loader.js"></script>
         <script type="text/javascript" src="~/js/penalty.js"></script>
     </environment>
     <script>        
diff --git a/WebfrontCore/Views/Shared/Components/Client/_RecentClient.cshtml b/WebfrontCore/Views/Shared/Components/Client/_RecentClient.cshtml
deleted file mode 100644
index 66399a7c..00000000
--- a/WebfrontCore/Views/Shared/Components/Client/_RecentClient.cshtml
+++ /dev/null
@@ -1,24 +0,0 @@
-@model SharedLibraryCore.Dtos.PlayerInfo
-
-<div class="bg-very-dark-dm bg-light-ex-lm p-15 rounded mb-10">
-    <div class="d-flex flex-row">
-        <a asp-controller="Client" asp-action="Profile" asp-route-id="@Model.ClientId" class="h4 mr-auto">
-            <color-code value="@Model.Name"></color-code>
-        </a>
-        @if (Model.GeoLocationInfo is not null)
-        {
-            @if (!string.IsNullOrEmpty(Model.GeoLocationInfo.CountryCode))
-            {
-                <div data-toggle="tooltip" data-title="@Model.GeoLocationInfo.Country">
-                    <div class="rounded" style="width: 40px; height: 25.66px; background-repeat: no-repeat; background-position: center center; background-image: url('https://flagcdn.com/w40/@(Model.GeoLocationInfo.CountryCode.ToLower()).png')"></div>
-                </div>
-            }
-        }
-    </div>
-    <div class="d-flex flex-row">
-        <has-permission entity="ClientIPAddress" required-permission="Read">
-            <div class="align-self-center mr-auto">@Model.IPAddress</div>
-        </has-permission>
-        <div class="align-self-center text-muted font-size-12">@Model.LastConnection.HumanizeForCurrentCulture()</div>
-    </div>
-</div>
diff --git a/WebfrontCore/Views/Shared/Components/Client/_RecentClients.cshtml b/WebfrontCore/Views/Shared/Components/Client/_RecentClients.cshtml
index 748af3dc..b5e48f29 100644
--- a/WebfrontCore/Views/Shared/Components/Client/_RecentClients.cshtml
+++ b/WebfrontCore/Views/Shared/Components/Client/_RecentClients.cshtml
@@ -3,28 +3,28 @@
     Layout = null;
 }
 
-@if (ViewBag.First)
-{
-    <div class="mb-15 text-center font-weight-lighter">New clients connected in the last <span class="text-primary">24</span> hours</div>
-}
-
 @foreach (var client in Model)
 {
-    @if (ViewBag.First)
-    {
-        <div id="recentClientsContainer">
-            <partial name="~/Views/Shared/Components/Client/_RecentClient.cshtml" for="@client"/>
+    <div class="bg-very-dark-dm bg-light-ex-lm p-15 rounded mb-10">
+        <div class="d-flex flex-row">
+            <a asp-controller="Client" asp-action="Profile" asp-route-id="@client.ClientId" class="h4 mr-auto">
+                <color-code value="@client.Name"></color-code>
+            </a>
+            @if (client.GeoLocationInfo is not null)
+            {
+                @if (!string.IsNullOrEmpty(client.GeoLocationInfo.CountryCode))
+                {
+                    <div data-toggle="tooltip" data-title="@client.GeoLocationInfo.Country">
+                        <div class="rounded" style="width: 40px; height: 25.66px; background-repeat: no-repeat; background-position: center center; background-image: url('https://flagcdn.com/w40/@(client.GeoLocationInfo.CountryCode.ToLower()).png')"></div>
+                    </div>
+                }
+            }
         </div>
-    }
-    else
-    {
-        <partial name="~/Views/Shared/Components/Client/_RecentClient.cshtml" for="@client"/>
-    }
-}
-
-@if (ViewBag.First)
-{
-    <i id="loaderLoad" class="loader-load-more oi oi-chevron-bottom text-center text-primary d-none d-lg-block mt-10"></i>
-
-    <script>initLoader('/Action/RecentClientsForm', '#recentClientsContainer', 20);</script>
+        <div class="d-flex flex-row">
+            <has-permission entity="ClientIPAddress" required-permission="Read">
+                <div class="align-self-center mr-auto">@client.IPAddress</div>
+            </has-permission>
+            <div class="align-self-center text-muted font-size-12">@client.LastConnection.HumanizeForCurrentCulture()</div>
+        </div>
+    </div>
 }
diff --git a/WebfrontCore/Views/Shared/Components/Client/_RecentClientsContainer.cshtml b/WebfrontCore/Views/Shared/Components/Client/_RecentClientsContainer.cshtml
new file mode 100644
index 00000000..9ac51a8f
--- /dev/null
+++ b/WebfrontCore/Views/Shared/Components/Client/_RecentClientsContainer.cshtml
@@ -0,0 +1,13 @@
+@model IEnumerable<SharedLibraryCore.Dtos.PlayerInfo>
+@{
+    Layout = null;
+}
+
+<div class="mb-15 text-center font-weight-lighter">New clients connected in the last <span class="text-primary">24</span> hours</div>
+
+<div id="recentClientContainer">
+    <partial name="~/Views/Shared/Components/Client/_RecentClients.cshtml" for="@Model"/>
+</div>
+
+<i class="loader-load-more oi oi-chevron-bottom text-center text-primary w-full"></i>
+<script>initLoader('/Action/RecentClientsForm', '#recentClientContainer', 20);</script>
diff --git a/WebfrontCore/Views/Shared/_Layout.cshtml b/WebfrontCore/Views/Shared/_Layout.cshtml
index c39617d6..6f05ae81 100644
--- a/WebfrontCore/Views/Shared/_Layout.cshtml
+++ b/WebfrontCore/Views/Shared/_Layout.cshtml
@@ -163,6 +163,7 @@
     <script type="text/javascript" src="~/lib/chart.js/dist/Chart.bundle.min.js"></script>
     <script type="text/javascript" src="~/lib/halfmoon/js/halfmoon.js"></script>
     <script type="text/javascript" src="~/js/action.js"></script>
+    <script type="text/javascript" src="~/js/loader.js"></script>
     <script type="text/javascript" src="~/js/search.js"></script>
 </environment>
 <environment include="Production">
diff --git a/WebfrontCore/wwwroot/js/loader.js b/WebfrontCore/wwwroot/js/loader.js
index 8f0f85e1..95655aa6 100644
--- a/WebfrontCore/wwwroot/js/loader.js
+++ b/WebfrontCore/wwwroot/js/loader.js
@@ -14,11 +14,20 @@ function initLoader(location, loaderId, count = 10, start = count, additional =
     loaderOffset = start;
     additionalParams = additional;
 
-    setupMonitor();
+    try {
+        setupMonitor();
+    }
+    catch {
+        // ignored (can happen when the action modal loader exists but no page level loader does)
+    }
 
     $('#loaderLoad').click(function () {
         loadMoreItems();
     });
+    
+    $('.loader-load-more').click(function() {
+        loadMoreItems();
+    })
 }
 
 function setupMonitor() {