M_Viper/ts-website
M_Viper
/
ts-website
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added a ban list loader, hiding the table until it fully initializes

This commit is contained in:
Wruczek 2019-01-15 13:29:39 +01:00
parent d36099a8e3
commit 355df433c1
2 changed files with 13 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/js/bans.js
View File

@ -12,6 +12,11 @@ $(document).ready(function() {
language: { language: {
url: "https://cdn.datatables.net/plug-ins/1.10.19/i18n/" + DATATABLES_LANGUAGE_NAME + ".json" url: "https://cdn.datatables.net/plug-ins/1.10.19/i18n/" + DATATABLES_LANGUAGE_NAME + ".json"
}, },
initComplete: function(settings, json) {
console.log("DataTables Loaded")
$("#banlist-loader").hide()
$("#banlist").show()
}
/* /*
TODO: TODO:
It looks better with the "search" text as an placeholder instead of the label It looks better with the "search" text as an placeholder instead of the label

9
src/private/templates/bans.latte
View File

@ -16,6 +16,7 @@
<i class="fas fa-info-circle"></i>{_"BANS_EMPTY"} <i class="fas fa-info-circle"></i>{_"BANS_EMPTY"}
</div> </div>
{else} {else}
<!-- Tip shown when the table shrinks, telling you that you can tap a row to view more -->
<div id="responsive-table-details-tip" class="alert alert-info alert-dismissible fade show" style="display: none" role="alert"> <div id="responsive-table-details-tip" class="alert alert-info alert-dismissible fade show" style="display: none" role="alert">
<i class="fas fa-info-circle"></i>{_"BANS_VIEW_MORE_TIP"} <i class="fas fa-info-circle"></i>{_"BANS_VIEW_MORE_TIP"}
<button type="button" class="close" data-dismiss="alert" aria-label="{_"ARIA_CLOSE"}"> <button type="button" class="close" data-dismiss="alert" aria-label="{_"ARIA_CLOSE"}">
@ -24,6 +25,7 @@
</div> </div>
{if $ipbanned !== false} {if $ipbanned !== false}
<!-- IP ban alert -->
<div class="alert alert-danger ban-alert banned" role="alert"> <div class="alert alert-danger ban-alert banned" role="alert">
<i class="fas fa-exclamation-circle fa-2x"></i> <i class="fas fa-exclamation-circle fa-2x"></i>
<div> <div>
@ -35,7 +37,12 @@
</div> </div>
{/if} {/if}
<table id="banlist" class="table display dt-responsive no-wrap" width="100%"> <!-- Loader shown when DataTables is initialising the table -->
<div id="banlist-loader" class="position-relative p-3">
<div class="loader"></div>
</div>
<table id="banlist" class="table display dt-responsive no-wrap" width="100%" style="display: none">
<thead> <thead>
<tr> <tr>
<th data-priority="1">{_"BANS_HEADER_TARGET"}</th> <th data-priority="1">{_"BANS_HEADER_TARGET"}</th>