Update branch with upstream changes

frontend/src/components/pages/BehaviorNormal.js

@@ -1,23 +1,48 @@
-import React, { useState, useEffect } from "react";
+import React from "react";
 import "../../App.css";
 import Footer from "../../Footer";
-import { logout, useAuth } from "../../auth/AuthProvider";
 import InputField from "../InputField";
 import SubmitField from "../SubmitField";
 import { Logger } from "@behametrics/logger-web";
 
 export default function BehaviorNormal() {
-  const [username, setUsername] = useState("");
+  let username = "";
-  const [password, setPassword] = useState("");
+  const setUsername = (tmp_username) => {
+    username = tmp_username;
+  };
 
-  const [isLoggedIn] = useAuth();
+  let password = "";
+  const setPassword = (tmp_password) => {
+    password = tmp_password;
+  };
+
+  let logger = new Logger({
+    //inputs: ["cursor", "wheel", "keyboard", "touch"],
+    inputs: ["keyboard"],
+    logToConsole: true,
+  });
+
+  logger.init();
+
+  const handleOff = () => {
+    logger.stop();
+    console.log("Logger ausgeschaltet");
+  };
+
+  const handleOn = () => {
+    logger.start();
+    console.log("start logging ");
+  };
+
+  const handlePasswordChange = (e) => {
+    console.log("handlePasswordChange");
+    setPassword(e.target.value);
+  };
 
   const handleUsernameChange = (e) => {
+    console.log("handleUsernamechange");
     setUsername(e.target.value);
   };
-  const handlePasswordChange = (e) => {
-    setPassword(e.target.value);
-  };
 
   const handleOnCopyEvent = (e) => {
     e.preventDefault();
@@ -42,7 +67,6 @@ export default function BehaviorNormal() {
       body: JSON.stringify(opts),
     }).then((response) => {
       console.log(response.status);
-      console.log(isLoggedIn);
       if (response.status === 401) {
         response.json().then((resp) => {
           console.log("nicht so wirklich gut");
@@ -56,27 +80,11 @@ export default function BehaviorNormal() {
     });
   };
 
-  let logger = new Logger({
-    //inputs: ["cursor", "wheel", "keyboard", "touch"],
-    inputs: ["keyboard"],
-    logToConsole: true,
-  });
-
-  const handleOff = () => {
-    logger.stop();
-    logout();
-    console.log("Logger ausgeschaltet");
-  };
-
-  useEffect(() => {
-    logger.init().then(() => logger.start());
-    console.log("start logging");
-  }, []);
-
   return (
     <>
       <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