Merge pull request 'Logger works' (#160) from feature/logger-web into main

Reviewed-on: #160

frontend/src/components/pages/BehaviorNormal.js

@@ -7,18 +7,46 @@ import SubmitField from "../SubmitField";
 import { Logger } from "@behametrics/logger-web";
 
 export default function BehaviorNormal() {
-  const [username, setUsername] = useState("");
-  const [password, setPassword] = useState("");
+  let username = "";
+  const setUsername = (tmp_username) => {
+    username = tmp_username;
+  };
+
+  let password = "";
+  const setPassword = (tmp_password) => {
+    password = tmp_password;
+  };
 
   const [isLoggedIn] = useAuth();
 
-  const handleUsernameChange = (e) => {
-    setUsername(e.target.value);
+  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 handleOnCopyEvent = (e) => {
     e.preventDefault();
     console.log("copy not allowed");
@@ -42,7 +70,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 +83,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