diff --git a/frontend/src/components/BehaviorPhone.js b/frontend/src/components/BehaviorPhone.js deleted file mode 100644 index 9a6787e..0000000 --- a/frontend/src/components/BehaviorPhone.js +++ /dev/null @@ -1,17 +0,0 @@ -import React from "react"; -import "../App.css"; -import GeneratedPassword from "./GeneratedPassword"; - -export default function BehaviorPhone() { - return ( - <> -

- Im nächsten Schritt geht es darum, dass Sie während der Passworteingabe - telefonieren. Nehmen Sie hierzu Ihr Smartphone oder Telefon und stellen - Sie sich vor, dass Sie gerade am Telefonieren sind. Verwenden Sie bitte - kein Headset oder Ähnliches. -

- - - ); -} diff --git a/frontend/src/components/BehaviorStanding.js b/frontend/src/components/BehaviorStanding.js deleted file mode 100644 index 479b59b..0000000 --- a/frontend/src/components/BehaviorStanding.js +++ /dev/null @@ -1,14 +0,0 @@ -import React from "react"; -import "../App.css"; -import GeneratedPassword from "./GeneratedPassword" - -export default function BehaviorStanding() { - return ( - <> -

- In dieser Situation geht es darum, dass Sie das Passwort im Stehen eingeben. Stehen Sie also vor den Computer und geben Sie den Benutzernamen und das Passwort wie gewohnt ein. -

- - - ); -} diff --git a/frontend/src/components/pages/Study.js b/frontend/src/components/pages/Study.js index 9378c54..94d825d 100644 --- a/frontend/src/components/pages/Study.js +++ b/frontend/src/components/pages/Study.js @@ -1,4 +1,4 @@ -import React, { useEffect, useRef, useState } from "react"; +import React, { useEffect } from "react"; import "../../App.css"; import Footer from "../../Footer"; import InputField from "../InputField"; @@ -7,23 +7,8 @@ import { Logger } from "@behametrics/logger-web"; import BehaviorStudyInfo from "../BehaviorStudyInfo"; import BehaviorNormal from "../BehaviorNormal"; import { Button } from "../Button"; -import BehaviorPhone from "../BehaviorPhone"; -import BehaviorStanding from "../BehaviorStanding"; export default function Study() { - const _logger = useRef(0); - - useEffect(() => { - _logger.current = new Logger({ - //inputs: ["cursor", "wheel", "keyboard", "touch"], - inputs: ["keyboard"], - // apiUrl: "https://behavior.marcocamenzind.ch", - apiUrl: "http://localhost:5000", - logToConsole: true, - }); - _logger.current.init(); - }, []); - let username = ""; const setUsername = (tmp_username) => { username = tmp_username; @@ -34,19 +19,33 @@ 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); + let isStepStart = true; + const setIsStepStart = (tmp) => { + isStepStart = tmp; + }; + + let isStepNormal = false; + const setIsStepNormal = (tmp) => { + isStepNormal = tmp; + }; + + let logger = new Logger({ + //inputs: ["cursor", "wheel", "keyboard", "touch"], + inputs: ["keyboard"], + // apiUrl: "https://behavior.marcocamenzind.ch", + apiUrl: "http://localhost:5000", + logToConsole: true, + }); + + logger.init(); const handleLoggerOff = () => { - _logger.current.stop(); + logger.stop(); console.log("Logger ausgeschaltet"); }; const handleLoggerOn = () => { - _logger.current.start(); + logger.start(); console.log("start logging "); }; @@ -63,27 +62,11 @@ export default function Study() { return false; }; - const handleClickAtStepStart = () => { + const handleIsStepStart = () => { setIsStepStart(false); + console.log("isStepStar", isStepStart) setIsStepNormal(true); - handleLoggerOn(); - // forceUpdate(); - }; - - const handleClickAtStepNormal = () => { - setIsStepNormal(false); - setIsStepPhone(true); - }; - - const handleClickAtStepPhone = () => { - setIsStepPhone(false); - setIsStepStanding(true); - }; - - const handleClickAtStepStanding = () => { - setIsStepStanding(false); - setIsStepEnd(true); - handleLoggerOff(); + console.log("isStepStar", isStepNormal) }; const onSubmitClick = (e) => { @@ -110,122 +93,65 @@ export default function Study() { }); }; - const study_start = ( - <> - - - - ); - - const study_normal = ( - <> - -
- - - - - - ); - - const study_phone = ( - <> - -
- - - - - - ); - - const study_standing = ( - <> - -
- - - - - - ); - - const study_end =

Merci :-)

; + /* + useEffect(() => { + if (isStepStart) { + handleIsStepStart(); + console.log("useEffect; normal"); + } else if (isStepNormal) { + console.log("useEffect; normal"); + } + }); + */ return ( <>

Studie

- {isStepStart ? study_start : null} - {isStepNormal ? study_normal : null} - {isStepPhone ? study_phone : null} - {isStepStanding ? study_standing : null} - {isStepEnd ? study_end : null} + + {isStepStart ? ( + <> + + + + ) : null} + {isStepNormal ? ( + <> + +
+ + + + + + ) : null}