1
0

Loading, but then server locks

Signed-off-by: James Ketrenos <james_eikona@ketrenos.com>
This commit is contained in:
James Ketrenos 2022-01-26 13:46:39 -08:00
parent 5544485e30
commit 650462004c
2 changed files with 64 additions and 59 deletions

View File

@ -25,7 +25,7 @@ function App() {
return (
<Router>
<Routes>
<Route element={<Board/>} path={`${base}/games/:id`}/>
<Route exact element={<Board/>} path={`${base}/games/:id`}/>
<Route exact element={<Board/>} path={`${base}`}/>
</Routes>
</Router>

View File

@ -1,6 +1,6 @@
import React, { useState, useEffect } from "react";
import "./Board.css";
//import history from "./history.js";
import history from "./history.js";
import Paper from '@material-ui/core/Paper';
import TextField from '@material-ui/core/TextField';
import List from '@material-ui/core/List';
@ -423,55 +423,7 @@ class Board extends React.Component {
settlement: null
};
const params = {};
if (props.router && props.router.params.id) {
console.log(`Loading game: ${props.router.params.id}`);
params.url = `${base}/api/v1/games/${props.router.params.id}`;
params.method = "GET"
} else {
console.log("Requesting new game.");
params.url = `${base}/api/v1/games`;
params.method = "POST";
}
window.fetch(params.url, {
method: params.method,
cache: 'no-cache',
credentials: 'same-origin',
headers: {
'Content-Type': 'application/json'
},
// body: JSON.stringify(data) // body data type must match "Content-Type" header
}).then((res) => {
if (res.status > 400) {
console.log(`Unable to find game ${props.router.params.id}`);
throw new Error(`Unable to find requested game ${props.router.params.id}. Starting new one.`);
}
return res.json();
}).then((game) => {
console.log (`Game ${game.id} loaded.`);
if (!props.router.params.id) {
// history.push(`${gamesPath}/${game.id}`);
}
this.game = game;
//this.setState({ game: game });
this.pips = Pips(this);
this.tiles = Tiles(this);
this.table = Table(this);
this.borders = this.game.borders.map((file) => {
console.log(file);
return Border(this, file);
});
//this.loadTimer = window.setTimeout(this.loadGame, 1000);
}).catch((error) => {
console.error(error);
alert(error);
})
this.id = (props.router && props.router.params.id) ? props.router.params.id : 0;
}
loadGame() {
@ -481,7 +433,7 @@ class Board extends React.Component {
}
if (this.state.game) {
return;
// return;
}
window.fetch(`${base}/api/v1/games/${this.state.game.id}`, {
@ -684,13 +636,12 @@ class Board extends React.Component {
if (this.updateSizeTimer) {
clearTimeout(this.updateSizeTimer);
}
console.log("Fix updateDimensions");
this.updateSizeTimer = setTimeout(() => {
const container = document.getElementById("root"),
offset = container.firstChild.offsetHeight,
height = window.innerHeight - offset;
return;
this.offsetY = offset;
this.width = window.innerWidth;
this.height = height;
@ -1071,6 +1022,60 @@ class Board extends React.Component {
window.addEventListener("mousemove", this.mouseMove);
window.addEventListener("resize", this.updateDimensions);
const params = {};
if (this.id) {
console.log(`Loading game: ${this.id}`);
params.url = `${base}/api/v1/games/${this.id}`;
params.method = "GET"
} else {
console.log("Requesting new game.");
params.url = `${base}/api/v1/games`;
params.method = "POST";
}
window.fetch(params.url, {
method: params.method,
cache: 'no-cache',
credentials: 'same-origin',
headers: {
'Content-Type': 'application/json'
},
// body: JSON.stringify(data) // body data type must match "Content-Type" header
}).then((res) => {
if (res.status > 400) {
let message;
if (this.id) {
message = `Unable to find game ${this.id}. Starting new game.`;
} else {
message = `Starting new game.`;
}
console.log(message);
throw new Error(message);
}
return res.json();
}).then((game) => {
console.log (`Game ${game.id} loaded.`);
if (!this.id) {
history.push(`${gamesPath}/${game.id}`);
}
this.game = game;
this.setState({ game: game });
this.pips = Pips(this);
this.tiles = Tiles(this);
this.table = Table(this);
this.borders = this.game.borders.map((file) => {
return Border(this, file);
});
this.loadTimer = window.setTimeout(this.loadGame, 1000);
}).catch((error) => {
console.error(error);
alert(error);
})
setTimeout(this.updateDimensions, 1000);
}