Add error handling
This commit is contained in:
parent
e1a2d09ee6
commit
661fbce60c
@ -14,6 +14,8 @@ export default class Overlay extends Component {
|
|||||||
super(props);
|
super(props);
|
||||||
this.state = {
|
this.state = {
|
||||||
loading: true,
|
loading: true,
|
||||||
|
hasError: false,
|
||||||
|
|
||||||
loadingPlayerData: true,
|
loadingPlayerData: true,
|
||||||
isConnectedToSocket: false,
|
isConnectedToSocket: false,
|
||||||
id: undefined,
|
id: undefined,
|
||||||
@ -48,43 +50,17 @@ export default class Overlay extends Component {
|
|||||||
this.setupTimer();
|
this.setupTimer();
|
||||||
}
|
}
|
||||||
|
|
||||||
// I'd love if HTTP Status just gave this data lmao
|
async componentDidMount() {
|
||||||
// HttpSiraStatus(https://github.com/denpadokei/HttpSiraStatus) does give this data.
|
if (this.state.hasError) {
|
||||||
isCurrentSongTimeProvided = false;
|
// Reload the page if there has been an error
|
||||||
// we don't need to reset this to false because it is highly unlikely for a player to swap mods within a browser session
|
return Router.reload(window.location.pathname);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
if (this.state.loading === false) {
|
||||||
* Setup the timer for the song time
|
// Just in-case the component decides to reload
|
||||||
*/
|
|
||||||
setupTimer() {
|
|
||||||
setInterval(() => {
|
|
||||||
if (this.isCurrentSongTimeProvided) {
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (!this.state.paused && this.state.beatSaverData !== undefined) {
|
|
||||||
this.setState({ currentSongTime: this.state.currentSongTime + 1 });
|
|
||||||
}
|
|
||||||
}, 1000);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Update the current song time
|
|
||||||
*
|
|
||||||
* @param {[]} data The song data
|
|
||||||
*/
|
|
||||||
handleCurrentSongTime(data) {
|
|
||||||
try {
|
|
||||||
const time = data.status.performance.currentSongTime;
|
|
||||||
if (time !== undefined && time != null) {
|
|
||||||
this.isCurrentSongTimeProvided = true;
|
|
||||||
this.setState({ currentSongTime: time });
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
// do nothing
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async componentDidMount() {
|
|
||||||
console.log("Initializing...");
|
console.log("Initializing...");
|
||||||
this.#_beatSaverURL =
|
this.#_beatSaverURL =
|
||||||
document.location.origin + "/api/beatsaver/map?hash=%s";
|
document.location.origin + "/api/beatsaver/map?hash=%s";
|
||||||
@ -141,6 +117,50 @@ export default class Overlay extends Component {
|
|||||||
this.setState({ loading: false });
|
this.setState({ loading: false });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
static getDerivedStateFromError(error) {
|
||||||
|
return { hasError: true };
|
||||||
|
}
|
||||||
|
|
||||||
|
componentDidCatch(error, errorInfo) {
|
||||||
|
console.log({ error, errorInfo });
|
||||||
|
}
|
||||||
|
|
||||||
|
// I'd love if HTTP Status just gave this data lmao
|
||||||
|
// HttpSiraStatus(https://github.com/denpadokei/HttpSiraStatus) does give this data.
|
||||||
|
isCurrentSongTimeProvided = false;
|
||||||
|
// we don't need to reset this to false because it is highly unlikely for a player to swap mods within a browser session
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Setup the timer for the song time
|
||||||
|
*/
|
||||||
|
setupTimer() {
|
||||||
|
setInterval(() => {
|
||||||
|
if (this.isCurrentSongTimeProvided) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!this.state.paused && this.state.beatSaverData !== undefined) {
|
||||||
|
this.setState({ currentSongTime: this.state.currentSongTime + 1 });
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Update the current song time
|
||||||
|
*
|
||||||
|
* @param {[]} data The song data
|
||||||
|
*/
|
||||||
|
handleCurrentSongTime(data) {
|
||||||
|
try {
|
||||||
|
const time = data.status.performance.currentSongTime;
|
||||||
|
if (time !== undefined && time != null) {
|
||||||
|
this.isCurrentSongTimeProvided = true;
|
||||||
|
this.setState({ currentSongTime: time });
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
// do nothing
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Fetch and update the data from the respective platform
|
* Fetch and update the data from the respective platform
|
||||||
*
|
*
|
||||||
@ -369,7 +389,7 @@ export default class Overlay extends Component {
|
|||||||
websiteType,
|
websiteType,
|
||||||
showPlayerStats,
|
showPlayerStats,
|
||||||
loadingPlayerData,
|
loadingPlayerData,
|
||||||
id
|
id,
|
||||||
} = this.state;
|
} = this.state;
|
||||||
|
|
||||||
if (this.state.textColor !== undefined) {
|
if (this.state.textColor !== undefined) {
|
||||||
|
Reference in New Issue
Block a user