Start logger when starting survey

frontend/src/components/pages/Study.js

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import "../../App.css";
 import Footer from "../../Footer";
 import InputField from "../InputField";
@@ -9,18 +9,17 @@ import BehaviorNormal from "../BehaviorNormal";
 import { Button } from "../Button";
 
 export default function Study() {
-
+  const _logger = useRef(0);
-  var [logger, setLogger] = useState();
 
   useEffect(() => {
-    logger = new Logger({
+    _logger.current = new Logger({
       //inputs: ["cursor", "wheel", "keyboard", "touch"],
       inputs: ["keyboard"],
       // apiUrl: "https://behavior.marcocamenzind.ch",
       apiUrl: "http://localhost:5000",
       logToConsole: true,
     });
-    logger.init();
+    _logger.current.init();
   }, []);
 
   let username = "";
@@ -33,29 +32,16 @@ export default function Study() {
     password = tmp_password;
   };
 
-  /*
-  let isStepStart = true;
-  const setIsStepStart = (tmp) => {
-    isStepStart = tmp;
-  };
-
-  let isStepNormal = false;
-  const setIsStepNormal = (tmp) => {
-    isStepNormal = tmp;
-  };
-  */
-
   const [isStepStart, setIsStepStart] = useState(true);
   const [isStepNormal, setIsStepNormal] = useState(false);
 
-
   const handleLoggerOff = () => {
-    logger.stop();
+    _logger.current.stop();
     console.log("Logger ausgeschaltet");
   };
 
   const handleLoggerOn = () => {
-    logger.start();
+    _logger.current.start();
     console.log("start logging ");
   };
 
@@ -77,6 +63,7 @@ export default function Study() {
     console.log("isStepStar", isStepStart);
     setIsStepNormal(true);
     console.log("isStepNormal", isStepNormal);
+    handleLoggerOn();
     // forceUpdate();
   };