Taiko_Stuff/TaikoLocalServer
1
0
Fork 0
mirror of synced 2025-01-19 00:04:05 +01:00
Code Releases Activity

Fixed scoreboard text update issue

Browse Source 
The scoreboard now properly updates when a new difficulty is selected.

Setting it to "Difficulty.None" defaults to the highest difficulty the player currently has Ranks / Crowns for.

Also removed a bunch of css from the profile.razor file and moved it to a style in app.css.
This commit is contained in:
Farewell_ 2023-12-11 17:30:47 +01:00
parent 5169d30c11
commit 271048ab6a
4 changed files with 140 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
TaikoWebUI/Pages/Profile.razor
View File

@ -70,7 +70,7 @@ else
</MudItem>
</MudGrid>
<MudSelect T="Difficulty" ValueChanged=@UpdateScores Value=@response.AchievementDisplayDifficulty Label="Achievement Panel Difficulty">
<MudSelect T="Difficulty" ValueChanged=@UpdateScoreboard Value=@response.AchievementDisplayDifficulty Label="Achievement Panel Difficulty">
@foreach (var item in Enum.GetValues<Difficulty>())
{
<MudSelectItem Value="@item" />
@ -316,56 +316,61 @@ else
<MudItem style="text-align: center; position:relative;">
@* Achievement panel Text *@
<MudItem Id="scoreboard" Style="position:absolute; top: 0; left:0; right:0; height:100%; width:min(96%, 320px); margin: 0 auto; z-index:2; vertical-align: middle;">
@* First row *@
<MudItem Style="position:absolute; height:18%; width:100%; top:11%">
<MudItem Style="position:absolute; height:100%; width:15%; left:78%">
<MudItem Class="nameplateTextRight">
<MudText Class="nameplateText nameplateTextOutline">@scoresArray[0]</MudText>
<MudText Class="nameplateText">@scoresArray[0]</MudText>
<MudText Class="nameplateText">@scoresArray[0]</MudText>
</MudItem>
</MudItem>
@* Second row *@
<MudItem Style="position:absolute; height:18%; width:100%; top:30%">
<MudItem Style="position:absolute; height:100%; width:15%; left:19%">
<MudItem Class="nameplateTextLeft">
<MudText Class="nameplateText nameplateTextOutline">@scoresArray[1]</MudText>
<MudText Class="nameplateText">@scoresArray[1]</MudText>
</MudItem>
<MudItem Style="position:absolute; height:100%; width:15%; left:48%">
<MudItem Class="nameplateTextCenter">
<MudText Class="nameplateText nameplateTextOutline">@scoresArray[2]</MudText>
<MudText Class="nameplateText">@scoresArray[2]</MudText>
</MudItem>
<MudItem Style="position:absolute; height:100%; width:15%; left:78%">
<MudItem Class="nameplateTextRight">
<MudText Class="nameplateText nameplateTextOutline">@scoresArray[3]</MudText>
<MudText Class="nameplateText">@scoresArray[3]</MudText>
</MudItem>
</MudItem>
@* Third row *@
<MudItem Style="position:absolute; height:18%; width:100%; top:49%">
<MudItem Style="position:absolute; height:100%; width:15%; left:19%">
<MudItem Class="nameplateTextLeft">
<MudText Class="nameplateText nameplateTextOutline">@scoresArray[4]</MudText>
<MudText Class="nameplateText">@scoresArray[4]</MudText>
</MudItem>
<MudItem Style="position:absolute; height:100%; width:15%; left:48%">
<MudItem Class="nameplateTextCenter">
<MudText Class="nameplateText nameplateTextOutline">@scoresArray[5]</MudText>
<MudText Class="nameplateText">@scoresArray[5]</MudText>
</MudItem>
<MudItem Style="position:absolute; height:100%; width:15%; left:78%">
<MudItem Class="nameplateTextRight">
<MudText Class="nameplateText nameplateTextOutline">@scoresArray[6]</MudText>
<MudText Class="nameplateText">@scoresArray[6]</MudText>
</MudItem>
</MudItem>
@* Fourth row (Crowns) *@
<MudItem Style="position:absolute; height:18%; width:100%; top:69%">
<MudItem Style="position:absolute; height:100%; width:15%; left:19%">
<MudItem Class="nameplateTextLeft">
<MudText Class="nameplateText nameplateTextOutline">@scoresArray[7]</MudText>
<MudText Class="nameplateText">@scoresArray[7]</MudText>
</MudItem>
<MudItem Style="position:absolute; height:100%; width:15%; left:48%">
<MudItem Class="nameplateTextCenter">
<MudText Class="nameplateText nameplateTextOutline">@scoresArray[8]</MudText>
<MudText Class="nameplateText">@scoresArray[8]</MudText>
</MudItem>
<MudItem Style="position:absolute; height:100%; width:15%; left:78%">
<MudItem Class="nameplateTextRight">
<MudText Class="nameplateText nameplateTextOutline">@scoresArray[9]</MudText>
<MudText Class="nameplateText">@scoresArray[9]</MudText>
</MudItem>
</MudItem>
</MudItem>
<MudImage Fluid="true" style="position: relative; top: 0;" Src=@($"images/rank_panel_{DifficultySettingCourseStrings[(int) response.AchievementDisplayDifficulty + 1].Replace(' ', '_')}.png") />
@* Forbidden one-liner : Changes the AchievementDisplayDifficulty image asset. When "Difficulty.None" is selected, Defaults to highest difficulty the player currently has crowns / Ranks for. *@
<MudImage Fluid="true" style="position: relative; top: 0;" Src=@($"images/rank_panel_{DifficultySettingCourseStrings[response.AchievementDisplayDifficulty != Difficulty.None ? (int)response.AchievementDisplayDifficulty + 1 : (int)highestDifficulty + 1].Replace(' ', '_')}.png") />
</MudItem>
</MudTabPanel>
}
@ -396,11 +401,18 @@ else
@code {
private async Task UpdateMyDonName()
{
@if (response is not null) await JS.InvokeVoidAsync("updateMyDonName", response.MyDonName);
@if (response is not null) await JS.InvokeVoidAsync("updateMyDonNameText", response.MyDonName);
}
private async Task UpdateTitle()
{
@if (response is not null) await JS.InvokeVoidAsync("updateTitle", response.Title);
@if (response is not null) await
JS.InvokeVoidAsync("updateTitleText", response.Title);
}
private async Task UpdateScoreboard(Difficulty difficulty)
{
UpdateScores(difficulty);
await JS.InvokeVoidAsync("updateScoreboardText", scoresArray);
}
}

67
TaikoWebUI/Pages/Profile.razor.cs
View File

@ -1,4 +1,5 @@
using Microsoft.AspNetCore.Http;
using SharedProject.Enums;
using System.Linq;
using TaikoWebUI.Pages.Dialogs;
using static MudBlazor.CategoryTypes;
@ -174,6 +175,8 @@ public partial class Profile
private Dictionary<Difficulty, List<SongBestData>> songBestDataMap = new();
private Difficulty highestDifficulty = Difficulty.Easy;
private List<int> costumeFlagArraySizes = new();
private int[] scoresArray = new int[10];
@ -183,6 +186,7 @@ public partial class Profile
await base.OnInitializedAsync();
isSavingOptions = false;
response = await Client.GetFromJsonAsync<UserSetting>($"api/UserSettings/{Baid}");
response.ThrowIfNull();
breadcrumbs.Add(new BreadcrumbItem($"Card: {Baid}", href: null, disabled: true));
breadcrumbs.Add(new BreadcrumbItem("Profile", href: $"/Cards/{Baid}/Profile", disabled: false));
@ -209,6 +213,14 @@ public partial class Profile
.CompareTo(GameDataService.GetMusicIndexBySongId(data2.SongId)));
}
for (int i = 0; i < (int)Difficulty.UraOni; i++)
if (songBestDataMap.TryGetValue((Difficulty)i, out var values))
{
highestDifficulty = (Difficulty)i;
}
UpdateScores(response.AchievementDisplayDifficulty);
}
private async Task SaveOptions()
@ -220,23 +232,58 @@ public partial class Profile
private void UpdateScores(Difficulty difficulty)
{
Console.WriteLine("Updating difficulty : " + (int)difficulty);
//Console.WriteLine("Updating difficulty : " + (int)difficulty);
response.ThrowIfNull();
response.AchievementDisplayDifficulty = difficulty;
scoresArray = new int[10];
if (difficulty is not Difficulty.None)
if (songBestDataMap.TryGetValue(difficulty, out var values))
if (difficulty is Difficulty.None) difficulty = highestDifficulty;
if (songBestDataMap.TryGetValue(difficulty, out var values))
{
foreach (var value in values)
{
foreach (var value in values)
//Console.WriteLine("Updating for songId : " + value.SongId);
switch (value.BestScoreRank)
{
Console.WriteLine("Updating for songId : " + value.SongId);
if (value.BestCrown == CrownType.Clear) scoresArray[7]++;
if (value.BestCrown == CrownType.Gold) scoresArray[8]++;
if (value.BestCrown == CrownType.Dondaful) scoresArray[9]++;
case ScoreRank.Dondaful:
scoresArray[0]++;
break;
case ScoreRank.Gold:
scoresArray[1]++;
break;
case ScoreRank.Sakura:
scoresArray[2]++;
break;
case ScoreRank.Purple:
scoresArray[3]++;
break;
case ScoreRank.White:
scoresArray[4]++;
break;
case ScoreRank.Bronze:
scoresArray[5]++;
break;
case ScoreRank.Silver:
scoresArray[6]++;
break;
}
switch (value.BestCrown)
{
case CrownType.Clear:
scoresArray[7]++;
break;
case CrownType.Gold:
scoresArray[8]++;
break;
case CrownType.Dondaful:
scoresArray[9]++;
break;
}
StateHasChanged();
}
}
}
public static string CostumeOrDefault(string file, uint id, string defaultfile)

21
TaikoWebUI/wwwroot/css/app.css
View File

@ -121,4 +121,25 @@ a, .btn-link {
margin: 0 auto;
color: white;
margin: auto auto;
}
.nameplateTextLeft {
position: absolute;
height: 100%;
width: 15%;
left: 19%
}
.nameplateTextCenter {
position: absolute;
height: 100%;
width: 15%;
left: 48%
}
.nameplateTextRight {
position: absolute;
height: 100%;
width: 15%;
left: 78%
}

50
TaikoWebUI/wwwroot/js/updateTextFit.js
View File

@ -9,11 +9,11 @@ const nameplateObserver = new ResizeObserver(handleNameplateResize);
const scoreboardObserver = new ResizeObserver(handleScoreboardResize);
function handleNameplateResize() {
updateNameplate();
fitNameplate();
}
function handleScoreboardResize() {
updateScoreboard();
fitScoreboard();
}
function waitForElm(selector) {
@ -50,14 +50,14 @@ function initNameplate() {
if (window.location.href.indexOf("Profile") > -1) {
waitForElm('#nameplate-title').then((elm) => {
title = elm
waitForElm('#nameplate-name').then((elm) => {
myDonName = elm
waitForElm('#nameplate-name-outline').then((elm) => {
myDonNameOutline = elm
nameplateObserver.observe(document.getElementById('nameplate'));
init = true
});
waitForElm('#nameplate-name').then((elm) => {
myDonName = elm
waitForElm('#nameplate-name-outline').then((elm) => {
myDonNameOutline = elm
nameplateObserver.observe(document.getElementById('nameplate'));
init = true
});
});
});
}
}
@ -71,7 +71,7 @@ function initScoreboard() {
}
}
function updateNameplate() {
function fitNameplate() {
if (title.offsetWidth > 0 && title.offsetHeight > 0) {
textFit(title, { alignHoriz: true, alignVert: true });
textFit(myDonName, { alignHoriz: true, alignVert: true });
@ -79,7 +79,7 @@ function updateNameplate() {
}
}
function updateScoreboard() {
function fitScoreboard() {
if (scoreboard.offsetWidth > 0 && scoreboard.offsetHeight > 0) {
var row = scoreboard.children;
for (var i = 0; i < row.length; i++) {
@ -97,17 +97,37 @@ function updateScoreboard() {
}
// Used to individually update texts on the nameplate
function updateMyDonName(elm) {
function updateMyDonNameText(elm) {
if (init) {
myDonName.textContent = elm
myDonNameOutline.textContent = elm
updateNameplate()
fitNameplate()
}
}
function updateTitle(elm) {
function updateTitleText(elm) {
if (init) {
title.textContent = elm
updateNameplate()
fitNameplate()
}
}
function updateScoreboardText(elm) {
if (init) {
index = 0;
var row = scoreboard.children;
for (var i = 0; i < row.length; i++) {
var column = row[i].children;
for (var j = 0; j < column.length; j++) {
var texts = column[j].children;
for (var k = 0; k < texts.length; k++) {
if (texts[k].offsetWidth > 0 && texts[k].offsetHeight > 0) {
texts[k].textContent = elm[index];
}
}
index++;
}
}
fitScoreboard()
}
}