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,
showScore: false,
showSongInfo: false,
loadedDuringSong: false,
socket: undefined,
isVisible: false,
@ -267,7 +268,7 @@ export default class Overlay extends Component {
*
* @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) {
setTimeout(async () => {
await this.updateData(this.state.id);
@ -290,6 +291,7 @@ export default class Overlay extends Component {
currentScore: 0,
percentage: "100.00%",
isVisible: visible,
loadedDuringSong: loadedDuringSong
});
}
@ -298,9 +300,13 @@ export default class Overlay extends Component {
hello: (data) => {
console.log("Hello from HTTP Status!");
if (data.status) {
this.setState({ songData: data });
if (data.status.beatmap) {
this.setBeatSaver(data.status.beatmap);
if (this.state.songData === undefined) {
console.log("Going into level during song, resetting data.");
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()}
websiteType={websiteType}
avatar={`/api/steamavatar?steamid=${id}`}
loadedDuringSong={this.state.loadedDuringSong}
/>
) : (
<></>

@ -29,6 +29,16 @@ const PlayerStats = (props) => {
countryCode={props.country}
/>
</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>
);

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

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

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