Refactored some things in the frontend. #166

Merged
cami merged 1 commit from refactor/frontend-study-refactoring into main 2021-07-19 00:17:05 +00:00
2 changed files with 21 additions and 11 deletions
Showing only changes of commit 008810151f - Show all commits

View file

@ -4,6 +4,7 @@ import Footer from "../../Footer";
import InputField from "../InputField";
import SubmitField from "../SubmitField";
import { Logger } from "@behametrics/logger-web";
import BehaviorStudyInfo from "./BehaviorStudyInfo";
export default function BehaviorNormal() {
let username = "";
@ -16,12 +17,12 @@ export default function BehaviorNormal() {
password = tmp_password;
};
const [genPassword, setGenPassword] = useState("")
const [genPassword, setGenPassword] = useState("");
let logger = new Logger({
//inputs: ["cursor", "wheel", "keyboard", "touch"],
inputs: ["keyboard"],
apiUrl: "http://localhost:5000",
// apiUrl: "http://localhost:5000",
logToConsole: true,
});
@ -84,8 +85,8 @@ export default function BehaviorNormal() {
method: "get",
}).then((response) => {
response.json().then((resp) => {
setGenPassword(resp.password)
})
setGenPassword(resp.password);
});
});
}, []);
@ -94,19 +95,15 @@ export default function BehaviorNormal() {
<div className="sitePage">
<h1>Studie</h1>
<button onClick={handleOn}>LOGGER StaRTEN</button>
<p>
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.
</p>
<BehaviorStudyInfo />
<p>
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.
</p>
<p onCopy={handleOnCopyEvent}>
Das Passwort für diese Situation lautet: <span className="generated-password">{genPassword}</span>
Das Passwort für diese Situation lautet:{" "}
<span className="generated-password">{genPassword}</span>
</p>
<form id="behaviorNormal" action="#">
<InputField

View file

@ -0,0 +1,13 @@
import React from "react";
import "../../App.css";
export default function BehaviorStudyInfo() {
return (
<p>
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.
</p>
);
}