Added support for loading during song

This commit is contained in:
Liam 2022-10-20 12:40:21 +01:00
parent a7fcd77e1e
commit f2e36347ad
5 changed files with 50 additions and 16 deletions

@ -26,6 +26,7 @@ export default class Overlay extends Component {
showPlayerStats: true, showPlayerStats: true,
showScore: false, showScore: false,
showSongInfo: false, showSongInfo: false,
loadedDuringSong: false,
socket: undefined, socket: undefined,
isVisible: false, isVisible: false,
@ -267,7 +268,7 @@ export default class Overlay extends Component {
* *
* @param {boolean} visible Whether to show info other than the player stats * @param {boolean} visible Whether to show info other than the player stats
*/ */
async resetData(visible) { async resetData(visible, loadedDuringSong = false) {
if (this.state.showPlayerStats == true) { if (this.state.showPlayerStats == true) {
setTimeout(async () => { setTimeout(async () => {
await this.updateData(this.state.id); await this.updateData(this.state.id);
@ -290,6 +291,7 @@ export default class Overlay extends Component {
currentScore: 0, currentScore: 0,
percentage: "100.00%", percentage: "100.00%",
isVisible: visible, isVisible: visible,
loadedDuringSong: loadedDuringSong
}); });
} }
@ -298,9 +300,13 @@ export default class Overlay extends Component {
hello: (data) => { hello: (data) => {
console.log("Hello from HTTP Status!"); console.log("Hello from HTTP Status!");
if (data.status) { if (data.status) {
this.setState({ songData: data }); if (this.state.songData === undefined) {
if (data.status.beatmap) { console.log("Going into level during song, resetting data.");
this.setBeatSaver(data.status.beatmap); this.resetData(true, true);
this.setState({ songData: data, paused: false });
if (data.status.beatmap) {
this.setBeatSaver(data.status.beatmap);
}
} }
} }
}, },
@ -432,6 +438,7 @@ export default class Overlay extends Component {
countryRank={data.countryRank.toLocaleString()} countryRank={data.countryRank.toLocaleString()}
websiteType={websiteType} websiteType={websiteType}
avatar={`/api/steamavatar?steamid=${id}`} avatar={`/api/steamavatar?steamid=${id}`}
loadedDuringSong={this.state.loadedDuringSong}
/> />
) : ( ) : (
<></> <></>

@ -29,6 +29,16 @@ const PlayerStats = (props) => {
countryCode={props.country} countryCode={props.country}
/> />
</div> </div>
{props.loadedDuringSong ? (
<>
<p className={styles.connectedDuringSong}>
Connected during song, some data
</p>
<p className={styles.connectedDuringSong}>
may be incorrect for this song.
</p>
</>
) : null}
</div> </div>
</div> </div>
); );

@ -26,17 +26,25 @@ export default class ScoreStats extends Component {
<p>{data.percentage}</p> <p>{data.percentage}</p>
<p>{data.currentScore.toLocaleString()}</p> <p>{data.currentScore.toLocaleString()}</p>
</div> </div>
<p className={styles.scoreStatsAverageCut}>Average Cut</p> <div>
<div className={styles.scoreStatsHands}> <p className={styles.scoreStatsAverageCut}>Average Cut</p>
<div className={styles.scoreStatsLeft}> <div className={styles.scoreStatsHands}>
<p>{this.getAverage(data.leftHand.averagePreSwing).toFixed(2)}</p> <div className={styles.scoreStatsLeft}>
<p>{this.getAverage(data.leftHand.averagePostSwing).toFixed(2)}</p> <p>{this.getAverage(data.leftHand.averagePreSwing).toFixed(2)}</p>
<p>{this.getAverage(data.leftHand.averageCut).toFixed(2)}</p> <p>
</div> {this.getAverage(data.leftHand.averagePostSwing).toFixed(2)}
<div className={styles.scoreStatsRight}> </p>
<p>{this.getAverage(data.rightHand.averagePreSwing).toFixed(2)}</p> <p>{this.getAverage(data.leftHand.averageCut).toFixed(2)}</p>
<p>{this.getAverage(data.rightHand.averagePostSwing).toFixed(2)}</p> </div>
<p>{this.getAverage(data.rightHand.averageCut).toFixed(2)}</p> <div className={styles.scoreStatsRight}>
<p>
{this.getAverage(data.rightHand.averagePreSwing).toFixed(2)}
</p>
<p>
{this.getAverage(data.rightHand.averagePostSwing).toFixed(2)}
</p>
<p>{this.getAverage(data.rightHand.averageCut).toFixed(2)}</p>
</div>
</div> </div>
</div> </div>
</div> </div>

@ -39,3 +39,7 @@
.playerStats p { .playerStats p {
font-size: 37px; font-size: 37px;
} }
.connectedDuringSong {
font-size: 25px !important;
}

@ -5,6 +5,11 @@
right: 0; right: 0;
margin-right: 5px; margin-right: 5px;
min-width: 135px; min-width: 135px;
display: flex;
justify-content: right;
flex-direction: column;
align-items: right;
} }
.scoreStats p { .scoreStats p {