Skip to content

Commit 2c1d06f

Browse files
DerCedDerCed
authored
Merge pull request #163 from HackHPI/feature/activate-registration
Feature/activate registration
2 parents ab6a6d0 + 0e51613 commit 2c1d06f

File tree

14 files changed

+29762
-577
lines changed

14 files changed

+29762
-577
lines changed

‎src/app/page.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import Jury from "../components/Jury/Jury";
99
import {Features} from "../components/Features/Features";
1010
import LandingImage from "../components/LandingImage/LandingImage";
1111
import {Gallery} from "../components/Gallery/Gallery";
12+
import Registration from "../components/Registration/Registration";
1213

1314
export default function Page() {
1415
return (
@@ -20,8 +21,8 @@ export default function Page() {
2021
<Sponsors25/>
2122
<Gallery/>
2223
<Newsletter/>
23-
{/*<Registration />
24-
<Location />*/}
24+
<Registration />
25+
{/* <Location />*/}
2526
<Speakers/>
2627
<Jury/>
2728
{/*
@@ -31,4 +32,4 @@ export default function Page() {
3132
<Team/>
3233
</>
3334
)
34-
}
35+
}

‎src/app/verify/page.tsx‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import {useEffect} from "react";
33
import {RegistrationRest} from "../../rest/RegistrationRest";
44
import {Box, CircularProgress, Typography} from "@mui/material";
55
import {useRouter} from "next/navigation";
6+
import {ParticipantRest} from "../../rest/ParticipantRest";
67

78
export default function Page() {
89

@@ -11,9 +12,10 @@ export default function Page() {
1112
useEffect(() => {
1213
if (typeof window !== 'undefined') {
1314
const queryParameters = new URLSearchParams(window?.location?.search)
14-
const type = queryParameters.get("token")
15-
const registrationRest = new RegistrationRest()
16-
registrationRest.verifyToken(type).then(() => router.push("/?isVerified=true"))
15+
const token = queryParameters.get("t")
16+
const participant = queryParameters.get("p")
17+
const participantRest = new ParticipantRest()
18+
participantRest.verifyToken(participant, token).then(() => router.push("/?isVerified=true"))
1719
}
1820

1921
}, []);
@@ -23,4 +25,4 @@ export default function Page() {
2325
<Typography>Verifying your Token</Typography>
2426
</Box>
2527
</Box>
26-
}
28+
}

‎src/components/LandingImage/LandingImage.jsx‎

Lines changed: 106 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -1,89 +1,113 @@
1-
'use client'
2-
import {Box, Button, Card, Container, Stack, Typography} from "@mui/material";
3-
import {TypeAnimation} from "react-type-animation";
4-
import Countdown from "./Countdown.jsx";
5-
import {CalendarMonthOutlined, Camera, CameraAlt, LocationOn} from "@mui/icons-material";
6-
import {useEffect, useState} from "react";
7-
import {MeshContainer} from "./MeshContainer/MeshContainer";
1+
"use client";
2+
import { Button, Card, Container, Stack, Typography } from "@mui/material";
3+
import { TypeAnimation } from "react-type-animation";
4+
import { Article, CalendarMonthOutlined } from "@mui/icons-material";
5+
import { useEffect, useState } from "react";
6+
import { MeshContainer } from "./MeshContainer/MeshContainer";
87

98
function LandingImage() {
9+
const [timeLeft, setTimeLeft] = useState(calculateTimeDiff());
1010

11-
const [timeLeft, setTimeLeft] = useState(calculateTimeDiff())
11+
function calculateTimeDiff() {
12+
return new Date(new Date(2025, 2, 21) - new Date());
13+
}
1214

13-
function calculateTimeDiff() {
14-
return new Date(new Date(2025, 2, 21) - new Date())
15-
}
16-
17-
useEffect(() => {
18-
const i = setInterval(() => {
19-
setTimeLeft(calculateTimeDiff())
20-
}, 1000);
21-
return () => clearInterval(i);
22-
}, []); //dependency, if end changes remount
23-
24-
return (
25-
<MeshContainer>
26-
27-
<Container sx={{height: "100%", width: "100%", display: "flex", flexDirection: "column", justifyContent: "space-around", minHeight: "60vh"}}>
28-
<img src={"/HackHPI_white.svg"} width={"150rem"} alt={"HackHPI Logo"}/>
29-
<div>
30-
<Typography sx={{color: "white"}} variant={"h2"} component={"h1"}>
31-
Medical Edition
32-
</Typography>
33-
<Typography variant={"h4"} component={"h2"}>
34-
<TypeAnimation
35-
preRenderFirstString={true}
36-
sequence={[
37-
500,
38-
'For better',
39-
500,
40-
'For better health', // initially rendered starting point
41-
1000,
42-
'For better diagnosis', // initially rendered starting point,
43-
1000,
44-
'For better treatments', // initially rendered starting point
45-
1000,
46-
`See you in ${Math.round(timeLeft / (24 * 60 * 60 * 1000))} Days!`,
47-
10000,
48-
]}
49-
speed={50}
50-
repeat={Infinity}
51-
/>
52-
</Typography>
53-
</div>
54-
<Stack direction={"row"} spacing={3} useFlexGap flexWrap="wrap">
55-
<Button
56-
variant={"contained"}
57-
sx={{
58-
borderWidth: "1rem",
59-
width: "13rem",
60-
height: "3.5rem",
61-
fontSize: "1rem",
62-
}}
63-
color={"primary"}
64-
startIcon={<CameraAlt/>}
65-
onClick={() => document.getElementById("images").scrollIntoView({
66-
behavior: "smooth",
67-
block: "start",
68-
inline: "nearest"
69-
})}
70-
>
71-
Images
72-
</Button>
73-
<Card sx={{height: "3.5rem", justifyContent: "center", display: "flex"}}>
74-
<Stack direction={"row"} alignItems={"center"} display={"flex"}
75-
sx={{height: "100%", paddingRight: "1.25rem", paddingLeft: "1.25rem",}} spacing={2}>
76-
<CalendarMonthOutlined sx={{fontSize: "1.5rem", color: "text.disabled"}}/>
77-
<Typography sx={{fontSize: "1rem"}} color={"text.disabled"} noWrap>
78-
21th - 22th March 2025
79-
</Typography>
80-
</Stack>
81-
</Card>
82-
</Stack>
83-
</Container>
84-
</MeshContainer>
85-
)
15+
useEffect(() => {
16+
const i = setInterval(() => {
17+
setTimeLeft(calculateTimeDiff());
18+
}, 1000);
19+
return () => clearInterval(i);
20+
}, []); //dependency, if end changes remount
8621

22+
return (
23+
<MeshContainer>
24+
<Container
25+
sx={{
26+
height: "100%",
27+
width: "100%",
28+
display: "flex",
29+
flexDirection: "column",
30+
justifyContent: "space-around",
31+
minHeight: "60vh",
32+
}}
33+
>
34+
<img src={"/HackHPI_white.svg"} width={"150rem"} alt={"HackHPI Logo"} />
35+
<div>
36+
<Typography sx={{ color: "white" }} variant={"h2"} component={"h1"}>
37+
Medical Edition
38+
</Typography>
39+
<Typography variant={"h4"} component={"h2"}>
40+
<TypeAnimation
41+
preRenderFirstString={true}
42+
sequence={[
43+
500,
44+
"For better",
45+
500,
46+
"For better health", // initially rendered starting point
47+
1000,
48+
"For better diagnosis", // initially rendered starting point,
49+
1000,
50+
"For better treatments", // initially rendered starting point
51+
1000,
52+
`See you in ${Math.round(timeLeft / (24 * 60 * 60 * 1000))} Days!`,
53+
10000,
54+
]}
55+
speed={50}
56+
repeat={Infinity}
57+
/>
58+
</Typography>
59+
</div>
60+
<Stack direction={"row"} spacing={3} useFlexGap flexWrap="wrap">
61+
<Button
62+
variant={"contained"}
63+
sx={{
64+
borderWidth: "1rem",
65+
width: "13rem",
66+
height: "3.5rem",
67+
fontSize: "1rem",
68+
}}
69+
color={"primary"}
70+
startIcon={<Article />}
71+
onClick={() =>
72+
document.getElementById("signupForm").scrollIntoView({
73+
behavior: "smooth",
74+
block: "start",
75+
inline: "nearest",
76+
})
77+
}
78+
>
79+
Registration
80+
</Button>
81+
<Card
82+
sx={{ height: "3.5rem", justifyContent: "center", display: "flex" }}
83+
>
84+
<Stack
85+
direction={"row"}
86+
alignItems={"center"}
87+
display={"flex"}
88+
sx={{
89+
height: "100%",
90+
paddingRight: "1.25rem",
91+
paddingLeft: "1.25rem",
92+
}}
93+
spacing={2}
94+
>
95+
<CalendarMonthOutlined
96+
sx={{ fontSize: "1.5rem", color: "text.disabled" }}
97+
/>
98+
<Typography
99+
sx={{ fontSize: "1rem" }}
100+
color={"text.disabled"}
101+
noWrap
102+
>
103+
21th - 22th March 2025
104+
</Typography>
105+
</Stack>
106+
</Card>
107+
</Stack>
108+
</Container>
109+
</MeshContainer>
110+
);
87111
}
88112

89-
export default LandingImage
113+
export default LandingImage;

‎src/components/Registration/GroupManager/GroupManager.jsx‎

Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
import {
2+
Box,
3+
Button,
4+
Divider,
5+
Grid,
6+
Stack,
7+
TextField,
8+
Typography,
9+
} from "@mui/material";
10+
import { LoadingButton } from "@mui/lab";
11+
import {useEffect, useMemo, useState} from "react";
12+
import { GroupRest } from "../../../rest/GroupRest";
13+
14+
export function GroupManager(props) {
15+
const [loadingNewTeam, setLoadingNewTeam] = useState(false);
16+
const [fetchingExistingTeam, setFetchingExistingTeam] = useState(false);
17+
const [group, setGroup] = useState(false);
18+
const [groupInput, setGroupInput] = useState("");
19+
const [groupInputError, setGroupInputError] = useState(false);
20+
const groupRest = useMemo(() => new GroupRest(), []);
21+
22+
23+
function createNewGroup() {
24+
setLoadingNewTeam(true);
25+
setGroupInputError(false)
26+
groupRest.createGroup(props.eventId).then((response) => {
27+
setLoadingNewTeam(false);
28+
setGroup(response.data);
29+
});
30+
}
31+
32+
function getGroup() {
33+
setFetchingExistingTeam(true);
34+
setGroupInputError(false)
35+
groupRest
36+
.getGroup(props.eventId, groupInput)
37+
.then((response) => {
38+
setFetchingExistingTeam(false);
39+
setGroup(response.data);
40+
})
41+
.catch((error) => {
42+
setFetchingExistingTeam(false);
43+
setGroupInput("");
44+
setGroupInputError(true);
45+
});
46+
}
47+
48+
useEffect(() => {
49+
props.onGroupChange(group)
50+
}, [group]);
51+
52+
function renderGroupSelection() {
53+
return (
54+
<Box sx={{ pt: 5, pb: 5 }}>
55+
<Stack direction="row" spacing={2}>
56+
<TextField
57+
fullWidth
58+
label={"Enter team name (e.g. chalk-increase-vague)"}
59+
value={groupInput}
60+
onChange={(event) => setGroupInput(event.target.value)}
61+
error={groupInputError}
62+
helperText={
63+
groupInputError ? "Did not find specified group" : undefined
64+
}
65+
/>
66+
<LoadingButton
67+
variant={"outlined"}
68+
disabled={loadingNewTeam}
69+
loading={fetchingExistingTeam}
70+
onClick={getGroup}
71+
>
72+
Join
73+
</LoadingButton>
74+
</Stack>
75+
<Divider sx={{ pt: 2, pb: 2 }}> or </Divider>
76+
<Box sx={{ width: "100%", display: "flex", justifyContent: "center" }}>
77+
<LoadingButton
78+
variant={"outlined"}
79+
color={"primary"}
80+
onClick={createNewGroup}
81+
loading={loadingNewTeam}
82+
disabled={fetchingExistingTeam}
83+
>
84+
Create new Team
85+
</LoadingButton>
86+
</Box>
87+
</Box>
88+
);
89+
}
90+
91+
function renderGroup() {
92+
return (
93+
<Box sx={{ pt: 5, pb: 5 }}>
94+
<Typography gutterBottom>You are assigned to the group</Typography>
95+
<Typography sx={{ fontWeight: 800, pb: 3 }} variant={"h5"}>
96+
{group.phrase}
97+
</Typography>
98+
<Button variant="outlined" onClick={() => setGroup(null)}>
99+
Reset Group
100+
</Button>
101+
102+
<Typography sx={{ pt: 4 }}>
103+
share this name to your team members
104+
</Typography>
105+
<Typography color={"text.secondary"}>
106+
This is not your actual team name at the event
107+
</Typography>
108+
</Box>
109+
);
110+
}
111+
112+
return (
113+
<Grid item md={12} xs={12}>
114+
{group ? renderGroup() : renderGroupSelection()}
115+
</Grid>
116+
);
117+
}

0 commit comments

Comments
 (0)