Add toggle for replacing player info with song info

This commit is contained in:
Liam 2022-10-27 20:16:53 +01:00
parent 00225ad0f0
commit c0c0fa7a53
4 changed files with 48 additions and 49 deletions

View File

@ -16,7 +16,6 @@
"critters": "^0.0.16",
"ioredis": "^5.2.3",
"next": "12",
"next-redux-wrapper": "^8.0.0",
"next-seo": "^5.9.0",
"next-themes": "^0.2.1",
"node-fetch": "^3.2.10",
@ -25,7 +24,6 @@
"react-country-flag": "^3.0.2",
"react-dom": "^18.2.0",
"react-toastify": "^9.0.8",
"redux": "^4.2.0",
"sharp": "^0.31.1"
},
"devDependencies": {

View File

@ -41,6 +41,7 @@ export default class Home extends Component {
showPlayerStats: true,
showScoreInfo: false,
showSongInfo: false,
shouldReplacePlayerInfoWithScore: false,
},
};
}
@ -254,10 +255,7 @@ export default class Home extends Component {
</Radio>
</Radio.Group>
<Spacer y={1} />
<Text>
Do you want to show Player Stats (Current PP, global pos,
etc)
</Text>
<Text>Show player stats (Current PP, global pos, etc)</Text>
<Switch
label="Ranked leaderboard"
onChange={(event) =>
@ -268,8 +266,7 @@ export default class Home extends Component {
/>
<Spacer y={1.2} />
<Text>
Do you want to show Score Info (Current swing values, total
score, etc)
Show score info (Current swing values, total score, etc)
</Text>
<Switch
onChange={(event) =>
@ -279,10 +276,7 @@ export default class Home extends Component {
size="md"
/>
<Spacer y={1.2} />
<Text>
Do you want to show Song Info (Song name, bsr, song art,
etc)
</Text>
<Text>Show song info (Song name, bsr, song art, etc)</Text>
<Switch
onChange={(event) =>
this.updateValue("showSongInfo", event.target.checked)
@ -291,6 +285,21 @@ export default class Home extends Component {
size="md"
/>
<Spacer y={1.2} />
<Text>
Hide player info to hide when a song starts (Show song info
Required)
</Text>
<Switch
onChange={(event) =>
this.updateValue(
"shouldReplacePlayerInfoWithScore",
event.target.checked
)
}
checked={this.state.values.shouldReplacePlayerInfoWithScore}
size="md"
/>
<Spacer y={1.2} />
<Button.Group>
<Button

View File

@ -29,28 +29,37 @@ export default class Overlay extends Component {
this.state = {
hasError: false,
// Steam ID
id: undefined,
// Values from the query parameters
loadingPlayerData: true,
isConnectedToSocket: false,
id: undefined,
isValidSteamId: false,
websiteType: "ScoreSaber",
data: undefined,
showPlayerStats: true,
showScore: false,
showSongInfo: false,
loadedDuringSong: false,
shouldReplacePlayerInfoWithScore: false,
// Internal
loadedDuringSong: false,
socket: undefined,
isVisible: false,
isPlayerInfoVisible: false,
songInfo: undefined,
data: undefined,
beatSaverData: undefined,
currentSongTime: 0,
songInfo: undefined,
mapStarCount: undefined,
// UI elements
isPlayerInfoVisible: false,
isVisible: false,
// Score data
paused: true,
failed: false,
currentSongTime: 0,
currentScore: 0,
percentage: "100.00%",
failed: false,
mapStarCount: undefined,
SaberA: {
cutDistanceScore: 0.0,
averagePreSwing: 0.0,
@ -123,6 +132,10 @@ export default class Overlay extends Component {
shouldConnectSocket = true;
}
if (params.shouldReplacePlayerInfoWithScore === "true") {
this.setState({ shouldReplacePlayerInfoWithScore: true });
}
// Check if the player wants to show the current song
if (params.showSongInfo === "true" || params.songinfo === "true") {
this.setState({ showSongInfo: true });
@ -310,7 +323,7 @@ export default class Overlay extends Component {
}, 1000); // 1 second
}
if (visible) {
if (visible && this.state.shouldReplacePlayerInfoWithScore) {
this.setState({ isPlayerInfoVisible: false });
} else {
this.setState({ isPlayerInfoVisible: true });
@ -442,6 +455,7 @@ export default class Overlay extends Component {
showPlayerStats,
loadingPlayerData,
isPlayerInfoVisible,
shouldReplacePlayerInfoWithScore,
id,
} = this.state;
@ -462,7 +476,10 @@ export default class Overlay extends Component {
</div>
) : (
<div className={styles.overlay}>
{showPlayerStats && !loadingPlayerData && isPlayerInfoVisible ? (
{showPlayerStats &&
!loadingPlayerData &&
isPlayerInfoVisible &&
!shouldReplacePlayerInfoWithScore ? (
<PlayerStats
pp={data.pp.toLocaleString("en-US", {
maximumFractionDigits: 2,
@ -485,8 +502,7 @@ export default class Overlay extends Component {
)}
{this.state.showSongInfo &&
this.state.beatSaverData !== undefined &&
this.state.isVisible &&
!isPlayerInfoVisible ? (
this.state.isVisible ? (
<SongInfo data={this.state} />
) : (
<></>

View File

@ -17,13 +17,6 @@
dependencies:
regenerator-runtime "^0.13.4"
"@babel/runtime@^7.9.2":
version "7.20.0"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.20.0.tgz#824a9ef325ffde6f78056059db3168c08785e24a"
integrity sha512-NDYdls71fTXoU8TZHfbBWg7DiZfNzClcKui/+kyi6ppD2L1qnWW3VV6CjtaBXSUGGhiTWJ6ereOIkUvenif66Q==
dependencies:
regenerator-runtime "^0.13.10"
"@beam-australia/react-env@^3.1.1":
version "3.1.1"
resolved "https://registry.yarnpkg.com/@beam-australia/react-env/-/react-env-3.1.1.tgz#63cb8316861b8fbdb4b9c550a62139cd90675e40"
@ -2332,11 +2325,6 @@ natural-compare@^1.4.0:
resolved "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz"
integrity sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc=
next-redux-wrapper@^8.0.0:
version "8.0.0"
resolved "https://registry.yarnpkg.com/next-redux-wrapper/-/next-redux-wrapper-8.0.0.tgz#588f2d89146c60c77d4a40c0af7e5282acfe4773"
integrity sha512-zKRdpvDeqNXQr1j5DUWwsB2fz6XpHR32iy2qJGItTKLsbLB9GvtxDL9b4mFCfhDvnzy5dw97UqMjWDpFY8h0zA==
next-seo@^5.9.0:
version "5.9.0"
resolved "https://registry.yarnpkg.com/next-seo/-/next-seo-5.9.0.tgz#1bc68a25677f0459609c587264c5ee90a2a00730"
@ -2732,18 +2720,6 @@ redis-parser@^3.0.0:
dependencies:
redis-errors "^1.0.0"
redux@^4.2.0:
version "4.2.0"
resolved "https://registry.yarnpkg.com/redux/-/redux-4.2.0.tgz#46f10d6e29b6666df758780437651eeb2b969f13"
integrity sha512-oSBmcKKIuIR4ME29/AeNUnl5L+hvBq7OaJWzaptTQJAntaPvxIJqfnjbaEiCzzaIz+XmVILfqAM3Ob0aXLPfjA==
dependencies:
"@babel/runtime" "^7.9.2"
regenerator-runtime@^0.13.10:
version "0.13.10"
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.10.tgz#ed07b19616bcbec5da6274ebc75ae95634bfc2ee"
integrity sha512-KepLsg4dU12hryUO7bp/axHAKvwGOCV0sGloQtpagJ12ai+ojVDqkeGSiRX1zlq+kjIMZ1t7gpze+26QqtdGqw==
regenerator-runtime@^0.13.4:
version "0.13.9"
resolved "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz"