diff --git a/frontend/src/App.js b/frontend/src/App.js
index 415c951..20f00f1 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -12,7 +12,7 @@ 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 BehaviorNormal from "./components/pages/BehaviorNormal";
function App() {
return (
@@ -28,7 +28,7 @@ function App() {
- Zu Beginn geht es darum, dass Sie ganz normal den Benutzernamen und das - Passwort eingeben. Verhalten Sie sich einfach so, als ob Sie sich - normalerweise anmelden. -
-- Nachfolgend werden Sie einige Schritte durchlaufen, um ihre - Nutzerinteraktion messen zu können. Verwenden Sie hierbei jeweils ihren - Benutzernamen, welchen Sie bereits zuvor genutzt haben. Das Passwort - wird jeweils generiert. -
-- Bitte klicken Sie auf weiter, um mit der Studie zu beginnen. Bitte lesen - Sie die jeweilige Aufgabe jeweils genau. -
- - > - ); -} diff --git a/frontend/src/components/GeneratedPassword.js b/frontend/src/components/GeneratedPassword.js deleted file mode 100644 index c963b5c..0000000 --- a/frontend/src/components/GeneratedPassword.js +++ /dev/null @@ -1,29 +0,0 @@ -import React, { useEffect, useState } from "react"; -import "../App.css"; - -export default function GeneratedPassword() { - const [genPassword, setGenPassword] = useState(""); - - const handleOnCopyEvent = (e) => { - e.preventDefault(); - return false; - }; - - useEffect(() => { - fetch("/api/protected/rcv_pw", { - method: "get", - }).then((response) => { - response.json().then((resp) => { - setGenPassword(resp.password); - }); - }); - }, []); - return ( - <> -- Das Passwort für diese Situation lautet:{" "} - {genPassword} -
- > - ); -} diff --git a/frontend/src/components/HeroSection.js b/frontend/src/components/HeroSection.js index 93211d3..be197eb 100644 --- a/frontend/src/components/HeroSection.js +++ b/frontend/src/components/HeroSection.js @@ -5,7 +5,7 @@ import "./HeroSection.css"; import "@fortawesome/fontawesome-free/css/all.css"; import { useAuth } from "../auth/AuthProvider"; -export default function HeroSection() { +function HeroSection() { const [isLoggedIn] = useAuth(); return ( @@ -17,7 +17,7 @@ export default function HeroSection() { className="btns" buttonStyle="btn--primary" buttonSize="btn--large" - newTo="study" + newTo="behavior" > Zur Studie @@ -53,3 +53,5 @@ export default function HeroSection() { ); } + +export default HeroSection; diff --git a/frontend/src/components/pages/Study.js b/frontend/src/components/pages/BehaviorNormal.js similarity index 66% rename from frontend/src/components/pages/Study.js rename to frontend/src/components/pages/BehaviorNormal.js index a6bbeab..0bb4d67 100644 --- a/frontend/src/components/pages/Study.js +++ b/frontend/src/components/pages/BehaviorNormal.js @@ -1,13 +1,12 @@ -import React, { useEffect } from "react"; +import React, { useEffect, useState } from "react"; import "../../App.css"; import Footer from "../../Footer"; import InputField from "../InputField"; import SubmitField from "../SubmitField"; import { Logger } from "@behametrics/logger-web"; -import BehaviorStudyInfo from "../BehaviorStudyInfo"; -import BehaviorNormal from "../BehaviorNormal"; +import BehaviorStudyInfo from "./BehaviorStudyInfo"; -export default function Study() { +export default function BehaviorNormal() { let username = ""; const setUsername = (tmp_username) => { username = tmp_username; @@ -18,22 +17,23 @@ export default function Study() { password = tmp_password; }; + const [genPassword, setGenPassword] = useState(""); + let logger = new Logger({ //inputs: ["cursor", "wheel", "keyboard", "touch"], inputs: ["keyboard"], - // apiUrl: "https://behavior.marcocamenzind.ch", - apiUrl: "http://localhost:5000", + apiUrl: "https://behavior.marcocamenzind.ch", logToConsole: true, }); logger.init(); - const handleLoggerOff = () => { + const handleOff = () => { logger.stop(); console.log("Logger ausgeschaltet"); }; - const handleLoggerOn = () => { + const handleOn = () => { logger.start(); console.log("start logging "); }; @@ -46,6 +46,11 @@ export default function Study() { setUsername(e.target.value); }; + const handleOnCopyEvent = (e) => { + e.preventDefault(); + return false; + }; + const handleOnPasteEvent = (e) => { e.preventDefault(); return false; @@ -75,21 +80,31 @@ export default function Study() { }); }; + useEffect(() => { + fetch("/api/protected/rcv_pw", { + method: "get", + }).then((response) => { + response.json().then((resp) => { + setGenPassword(resp.password); + }); + }); + }, []); + return ( <>+ Zu Beginn geht es darum, dass Sie ganz normal den Benutzernamen und + das Passwort eingeben. Verhalten Sie sich einfach so, als ob Sie sich + normalerweise anmelden. +
++ Das Passwort für diese Situation lautet:{" "} + {genPassword} +
- ++ Nachfolgend werden Sie einige Schritte durchlaufen, um ihre + Nutzerinteraktion messen zu können. Verwenden Sie hierbei jeweils ihren + Benutzernamen, welchen Sie bereits zuvor genutzt haben. Das Passwort wird + jeweils generiert. +
+ ); +} diff --git a/frontend/src/components/pages/Login.js b/frontend/src/components/pages/Login.js index c6ea7f8..46dd4c5 100644 --- a/frontend/src/components/pages/Login.js +++ b/frontend/src/components/pages/Login.js @@ -70,7 +70,7 @@ export default function Login() { ) : ( <> -