frontend/refactoring #195
4 changed files with 36 additions and 46 deletions
|
@ -9,10 +9,10 @@ import Privacy from "./components/pages/Privacy";
|
|||
import Login from "./components/pages/Login";
|
||||
import Register from "./components/pages/Register";
|
||||
import Manual from "./components/pages/Manual";
|
||||
import Secret from "./components/pages/Secret";
|
||||
import Umfrage from "./components/pages/Umfrage";
|
||||
import PrivateRoute from "./auth/PrivateRoute";
|
||||
import Study from "./components/pages/Study";
|
||||
import Secret from "./components/pages/Secret"
|
||||
|
||||
function App() {
|
||||
return (
|
||||
|
|
|
@ -44,11 +44,17 @@ function Navbar() {
|
|||
Startseite
|
||||
</Link>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link to="/study" className="nav-links" onClick={closeMobileMenu}>
|
||||
Studie
|
||||
</Link>
|
||||
</li>
|
||||
{isLoggedIn && (
|
||||
<li className="nav-item">
|
||||
<Link
|
||||
to="/study"
|
||||
className="nav-links"
|
||||
onClick={closeMobileMenu}
|
||||
>
|
||||
Studie
|
||||
</Link>
|
||||
</li>
|
||||
)}
|
||||
<li className="nav-item">
|
||||
<Link to="/Ueber" className="nav-links" onClick={closeMobileMenu}>
|
||||
Über
|
||||
|
|
|
@ -15,6 +15,15 @@ import { authFetch } from "../../auth/AuthProvider";
|
|||
export default function Study() {
|
||||
const _logger = useRef(0);
|
||||
const [serverUsername, setServerUsername] = useState("");
|
||||
const [genPassword, setGenPassword] = useState("");
|
||||
const STATES = {
|
||||
START: "start",
|
||||
NORMAL: "normal",
|
||||
PHONE: "phone",
|
||||
STANDING: "standing",
|
||||
END: "end",
|
||||
};
|
||||
const [state, setState] = useState(STATES.START);
|
||||
|
||||
useEffect(() => {
|
||||
_logger.current = new Logger({
|
||||
|
@ -44,12 +53,6 @@ export default function Study() {
|
|||
password = tmp_password;
|
||||
};
|
||||
|
||||
const [isStepStart, setIsStepStart] = useState(true);
|
||||
const [isStepNormal, setIsStepNormal] = useState(false);
|
||||
const [isStepPhone, setIsStepPhone] = useState(false);
|
||||
const [isStepStanding, setIsStepStanding] = useState(false);
|
||||
const [isStepEnd, setIsStepEnd] = useState(false);
|
||||
|
||||
const handleLoggerOff = () => {
|
||||
_logger.current.stop();
|
||||
console.log("Logger ausgeschaltet");
|
||||
|
@ -75,15 +78,9 @@ export default function Study() {
|
|||
};
|
||||
|
||||
const checkIfUsernameIsCorrect = () => {
|
||||
if (serverUsername === username) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
return serverUsername === username;
|
||||
};
|
||||
|
||||
const [genPassword, setGenPassword] = useState("");
|
||||
|
||||
const receiveRandomPassword = () => {
|
||||
fetch("/api/rcv_pw", {
|
||||
method: "get",
|
||||
|
@ -97,43 +94,31 @@ export default function Study() {
|
|||
};
|
||||
|
||||
const checkIfPasswordIsCorrect = () => {
|
||||
if (genPassword === password) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
return genPassword === password;
|
||||
};
|
||||
|
||||
const checkIfValuesAreCorrect = () => {
|
||||
console.log(checkIfPasswordIsCorrect());
|
||||
if (checkIfPasswordIsCorrect() && checkIfUsernameIsCorrect()) {
|
||||
return true;
|
||||
} else {
|
||||
alert("Passt nicht");
|
||||
return false;
|
||||
}
|
||||
return checkIfPasswordIsCorrect() && checkIfUsernameIsCorrect();
|
||||
};
|
||||
|
||||
const handleClickAtStepStart = () => {
|
||||
receiveRandomPassword();
|
||||
setIsStepStart(false);
|
||||
setIsStepNormal(true);
|
||||
setState(STATES.NORMAL);
|
||||
handleLoggerOn();
|
||||
};
|
||||
|
||||
const handleClickAtStepNormal = () => {
|
||||
if (checkIfValuesAreCorrect()) {
|
||||
receiveRandomPassword();
|
||||
setIsStepNormal(false);
|
||||
setIsStepPhone(true);
|
||||
setState(STATES.PHONE);
|
||||
}
|
||||
};
|
||||
|
||||
const handleClickAtStepPhone = () => {
|
||||
if (checkIfValuesAreCorrect()) {
|
||||
receiveRandomPassword();
|
||||
setIsStepPhone(false);
|
||||
setIsStepStanding(true);
|
||||
setState(STATES.STANDING);
|
||||
} else {
|
||||
console.log("Passwort und Benutzername stimmen nicht.");
|
||||
}
|
||||
|
@ -141,8 +126,7 @@ export default function Study() {
|
|||
|
||||
const handleClickAtStepStanding = () => {
|
||||
if (checkIfValuesAreCorrect()) {
|
||||
setIsStepStanding(false);
|
||||
setIsStepEnd(true);
|
||||
setState(STATES.END);
|
||||
handleLoggerOff();
|
||||
} else {
|
||||
console.log("Passwort und Benutzername stimmen nicht.");
|
||||
|
@ -241,7 +225,7 @@ export default function Study() {
|
|||
onChange={handlePasswordChange}
|
||||
InputType="password"
|
||||
InputName="Passwort"
|
||||
InputPlaceHolder="Benutzername"
|
||||
InputPlaceHolder="Passwort"
|
||||
onPaste={handleOnPasteEvent}
|
||||
/>
|
||||
<SubmitField
|
||||
|
@ -260,11 +244,11 @@ export default function Study() {
|
|||
<>
|
||||
<div className="sitePage">
|
||||
<h1>Studie</h1>
|
||||
{isStepStart ? study_start : null}
|
||||
{isStepNormal ? study_normal : null}
|
||||
{isStepPhone ? study_phone : null}
|
||||
{isStepStanding ? study_standing : null}
|
||||
{isStepEnd ? study_end : null}
|
||||
{state === STATES.START ? study_start : null}
|
||||
{state === STATES.NORMAL ? study_normal : null}
|
||||
{state === STATES.PHONE ? study_phone : null}
|
||||
{state === STATES.STANDING ? study_standing : null}
|
||||
{state === STATES.END ? study_end : null}
|
||||
</div>
|
||||
<Footer />
|
||||
</>
|
||||
|
|
|
@ -51,8 +51,8 @@ export default function Umfrage() {
|
|||
|
||||
if (!Number(age)) {
|
||||
setAgeErrorMessage("Das Alter muss als Zahl angegeben werden.");
|
||||
//setIsSurveyValid(false);
|
||||
// setIsAgeOk(false);
|
||||
setIsSurveyValid(false);
|
||||
setIsAgeOk(false);
|
||||
}
|
||||
if (gender === "DEFAULT" || gender === "") {
|
||||
setGenderErrorMessage(
|
||||
|
|
Loading…
Reference in a new issue