feat(overlay): add rank colors to score stats
All checks were successful
deploy / deploy (push) Successful in 57s

This commit is contained in:
Lee 2023-11-05 22:30:33 +00:00
parent fadfdee316
commit fb2b72875f
2 changed files with 23 additions and 1 deletions

@ -1,5 +1,6 @@
import { useOverlayDataStore } from "@/store/overlayDataStore"; import { useOverlayDataStore } from "@/store/overlayDataStore";
import { formatNumber } from "@/utils/numberUtils"; import { formatNumber } from "@/utils/numberUtils";
import { accuracyToColor } from "@/utils/songUtils";
import useStore from "@/utils/useStore"; import useStore from "@/utils/useStore";
export default function ScoreStats() { export default function ScoreStats() {
@ -13,7 +14,14 @@ export default function ScoreStats() {
<p className="text-2xl font-bold">{formatNumber(scoreStats.score)}</p> <p className="text-2xl font-bold">{formatNumber(scoreStats.score)}</p>
<p className="text-2xl">Combo: {formatNumber(scoreStats.combo)}x</p> <p className="text-2xl">Combo: {formatNumber(scoreStats.combo)}x</p>
<p className="text-2xl"> <p className="text-2xl">
{scoreStats.rank} {scoreStats.accuracy.toFixed(2)}% <span
style={{
color: accuracyToColor(scoreStats.accuracy),
}}
>
{scoreStats.accuracy == 100 ? "SS" : scoreStats.rank}
</span>{" "}
{scoreStats.accuracy.toFixed(2)}%
</p> </p>
</div> </div>
); );

@ -15,6 +15,20 @@ export function songDifficultyToColor(diff: string) {
} }
} }
export function accuracyToColor(acc: number) {
if (acc >= 90) {
return "rgb(0, 255, 255)";
} else if (acc >= 80) {
return "rgb(255, 255, 255)";
} else if (acc >= 70) {
return "rgb(0, 255, 0)";
} else if (acc >= 60) {
return "rgb(255, 235, 4)";
} else {
return "rgb(255, 0, 0)";
}
}
export function scoresaberDifficultyNumberToName( export function scoresaberDifficultyNumberToName(
diff: number, diff: number,
shortened: boolean = false, shortened: boolean = false,