2022-10-10 17:38:06 +00:00
|
|
|
import { Button, Card, Container, Grid, Input, Spacer, Switch, Text } from '@nextui-org/react';
|
2022-10-10 12:28:31 +00:00
|
|
|
import { Component } from 'react';
|
|
|
|
import NavBar from '../src/components/Navbar';
|
2022-10-10 12:14:25 +00:00
|
|
|
|
2022-10-10 12:28:31 +00:00
|
|
|
import styles from '../styles/main.module.css';
|
2022-10-10 12:14:25 +00:00
|
|
|
|
2022-02-14 19:27:30 +00:00
|
|
|
export default class Home extends Component {
|
2022-02-14 17:43:52 +00:00
|
|
|
|
2022-02-14 19:27:30 +00:00
|
|
|
constructor(props) {
|
|
|
|
super(props);
|
2022-10-10 17:38:06 +00:00
|
|
|
|
|
|
|
this.state = {
|
|
|
|
socketAddr: undefined,
|
|
|
|
steamId: undefined,
|
|
|
|
socketAddr: undefined,
|
|
|
|
}
|
2022-04-02 05:32:51 +00:00
|
|
|
}
|
|
|
|
|
2022-02-14 19:27:30 +00:00
|
|
|
async componentDidMount() {
|
2022-10-10 12:14:25 +00:00
|
|
|
const urlSearchParams = new URLSearchParams(window.location.search);
|
|
|
|
const params = Object.fromEntries(urlSearchParams.entries());
|
|
|
|
|
|
|
|
if (params.id) {
|
|
|
|
document.location.href = "/overlay/"+ window.location.search
|
2022-10-10 17:38:06 +00:00
|
|
|
return;
|
2022-10-10 12:14:25 +00:00
|
|
|
}
|
2022-10-10 17:38:06 +00:00
|
|
|
|
|
|
|
this.loadPreview();
|
|
|
|
}
|
|
|
|
|
|
|
|
loadPreview() {
|
|
|
|
const previewiframe = document.getElementById('previewiframe');
|
|
|
|
|
|
|
|
const id = this.state.steamId || "test";
|
|
|
|
previewiframe.src = window.location.origin + "/overlay/?id=" + id + "&bg=000";
|
|
|
|
}
|
|
|
|
|
|
|
|
generateUrl() {
|
|
|
|
|
2022-02-17 02:25:43 +00:00
|
|
|
}
|
|
|
|
|
2022-02-14 19:27:30 +00:00
|
|
|
render() {
|
2022-10-10 12:28:31 +00:00
|
|
|
return <div className={styles.main}>
|
|
|
|
<NavBar></NavBar>
|
|
|
|
|
|
|
|
<Container css={{
|
2022-10-10 17:38:06 +00:00
|
|
|
marginTop: '$8'
|
2022-10-10 12:28:31 +00:00
|
|
|
}}>
|
2022-10-10 17:38:06 +00:00
|
|
|
<Grid.Container gap={2}>
|
2022-10-10 12:28:31 +00:00
|
|
|
<Grid xs={12}>
|
|
|
|
<Card>
|
|
|
|
<Card.Body>
|
2022-10-10 17:38:06 +00:00
|
|
|
<Text>Welcome to the Setup panel</Text>
|
|
|
|
|
|
|
|
<Spacer y={2} />
|
|
|
|
|
|
|
|
<Input
|
|
|
|
clearable
|
|
|
|
underlined
|
|
|
|
labelPlaceholder="Ip Address (Only set if you stream on multiple devices)"
|
|
|
|
initialValue="localhost"
|
|
|
|
/>
|
|
|
|
<Spacer y={2} />
|
|
|
|
<Input
|
|
|
|
clearable
|
|
|
|
underlined
|
|
|
|
labelPlaceholder="Steam Id"
|
|
|
|
initialValue=""
|
|
|
|
/>
|
|
|
|
<Spacer y={2} />
|
|
|
|
<Text>Do you want to show Score Info (Current swing values, total score, etc)</Text>
|
|
|
|
<Switch checked={true} size="md" />
|
|
|
|
<Text>Do you want to show Player Stats (Current PP, global pos, etc)</Text>
|
|
|
|
<Switch checked={true} size="md" />
|
|
|
|
<Text>Do you want to show Song Info (Song name, bsr, song art, etc)</Text>
|
|
|
|
<Switch checked={true} size="md" />
|
|
|
|
<Spacer y={2} />
|
|
|
|
|
|
|
|
<div>
|
|
|
|
<Button auto>Generate</Button>
|
|
|
|
</div>
|
|
|
|
</Card.Body>
|
|
|
|
</Card>
|
|
|
|
</Grid>
|
|
|
|
|
|
|
|
<Grid xs={12}>
|
|
|
|
<Card>
|
|
|
|
<Card.Body>
|
|
|
|
<Text>Preview</Text>
|
|
|
|
|
|
|
|
<iframe id='previewiframe' width={"100%"} height={450} frameBorder="0" border="0" cellSpacing="0"></iframe>
|
2022-10-10 12:28:31 +00:00
|
|
|
</Card.Body>
|
|
|
|
</Card>
|
|
|
|
</Grid>
|
|
|
|
</Grid.Container>
|
|
|
|
</Container>
|
2022-10-10 12:14:25 +00:00
|
|
|
</div>
|
2022-02-14 19:27:30 +00:00
|
|
|
}
|
|
|
|
}
|