From a56e8ccb5cae107145369600b82a02ee4a365f77 Mon Sep 17 00:00:00 2001
From: cami <cami+giteaspcodes@mailbox.org>
Date: Wed, 21 Jul 2021 02:21:00 +0200
Subject: [PATCH 1/3] Renamed behavior to study

---
 frontend/src/App.js                      |   4 +-
 frontend/src/components/HeroSection.js   |   2 +-
 frontend/src/components/pages/Login.js   |   2 +-
 frontend/src/components/pages/Study.js   | 123 +++++++++++++++++++++++
 frontend/src/components/pages/Umfrage.js |   2 +-
 5 files changed, 128 insertions(+), 5 deletions(-)
 create mode 100644 frontend/src/components/pages/Study.js

diff --git a/frontend/src/App.js b/frontend/src/App.js
index 20f00f1..415c951 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 BehaviorNormal from "./components/pages/BehaviorNormal";
+import Study from "./components/pages/Study";
 
 function App() {
   return (
@@ -28,7 +28,7 @@ function App() {
           <Route path="/register" component={Register} />
           <Route path="/manual" component={Manual} />
           <Route path="/ueber" component={Ueber} />
-          <PrivateRoute path="/behavior" component={BehaviorNormal} />
+          <PrivateRoute path="/study" component={Study} />
           <PrivateRoute path="/secret" component={Secret} />
           <PrivateRoute path="/umfrage" component={Umfrage} />
         </Switch>
diff --git a/frontend/src/components/HeroSection.js b/frontend/src/components/HeroSection.js
index be197eb..1767dc4 100644
--- a/frontend/src/components/HeroSection.js
+++ b/frontend/src/components/HeroSection.js
@@ -17,7 +17,7 @@ function HeroSection() {
             className="btns"
             buttonStyle="btn--primary"
             buttonSize="btn--large"
-            newTo="behavior"
+            newTo="study"
           >
             Zur Studie
           </Button>
diff --git a/frontend/src/components/pages/Login.js b/frontend/src/components/pages/Login.js
index 46dd4c5..c6ea7f8 100644
--- a/frontend/src/components/pages/Login.js
+++ b/frontend/src/components/pages/Login.js
@@ -70,7 +70,7 @@ export default function Login() {
           </form>
         ) : (
           <>
-            <Redirect to="/behavior" />
+            <Redirect to="/study" />
           </>
         )}
       </div>
diff --git a/frontend/src/components/pages/Study.js b/frontend/src/components/pages/Study.js
new file mode 100644
index 0000000..a6bbeab
--- /dev/null
+++ b/frontend/src/components/pages/Study.js
@@ -0,0 +1,123 @@
+import React, { useEffect } 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";
+
+export default function Study() {
+  let username = "";
+  const setUsername = (tmp_username) => {
+    username = tmp_username;
+  };
+
+  let password = "";
+  const setPassword = (tmp_password) => {
+    password = tmp_password;
+  };
+
+  let logger = new Logger({
+    //inputs: ["cursor", "wheel", "keyboard", "touch"],
+    inputs: ["keyboard"],
+    // apiUrl: "https://behavior.marcocamenzind.ch",
+    apiUrl: "http://localhost:5000",
+    logToConsole: true,
+  });
+
+  logger.init();
+
+  const handleLoggerOff = () => {
+    logger.stop();
+    console.log("Logger ausgeschaltet");
+  };
+
+  const handleLoggerOn = () => {
+    logger.start();
+    console.log("start logging ");
+  };
+
+  const handlePasswordChange = (e) => {
+    setPassword(e.target.value);
+  };
+
+  const handleUsernameChange = (e) => {
+    setUsername(e.target.value);
+  };
+
+  const handleOnPasteEvent = (e) => {
+    e.preventDefault();
+    return false;
+  };
+
+  const onSubmitClick = (e) => {
+    e.preventDefault();
+    let opts = {
+      username: username,
+      password: password,
+    };
+    fetch("/api/protected/behavior", {
+      method: "post",
+      body: JSON.stringify(opts),
+    }).then((response) => {
+      console.log(response.status);
+      if (response.status === 401) {
+        response.json().then((resp) => {
+          console.log("nicht so wirklich gut");
+          // setErrorMessage(resp.message);
+        });
+      } else {
+        response.json().then((token) => {
+          console.log("Alles gut :-)");
+        });
+      }
+    });
+  };
+
+  return (
+    <>
+      <div className="sitePage">
+        <h1>Studie</h1>
+        <button onClick={handleLoggerOn}>LOGGER StaRTEN</button>
+        <BehaviorStudyInfo />{" "}
+        <form id="behaviorNormal" action="#">
+          <SubmitField
+            LabelName="Starten mit der Studie"
+            InputValue="next-situation"
+            InputName="Weiter"
+            onClick={handleLoggerOn}
+          />
+        </form>{" "}
+        <BehaviorNormal />
+        <form id="behaviorNormal" action="#">
+          <InputField
+            LabelName="Benutzername"
+            onChange={handleUsernameChange}
+            InputType="text"
+            InputName="Benutzername"
+            InputPlaceHolder="Benutzername"
+            onPaste={handleOnPasteEvent}
+          />
+          <InputField
+            LabelName="Passwort"
+            onChange={handlePasswordChange}
+            InputType="password"
+            InputName="Passwort"
+            InputPlaceHolder="Benutzername"
+            onPaste={handleOnPasteEvent}
+          />
+          <SubmitField
+            LabelNa
+            me="Weiter zur nächsten Situation"
+            InputValue="next-situation"
+            InputName="Weiter"
+            onClick={onSubmitClick}
+          />
+        </form>
+        <button onClick={handleLoggerOff}>STOP THAT FUCKING LOGGER</button>
+      </div>
+      <Footer />
+    </>
+  );
+}
diff --git a/frontend/src/components/pages/Umfrage.js b/frontend/src/components/pages/Umfrage.js
index 7a7e9d8..33bc203 100644
--- a/frontend/src/components/pages/Umfrage.js
+++ b/frontend/src/components/pages/Umfrage.js
@@ -219,7 +219,7 @@ export default function Umfrage() {
         {!isSurveyValidBackend ? (
           <ErrorMessage message={backendErrorMessage} />
         ) : (
-          <Redirect to="/behavior" />
+          <Redirect to="/study" />
         )}
       </div>
       <Footer />
-- 
2.43.4


From 966304ac3a5a93f02f974389f17af573385aac4b Mon Sep 17 00:00:00 2001
From: cami <cami+giteaspcodes@mailbox.org>
Date: Wed, 21 Jul 2021 02:21:40 +0200
Subject: [PATCH 2/3] Refactored herosection so it is more consistent with
 other fiels

---
 frontend/src/components/HeroSection.js | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/frontend/src/components/HeroSection.js b/frontend/src/components/HeroSection.js
index 1767dc4..93211d3 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";
 
-function HeroSection() {
+export default function HeroSection() {
   const [isLoggedIn] = useAuth();
 
   return (
@@ -53,5 +53,3 @@ function HeroSection() {
     </div>
   );
 }
-
-export default HeroSection;
-- 
2.43.4


From 213dcc91975798582f329952a4b9e8e80ccf2657 Mon Sep 17 00:00:00 2001
From: cami <cami+giteaspcodes@mailbox.org>
Date: Wed, 21 Jul 2021 02:22:40 +0200
Subject: [PATCH 3/3] Renaming some files.

---
 frontend/src/components/BehaviorNormal.js     |  16 ++
 frontend/src/components/BehaviorStudyInfo.js  |  20 +++
 frontend/src/components/GeneratedPassword.js  |  29 ++++
 .../src/components/pages/BehaviorNormal.js    | 140 ------------------
 .../src/components/pages/BehaviorStudyInfo.js |  13 --
 5 files changed, 65 insertions(+), 153 deletions(-)
 create mode 100644 frontend/src/components/BehaviorNormal.js
 create mode 100644 frontend/src/components/BehaviorStudyInfo.js
 create mode 100644 frontend/src/components/GeneratedPassword.js
 delete mode 100644 frontend/src/components/pages/BehaviorNormal.js
 delete mode 100644 frontend/src/components/pages/BehaviorStudyInfo.js

diff --git a/frontend/src/components/BehaviorNormal.js b/frontend/src/components/BehaviorNormal.js
new file mode 100644
index 0000000..9f64ef9
--- /dev/null
+++ b/frontend/src/components/BehaviorNormal.js
@@ -0,0 +1,16 @@
+import React from "react";
+import "../App.css";
+import GeneratedPassword from "./GeneratedPassword"
+
+export default function BehaviorNormal() {
+  return (
+    <>
+      <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>
+      <GeneratedPassword />
+    </>
+  );
+}
diff --git a/frontend/src/components/BehaviorStudyInfo.js b/frontend/src/components/BehaviorStudyInfo.js
new file mode 100644
index 0000000..eaea777
--- /dev/null
+++ b/frontend/src/components/BehaviorStudyInfo.js
@@ -0,0 +1,20 @@
+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>
+      <p>
+        Bitte klicken Sie auf weiter, um mit der Studie zu beginnen. Bitte lesen
+        Sie die jeweilige Aufgabe jeweils genau.
+      </p>
+
+    </>
+  );
+}
diff --git a/frontend/src/components/GeneratedPassword.js b/frontend/src/components/GeneratedPassword.js
new file mode 100644
index 0000000..c963b5c
--- /dev/null
+++ b/frontend/src/components/GeneratedPassword.js
@@ -0,0 +1,29 @@
+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 (
+    <>
+      <p onCopy={handleOnCopyEvent}>
+        Das Passwort für diese Situation lautet:{" "}
+        <span className="generated-password">{genPassword}</span>
+      </p>
+    </>
+  );
+}
diff --git a/frontend/src/components/pages/BehaviorNormal.js b/frontend/src/components/pages/BehaviorNormal.js
deleted file mode 100644
index 0bb4d67..0000000
--- a/frontend/src/components/pages/BehaviorNormal.js
+++ /dev/null
@@ -1,140 +0,0 @@
-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";
-
-export default function BehaviorNormal() {
-  let username = "";
-  const setUsername = (tmp_username) => {
-    username = tmp_username;
-  };
-
-  let password = "";
-  const setPassword = (tmp_password) => {
-    password = tmp_password;
-  };
-
-  const [genPassword, setGenPassword] = useState("");
-
-  let logger = new Logger({
-    //inputs: ["cursor", "wheel", "keyboard", "touch"],
-    inputs: ["keyboard"],
-    apiUrl: "https://behavior.marcocamenzind.ch",
-    logToConsole: true,
-  });
-
-  logger.init();
-
-  const handleOff = () => {
-    logger.stop();
-    console.log("Logger ausgeschaltet");
-  };
-
-  const handleOn = () => {
-    logger.start();
-    console.log("start logging ");
-  };
-
-  const handlePasswordChange = (e) => {
-    setPassword(e.target.value);
-  };
-
-  const handleUsernameChange = (e) => {
-    setUsername(e.target.value);
-  };
-
-  const handleOnCopyEvent = (e) => {
-    e.preventDefault();
-    return false;
-  };
-
-  const handleOnPasteEvent = (e) => {
-    e.preventDefault();
-    return false;
-  };
-
-  const onSubmitClick = (e) => {
-    e.preventDefault();
-    let opts = {
-      username: username,
-      password: password,
-    };
-    fetch("/api/protected/behavior", {
-      method: "post",
-      body: JSON.stringify(opts),
-    }).then((response) => {
-      console.log(response.status);
-      if (response.status === 401) {
-        response.json().then((resp) => {
-          console.log("nicht so wirklich gut");
-          // setErrorMessage(resp.message);
-        });
-      } else {
-        response.json().then((token) => {
-          console.log("Alles gut :-)");
-        });
-      }
-    });
-  };
-
-  useEffect(() => {
-    fetch("/api/protected/rcv_pw", {
-      method: "get",
-    }).then((response) => {
-      response.json().then((resp) => {
-        setGenPassword(resp.password);
-      });
-    });
-  }, []);
-
-  return (
-    <>
-      <div className="sitePage">
-        <h1>Studie</h1>
-        <button onClick={handleOn}>LOGGER StaRTEN</button>
-        <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>
-        </p>
-        <form id="behaviorNormal" action="#">
-          <InputField
-            LabelName="Benutzername"
-            onChange={handleUsernameChange}
-            InputType="text"
-            InputName="Benutzername"
-            InputPlaceHolder="Benutzername"
-            onCopy={handleOnCopyEvent}
-            onPaste={handleOnPasteEvent}
-          />
-          <InputField
-            LabelName="Passwort"
-            onChange={handlePasswordChange}
-            InputType="password"
-            InputName="Passwort"
-            InputPlaceHolder="Benutzername"
-            onCopy={handleOnCopyEvent}
-            onPaste={handleOnPasteEvent}
-          />
-          <SubmitField
-            LabelNa
-            me="Weiter zur nächsten Situation"
-            InputValue="next-situation"
-            InputName="Weiter"
-            onClick={onSubmitClick}
-          />
-        </form>
-        <button onClick={handleOff}>STOP THAT FUCKING LOGGER</button>
-      </div>
-      <Footer />
-    </>
-  );
-}
diff --git a/frontend/src/components/pages/BehaviorStudyInfo.js b/frontend/src/components/pages/BehaviorStudyInfo.js
deleted file mode 100644
index 35e3b98..0000000
--- a/frontend/src/components/pages/BehaviorStudyInfo.js
+++ /dev/null
@@ -1,13 +0,0 @@
-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>
-  );
-}
-- 
2.43.4