Update
This commit is contained in:
@ -2,41 +2,53 @@ import React, {Component} from "react";
|
||||
import {
|
||||
Backdrop,
|
||||
Box,
|
||||
CircularProgress,
|
||||
Fade,
|
||||
Modal,
|
||||
Stack,
|
||||
Typography,
|
||||
Button,
|
||||
Chip,
|
||||
CircularProgress,
|
||||
Dialog,
|
||||
DialogTitle, DialogContent, DialogContentText, DialogActions, Chip, FormControl, Snackbar
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
Fade,
|
||||
FormControl,
|
||||
Modal,
|
||||
Snackbar,
|
||||
Stack,
|
||||
Typography, Zoom
|
||||
} from "@mui/material";
|
||||
import {FunctionTest} from "../IPCConstants";
|
||||
import {FunctionTest} from "../RawConstants";
|
||||
import SettingsIcon from '@mui/icons-material/Settings';
|
||||
import PlayCircleIcon from '@mui/icons-material/PlayCircle';
|
||||
import CloudOffIcon from '@mui/icons-material/CloudOff';
|
||||
import CloudIcon from '@mui/icons-material/Cloud';
|
||||
import {PAGE} from "./App";
|
||||
import GameHandler from "./GameHandler";
|
||||
|
||||
interface StartupProps {
|
||||
visible: boolean
|
||||
}
|
||||
|
||||
interface StartupState {
|
||||
statusTxt: string,
|
||||
openCloudConnectModal: boolean,
|
||||
showStartBtn: boolean,
|
||||
isConnected: boolean,
|
||||
cloudErrorMsg: string,
|
||||
isCloudConnected: boolean,
|
||||
snackErrorMsg: string,
|
||||
isConnectionIssue: boolean,
|
||||
startCounter: number,
|
||||
}
|
||||
|
||||
export default class Startup extends Component<{}, StartupState> {
|
||||
constructor(props: {}) {
|
||||
export default class Startup extends Component<StartupProps, StartupState> {
|
||||
constructor(props: StartupProps) {
|
||||
super(props);
|
||||
this.state = {
|
||||
statusTxt: "Smart-Monopoly wird gestartet...",
|
||||
openCloudConnectModal: false,
|
||||
showStartBtn: false,
|
||||
isConnected: false,
|
||||
isCloudConnected: false,
|
||||
isConnectionIssue: false,
|
||||
cloudErrorMsg: "",
|
||||
snackErrorMsg: "",
|
||||
startCounter: 10,
|
||||
};
|
||||
}
|
||||
@ -62,7 +74,9 @@ export default class Startup extends Component<{}, StartupState> {
|
||||
let response = await window.api.request("CLOUD_CONNECT", {});
|
||||
this.setState((prevState) => ({
|
||||
...prevState,
|
||||
cloudErrorMsg: response.data.toString()
|
||||
snackErrorMsg: response.data.toString(),
|
||||
isCloudConnected: response.status,
|
||||
isConnectionIssue: !response.status,
|
||||
}));
|
||||
console.log(response)
|
||||
return response.status;
|
||||
@ -73,6 +87,27 @@ export default class Startup extends Component<{}, StartupState> {
|
||||
|
||||
startupBtnClick = () => {
|
||||
// Startup handle
|
||||
this.setState(prevState => ({
|
||||
...prevState,
|
||||
showStartBtn: false,
|
||||
statusTxt: "Kapitalismus an die Macht!"
|
||||
}));
|
||||
setTimeout(async () => {
|
||||
try {
|
||||
let resp = await GameHandler.requestPreparing(this.state.isCloudConnected);
|
||||
} catch(e)
|
||||
{
|
||||
this.setState(prevState => ({
|
||||
...prevState,
|
||||
showStartBtn: true,
|
||||
snackErrorMsg: "Start fehlgeschlagen! \n" + e.toString()
|
||||
}));
|
||||
await this.cloudDecision(false);
|
||||
}
|
||||
}, 1500)
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
style = {
|
||||
@ -88,13 +123,12 @@ export default class Startup extends Component<{}, StartupState> {
|
||||
};
|
||||
|
||||
|
||||
|
||||
async cloudDecision(decision: boolean) {
|
||||
this.setState((prevState) => ({
|
||||
...prevState,
|
||||
openCloudConnectModal: false,
|
||||
isConnectionIssue: false,
|
||||
isConnected: false,
|
||||
isCloudConnected: false,
|
||||
startCounter: 30
|
||||
}));
|
||||
clearInterval(this.counterInterval);
|
||||
@ -124,20 +158,19 @@ export default class Startup extends Component<{}, StartupState> {
|
||||
...prevState,
|
||||
statusTxt: "Bereit zum Spielen?",
|
||||
showStartBtn: true,
|
||||
isConnectionIssue: !connected,
|
||||
isConnected: connected
|
||||
})
|
||||
)
|
||||
if(connected)
|
||||
if (connected)
|
||||
this.counterInterval = setInterval(() => {
|
||||
if(this.state.startCounter == 0) {
|
||||
if (!this.props.visible) return;
|
||||
if (this.state.startCounter == 0) {
|
||||
clearInterval(this.counterInterval);
|
||||
this.startupBtnClick();
|
||||
return;
|
||||
}
|
||||
this.setState((prevState) => ({
|
||||
...prevState,
|
||||
startCounter: prevState.startCounter-1
|
||||
startCounter: prevState.startCounter - 1
|
||||
}));
|
||||
|
||||
}, 1000);
|
||||
@ -151,29 +184,35 @@ export default class Startup extends Component<{}, StartupState> {
|
||||
startCounter: 30
|
||||
}));
|
||||
this.counterInterval = setInterval(() => {
|
||||
this.setState((prevState) => ({
|
||||
...prevState,
|
||||
startCounter: prevState.startCounter-1
|
||||
}));
|
||||
if(this.state.startCounter == 0) {
|
||||
if (!this.props.visible) return;
|
||||
|
||||
if (this.state.startCounter == 0) {
|
||||
clearInterval(this.counterInterval);
|
||||
this.startupBtnClick();
|
||||
return;
|
||||
}
|
||||
this.setState((prevState) => ({
|
||||
...prevState,
|
||||
startCounter: prevState.startCounter - 1
|
||||
}));
|
||||
|
||||
}, 1000);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
render() {
|
||||
return <div className="startup">
|
||||
return <div className={`startup ${this.props.visible ? '' : 'hidden'}`}>
|
||||
<Snackbar
|
||||
open={this.state.cloudErrorMsg != ""}
|
||||
open={this.state.snackErrorMsg != ""}
|
||||
autoHideDuration={8000}
|
||||
onClose={() => {this.setState(prevState => ({
|
||||
...prevState,
|
||||
cloudErrorMsg: ""
|
||||
}))}}
|
||||
message={this.state.cloudErrorMsg}
|
||||
onClose={() => {
|
||||
this.setState(prevState => ({
|
||||
...prevState,
|
||||
snackErrorMsg: ""
|
||||
}))
|
||||
}}
|
||||
message={this.state.snackErrorMsg}
|
||||
/>
|
||||
<Dialog
|
||||
open={this.state.isConnectionIssue}
|
||||
@ -226,7 +265,8 @@ export default class Startup extends Component<{}, StartupState> {
|
||||
<i>Dafür wird eine WiFi-Verbindung hergestellt</i>
|
||||
<br/>
|
||||
<br/>
|
||||
<Button variant="contained" sx={{mr: 1}} onClick={() => this.cloudDecision(true)}>Ja</Button>
|
||||
<Button variant="contained" sx={{mr: 1}}
|
||||
onClick={() => this.cloudDecision(true)}>Ja</Button>
|
||||
<Button variant="contained" onClick={() => this.cloudDecision(false)}
|
||||
color="error">Nein</Button>
|
||||
</Typography>
|
||||
@ -243,16 +283,24 @@ export default class Startup extends Component<{}, StartupState> {
|
||||
|
||||
<Box alignItems="center" sx={{width: '100%'}}>
|
||||
<FormControl sx={{mr: 2, minWidth: '30%'}}>
|
||||
{this.state.showStartBtn && <Button color="secondary" variant="contained">Setup <SettingsIcon/></Button>}
|
||||
<Zoom in={this.state.showStartBtn}><Button color="secondary"
|
||||
onClick={() => window.app.setPage(PAGE.SETUP)}
|
||||
variant="contained">Einstellungen <SettingsIcon/></Button></Zoom>
|
||||
</FormControl>
|
||||
<FormControl sx={{minWidth: '30%'}}>
|
||||
{this.state.showStartBtn && <Button color="success" variant="contained">Start <Chip sx={{ml: 1}} size="small" label={this.state.startCounter} /> <PlayCircleIcon/></Button>}
|
||||
<Zoom in={this.state.showStartBtn}><Button color="success"
|
||||
onClick={() => this.startupBtnClick()}
|
||||
variant="contained">Start <Chip sx={{ml: 1}}
|
||||
size="small"
|
||||
label={this.state.startCounter}/>
|
||||
<PlayCircleIcon/></Button></Zoom>
|
||||
</FormControl>
|
||||
</Box>
|
||||
<Chip sx={{mt: 3}} color={this.state.isConnected ? "success" : "default"} onClick={() => this.setState(prevState => ({
|
||||
<Chip sx={{mt: 3}} color={this.state.isCloudConnected ? "success" : "default"}
|
||||
disabled={!this.state.showStartBtn} onClick={() => this.setState(prevState => ({
|
||||
...prevState,
|
||||
openCloudConnectModal: true
|
||||
}))} label={this.state.isConnected ? <CloudIcon/> : <CloudOffIcon />}/>
|
||||
}))} label={this.state.isCloudConnected ? <CloudIcon/> : <CloudOffIcon/>}/>
|
||||
|
||||
</Stack>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user