misc webfront tweaks

This commit is contained in:
RaidMax 2022-07-10 21:06:58 -05:00
parent 540cf7489d
commit f43f7b5040
6 changed files with 78 additions and 67 deletions

View File

@ -35,19 +35,19 @@
@foreach (var social in Model.CommunityInformation.SocialAccounts ?? Array.Empty<SocialAccountConfiguration>()) @foreach (var social in Model.CommunityInformation.SocialAccounts ?? Array.Empty<SocialAccountConfiguration>())
{ {
<div> <div>
<a href="@social.Url" target="_blank" title="@social.Title"> <a href="@social.Url" target="_blank" title="@social.Title" class="d-flex no-decoration">
@if (!string.IsNullOrWhiteSpace(social.IconId)) @if (!string.IsNullOrWhiteSpace(social.IconId))
{ {
<span class="oi @social.IconId"></span> <i class="oi @social.IconId mr-5" style="width: 1.6rem;"></i>
} }
else if (!string.IsNullOrWhiteSpace(social.IconUrl)) else if (!string.IsNullOrWhiteSpace(social.IconUrl))
{ {
var url = Uri.TryCreate(social.IconUrl, UriKind.Absolute, out var parsedUrl) var url = Uri.TryCreate(social.IconUrl, UriKind.Absolute, out var parsedUrl)
? parsedUrl.AbsoluteUri ? parsedUrl.AbsoluteUri
: $"images/community/{social.IconUrl}"; : $"images/community/{social.IconUrl}";
<img class="img-fluid" style="max-width: 1rem; fill: white" src="@url" alt="@social.Title"/> <img class="img-fluid mr-5" style="width: 1.6rem; fill: white" src="@url" alt="@social.Title"/>
} }
<span class="ml-1">@social.Title</span> <div class="ml-1">@social.Title</div>
</a> </a>
</div> </div>
} }

View File

@ -30,67 +30,74 @@
} }
<h4 class="content-title mb-0"> <h4 class="content-title mb-0">
@ViewBag.Localization["WEBFRONT_TITLE_SCOREBOARD"] @ViewBag.Localization["WEBFRONT_TITLE_SCOREBOARD"]
</h4> </h4>
<span class="text-muted"> <span class="text-muted">
<color-code value="@Model.ServerName"></color-code> <color-code value="@Model.ServerName"></color-code>
</span> </span>
<table class="table table-sort mt-15" @if (!Model.ClientInfo.Any())
data-sort-column="@(Model.OrderByKey ?? nameof(ClientScoreboardInfo.Score))" {
data-sort-down="@Model.ShouldOrderDescending.ToString().ToLower()"> <div class="mt-20">@ViewBag.Localization["WEBFRONT_SCOREBOARD_NO_PLAYERS"]</div>
<tr class="bg-dark-dm bg-white-lm d-none d-lg-table-row"> }
<th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.ClientName)">@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_PLAYER"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.ClientName)))</th> else
<th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.Score)">@ViewBag.Localization["WEBFRONT_ADV_STATS_SCORE"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.Score)))</th> {
<th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.Kills)">@ViewBag.Localization["WEBFRONT_ADV_STATS_KILLS"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.Kills)))</th> <table class="table table-sort mt-15"
<th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.Deaths)">@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_DEATHS"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.Deaths)))</th> data-sort-column="@(Model.OrderByKey ?? nameof(ClientScoreboardInfo.Score))"
<th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.Kdr)">@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_RATIO"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.Kdr)))</th> data-sort-down="@Model.ShouldOrderDescending.ToString().ToLower()">
<th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.ScorePerMinute)">@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_SPM"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.ScorePerMinute)))</th> <tr class="bg-dark-dm bg-white-lm d-none d-lg-table-row">
<th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.ZScore)">@ViewBag.Localization["WEBFRONT_ADV_STATS_ZSCORE"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.ZScore)))</th> <th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.ClientName)">@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_PLAYER"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.ClientName)))</th>
<th class="text-right table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.Ping)">@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_PING"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.Ping)))</th> <th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.Score)">@ViewBag.Localization["WEBFRONT_ADV_STATS_SCORE"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.Score)))</th>
</tr> <th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.Kills)">@ViewBag.Localization["WEBFRONT_ADV_STATS_KILLS"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.Kills)))</th>
@foreach (var client in Model.ShouldOrderDescending ? Model.ClientInfo.OrderByDescending(OrderByFunc) : Model.ClientInfo.OrderBy(OrderByFunc)) <th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.Deaths)">@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_DEATHS"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.Deaths)))</th>
{ <th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.Kdr)">@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_RATIO"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.Kdr)))</th>
<!-- desktop --> <th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.ScorePerMinute)">@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_SPM"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.ScorePerMinute)))</th>
<tr class="@GetTeamBackgroundColorClass(client) d-none d-lg-table-row"> <th class="table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.ZScore)">@ViewBag.Localization["WEBFRONT_ADV_STATS_ZSCORE"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.ZScore)))</th>
<td> <th class="text-right table-sort-column" data-column-name="@nameof(ClientScoreboardInfo.Ping)">@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_PING"]@Html.Raw(GetColumnSortDisplay(nameof(ClientScoreboardInfo.Ping)))</th>
<a asp-controller="Client" asp-action="Profile" asp-route-id="@client.ClientId" class="no-decoration text-light-dm text-dark-lm">
<color-code value="@client.ClientName"></color-code>
</a>
</td>
<td>@client.Score</td>
<td>@(client.Kills ?? 0)</td>
<td>@(client.Deaths ?? 0)</td>
<td>@Math.Round(client.Kdr ?? 0, 2)</td>
<td>@Math.Round(client.ScorePerMinute ?? 0)</td>
<td>@(client.ZScore is null or 0 ? "--" : Math.Round(client.ZScore.Value, 2).ToString(CultureInfo.CurrentCulture))</td>
<td class="text-right">@client.Ping</td>
</tr> </tr>
@foreach (var client in Model.ShouldOrderDescending ? Model.ClientInfo.OrderByDescending(OrderByFunc) : Model.ClientInfo.OrderBy(OrderByFunc))
{
<!-- desktop -->
<tr class="@GetTeamBackgroundColorClass(client) d-none d-lg-table-row">
<td>
<a asp-controller="Client" asp-action="Profile" asp-route-id="@client.ClientId" class="no-decoration text-light-dm text-dark-lm">
<color-code value="@client.ClientName"></color-code>
</a>
</td>
<td>@client.Score</td>
<td>@(client.Kills ?? 0)</td>
<td>@(client.Deaths ?? 0)</td>
<td>@Math.Round(client.Kdr ?? 0, 2)</td>
<td>@Math.Round(client.ScorePerMinute ?? 0)</td>
<td>@(client.ZScore is null or 0 ? "--" : Math.Round(client.ZScore.Value, 2).ToString(CultureInfo.CurrentCulture))</td>
<td class="text-right">@client.Ping</td>
</tr>
<tr class="d-table-row d-lg-none d-flex"> <tr class="d-table-row d-lg-none d-flex">
<td class="text-right bg-primary text-light flex-grow-0"> <td class="text-right bg-primary text-light flex-grow-0">
<div>@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_PLAYER"]</div> <div>@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_PLAYER"]</div>
<div>@ViewBag.Localization["WEBFRONT_ADV_STATS_SCORE"]</div> <div>@ViewBag.Localization["WEBFRONT_ADV_STATS_SCORE"]</div>
<div>@ViewBag.Localization["WEBFRONT_ADV_STATS_KILLS"]</div> <div>@ViewBag.Localization["WEBFRONT_ADV_STATS_KILLS"]</div>
<div>@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_DEATHS"]</div> <div>@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_DEATHS"]</div>
<div>@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_RATIO"]</div> <div>@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_RATIO"]</div>
<div>@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_SPM"]</div> <div>@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_SPM"]</div>
<div>@ViewBag.Localization["WEBFRONT_ADV_STATS_ZSCORE"]</div> <div>@ViewBag.Localization["WEBFRONT_ADV_STATS_ZSCORE"]</div>
<div>@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_PING"]</div> <div>@ViewBag.Localization["WEBFRONT_SCOREBOARD_TABLE_PING"]</div>
</td> </td>
<td class="@GetTeamBackgroundColorClass(client) flex-fill"> <td class="@GetTeamBackgroundColorClass(client) flex-fill">
<a asp-controller="Client" asp-action="Profile" asp-route-id="@client.ClientId" class="no-decoration text-light-dm text-dark-lm"> <a asp-controller="Client" asp-action="Profile" asp-route-id="@client.ClientId" class="no-decoration text-light-dm text-dark-lm">
<color-code value="@client.ClientName"></color-code> <color-code value="@client.ClientName"></color-code>
</a> </a>
<div>@client.Score</div> <div>@client.Score</div>
<div>@(client.Kills ?? 0)</div> <div>@(client.Kills ?? 0)</div>
<div>@(client.Deaths ?? 0)</div> <div>@(client.Deaths ?? 0)</div>
<div>@Math.Round(client.Kdr ?? 0, 2)</div> <div>@Math.Round(client.Kdr ?? 0, 2)</div>
<div>@Math.Round(client.ScorePerMinute ?? 0)</div> <div>@Math.Round(client.ScorePerMinute ?? 0)</div>
<div>@(client.ZScore is null or 0 ? "--" : Math.Round(client.ZScore.Value, 2).ToString(CultureInfo.CurrentCulture))</div> <div>@(client.ZScore is null or 0 ? "--" : Math.Round(client.ZScore.Value, 2).ToString(CultureInfo.CurrentCulture))</div>
<div>@client.Ping</div> <div>@client.Ping</div>
</td> </td>
</tr> </tr>
} }
</table> </table>
}

View File

@ -42,7 +42,7 @@
class="text-light align-self-center"> class="text-light align-self-center">
<i class="oi oi-spreadsheet ml-5 mr-5"></i> <i class="oi oi-spreadsheet ml-5 mr-5"></i>
</a> </a>
<span class="ml-5 mr-5 text-light badge font-weight-light" data-toggle="tooltip" data-title="@ViewBag.Localization[$"GAME_{Model.Game}"]">@Utilities.MakeAbbreviation(ViewBag.Localization[$"GAME_{Model.Game}"])</span> <span class="ml-5 mr-5 text-light-dm text-primary-lm badge font-weight-light" data-toggle="tooltip" data-title="@ViewBag.Localization[$"GAME_{Model.Game}"]">@Utilities.MakeAbbreviation(ViewBag.Localization[$"GAME_{Model.Game}"])</span>
</div> </div>
</div> </div>
<!-- second column --> <!-- second column -->

View File

@ -62,7 +62,7 @@
{ {
if (match.IsInterpolation && match.MatchValue == "event") if (match.IsInterpolation && match.MatchValue == "event")
{ {
<span class="text-light">@meta.When.ToStandardFormat()</span> <span class="text-light-dm text-dark-lm">@meta.When.ToStandardFormat()</span>
} }
else else

View File

@ -393,6 +393,8 @@ function renderPerformanceChart() {
position: 'right', position: 'right',
ticks: { ticks: {
precision: 0,
stepSize: 3,
callback: function (value, index, values) { callback: function (value, index, values) {
if (index === values.length - 1) { if (index === values.length - 1) {
return min; return min;

View File

@ -47,7 +47,7 @@ function getStatsChart(id) {
}; };
const options = { const options = {
defaultFontFamily: '-apple-system, BlinkMacSystemFont, "Open Sans", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"', defaultFontFamily: "-apple-system, BlinkMacSystemFont, 'Open Sans', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'",
responsive: true, responsive: true,
maintainAspectRatio: false, maintainAspectRatio: false,
legend: false, legend: false,
@ -69,7 +69,7 @@ function getStatsChart(id) {
elements: { elements: {
line: { line: {
fill: false, fill: false,
borderColor: halfmoon.getPreferredMode() === "light-mode" ? 'rgba(0, 0, 0, 0.85)' : 'rgba(255, 255, 255, 0.75)', borderColor: halfmoon.getPreferredMode() === 'light-mode' ? 'rgba(0, 0, 0, 0.85)' : 'rgba(255, 255, 255, 0.75)',
borderWidth: 2 borderWidth: 2
}, },
point: { point: {
@ -87,6 +87,8 @@ function getStatsChart(id) {
position: 'right', position: 'right',
ticks: { ticks: {
precision: 0,
stepSize: 3,
callback: function (value, index, values) { callback: function (value, index, values) {
if (index === values.length - 1) { if (index === values.length - 1) {
return min; return min;
@ -127,9 +129,9 @@ $(document).ready(function () {
}); });
}); });
$(document).on("loaderFinished", function (event, response) { $(document).on('loaderFinished', function (event, response) {
const ids = $.map($(response).find('.client-rating-graph'), function (elem) { return $(elem).attr('id'); }); const ids = $.map($(response).find('.client-rating-graph'), function (elem) { return $(elem).children('canvas').attr('id'); });
ids.forEach(function (item, index) { ids.forEach(function (item, index) {
getStatsChart($(item).children('canvas').attr('id')); getStatsChart(item);
}); });
}); });