diff --git a/frontend/src/App.css b/frontend/src/App.css index b31da3c..85703b2 100644 --- a/frontend/src/App.css +++ b/frontend/src/App.css @@ -95,4 +95,5 @@ h1 { .generated-password { font-weight: bold; + user-select: none; } diff --git a/frontend/src/components/BehaviorNormal.jsx b/frontend/src/components/BehaviorNormal.jsx index c427a02..9a4e715 100644 --- a/frontend/src/components/BehaviorNormal.jsx +++ b/frontend/src/components/BehaviorNormal.jsx @@ -10,7 +10,6 @@ export default function BehaviorNormal(props) { Passwort eingeben. Verhalten Sie sich einfach so, als ob Sie sich normalerweise anmelden.

- {console.log("props", props)} ); diff --git a/frontend/src/components/GeneratedPassword.jsx b/frontend/src/components/GeneratedPassword.jsx index f2b8ea9..1dfb3af 100644 --- a/frontend/src/components/GeneratedPassword.jsx +++ b/frontend/src/components/GeneratedPassword.jsx @@ -9,9 +9,8 @@ export default function GeneratedPassword(props) { return ( <> -

+

Das Passwort für diese Situation lautet:{" "} - {console.log("component genpw, genpassword", props.genPassword)} {props.genPassword}

diff --git a/frontend/src/components/pages/Study.jsx b/frontend/src/components/pages/Study.jsx index 54b8f8b..2694809 100644 --- a/frontend/src/components/pages/Study.jsx +++ b/frontend/src/components/pages/Study.jsx @@ -3,6 +3,7 @@ import "../../App.css"; import Footer from "../../Footer"; import InputField from "../InputField"; import SubmitField from "../SubmitField"; +import ErrorMessage from "../ErrorMessage"; import { Logger } from "@behametrics/logger-web"; import { Button } from "../Button"; import BehaviorStudyInfo from "../BehaviorStudyInfo"; @@ -24,6 +25,10 @@ export default function Study() { END: "end", }; const [state, setState] = useState(STATES.START); + const [isInputCorrect, setIsInputCorrect] = useState(true); + + const errorText = + "Das Passwort und der Benutzername stimmen nicht überein. Bitte prüfen Sie, dass Sie das Passwort richtig abgetippt und den Benutzernamen richtig eingegeben haben."; useEffect(() => { _logger.current = new Logger({ @@ -73,7 +78,10 @@ export default function Study() { const handleOnPasteEvent = (e) => { e.preventDefault(); - console.log("paste not allowed"); + return false; + }; + const handleOnCopyEvent = (e) => { + e.preventDefault(); return false; }; @@ -88,7 +96,6 @@ export default function Study() { response.json().then((resp) => { console.log(resp.random_password); setGenPassword(resp.random_password); - console.log("rcv pw; print genPassword", genPassword); }); }); }; @@ -98,7 +105,6 @@ export default function Study() { }; const checkIfValuesAreCorrect = () => { - console.log(checkIfPasswordIsCorrect()); return checkIfPasswordIsCorrect() && checkIfUsernameIsCorrect(); }; @@ -108,28 +114,44 @@ export default function Study() { handleLoggerOn(); }; + const resetInputValues = () => { + let inputElements = document.querySelectorAll('div input:not([type="submit"])'); + for (let i=0; i < inputElements.length; i++){ + inputElements[i].value = "" + + } + }; + const handleClickAtStepNormal = () => { if (checkIfValuesAreCorrect()) { receiveRandomPassword(); + setIsInputCorrect(true); setState(STATES.PHONE); + } else { + setIsInputCorrect(false); + resetInputValues(); } }; const handleClickAtStepPhone = () => { if (checkIfValuesAreCorrect()) { receiveRandomPassword(); + setIsInputCorrect(true); setState(STATES.STANDING); } else { - console.log("Passwort und Benutzername stimmen nicht."); + setIsInputCorrect(false); + resetInputValues(); } }; const handleClickAtStepStanding = () => { if (checkIfValuesAreCorrect()) { + setIsInputCorrect(true); setState(STATES.END); handleLoggerOff(); } else { - console.log("Passwort und Benutzername stimmen nicht."); + setIsInputCorrect(false); + resetInputValues(); } }; @@ -150,8 +172,9 @@ export default function Study() { const study_normal = ( <> - -
+ + {!isInputCorrect && } +
- +
); const study_phone = ( <> -
+ {!isInputCorrect && } +
- +
); const study_standing = ( <> -
+ {!isInputCorrect && } +
- +
);