From 80cb99cb36448a587fb6d060bacff9fb5161399e Mon Sep 17 00:00:00 2001
From: cami <cami+giteaspcodes@mailbox.org>
Date: Wed, 23 Jun 2021 05:12:01 +0200
Subject: [PATCH 1/4] started for survey feature

---
 frontend/src/App.js                      |  2 ++
 frontend/src/components/pages/Umfrage.js | 46 ++++++++++++++++++++++++
 2 files changed, 48 insertions(+)
 create mode 100644 frontend/src/components/pages/Umfrage.js

diff --git a/frontend/src/App.js b/frontend/src/App.js
index 97c642d..0cfe98a 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -10,6 +10,7 @@ import Login from "./components/pages/Login";
 import Register from "./components/pages/Register";
 import Manual from "./components/pages/Manual";
 import Secret from "./components/pages/Secret";
+import Umfrage from "./components/pages/Umfrage";
 import PrivateRoute from "./auth/PrivateRoute";
 
 function App() {
@@ -27,6 +28,7 @@ function App() {
           <Route path="/manual" component={Manual} />
           <Route path="/ueber" component={Ueber} />
           <PrivateRoute path="/secret" component={Secret} />
+          <PrivateRoute path="/umfrage" component={Umfrage} />
         </Switch>
       </Router>
     </>
diff --git a/frontend/src/components/pages/Umfrage.js b/frontend/src/components/pages/Umfrage.js
new file mode 100644
index 0000000..ed3bf86
--- /dev/null
+++ b/frontend/src/components/pages/Umfrage.js
@@ -0,0 +1,46 @@
+import React from "react";
+import "../../App.css";
+import Footer from "../../Footer";
+import InputField from "../InputField";
+import SubmitField from "../SubmitField";
+
+export default function Umfrage() {
+  return (
+    <>
+      <div className="sitePage">
+        <h1> Umfrage</h1>
+        <p>
+          Damit ich etwas über die Studienteilnehmenden erfahre, möchte ich hier
+          eine kurze Erhebung einiger wichtiger Daten machen. Die Daten werden
+          natürlich nicht genauer verfolgt und die Auswertung der biometrischen
+          Verhaltensmerkmale geschieht unabhängig davon. Konkret bedeutet das,
+          dass ich deine Angaben nicht mit den Informationen aus den
+          Verhaltensmerkmalen zusammenfliessen lasse.
+        </p>
+        <p>
+          Die Umfrage dauert nur ca. 2 Minuten und nach der ersten Befragung
+          musst du diese auch nicht mehr ausfüllen, da ich dann eine Auswertung
+          machen kann.
+        </p>
+        <form id="umfrage">
+          <InputField
+            InputType="number"
+            LabelName="Wie alt bist du? (Alter in Jahren)"
+          />
+          <select>
+            <option value="male">Männlich</option>
+            <option value="female">Weiblich</option>
+            <option value="divers">divers</option>
+            <option value="sex_na">Keine Angabe</option>
+          </select>
+          <SubmitField
+            InputName="Umfrage abschicken"
+            InputValue="Umfrage abschicken"
+            LabelName="Umfrage abschicken"
+          />
+        </form>
+      </div>
+      <Footer />
+    </>
+  );
+}

From 32b8186fc7182ad4c795e9377808ec03880cec20 Mon Sep 17 00:00:00 2001
From: cami <cami+giteaspcodes@mailbox.org>
Date: Thu, 24 Jun 2021 02:01:17 +0200
Subject: [PATCH 2/4] Added frontend for survey

---
 frontend/src/components/pages/Umfrage.js | 114 +++++++++++++++++++++--
 1 file changed, 107 insertions(+), 7 deletions(-)

diff --git a/frontend/src/components/pages/Umfrage.js b/frontend/src/components/pages/Umfrage.js
index ed3bf86..53825e4 100644
--- a/frontend/src/components/pages/Umfrage.js
+++ b/frontend/src/components/pages/Umfrage.js
@@ -1,13 +1,59 @@
 import React from "react";
+import { useState } from "react/cjs/react.development";
 import "../../App.css";
 import Footer from "../../Footer";
 import InputField from "../InputField";
 import SubmitField from "../SubmitField";
 
 export default function Umfrage() {
+  const [age, setAge] = useState("");
+  const [gender, setGender] = useState("");
+  const [education, setEducation] = useState("");
+  const [skills, setSkills] = useState("");
+
+  const onSubmitClick = (e) => {
+    e.preventDefault();
+    let opts = {
+      age: age,
+      gender: gender,
+      education: education,
+      skills: skills,
+    };
+    console.log(opts);
+    /*fetch("/api/login", {
+      method: "post",
+      body: JSON.stringify(opts),
+    })
+      .then((r) => r.json())
+      .then((token) => {
+        if (token.access_token) {
+          login(token);
+        } else {
+          console.log("Please type in the correct username / password");
+        }
+      });
+      */
+  };
+
+  const handleAgeChange = (e) => {
+    setAge(e.target.value);
+  };
+
+  const handleGenderChange = (e) => {
+    setGender(e.target.value);
+  };
+
+  const handleEducationChange = (e) => {
+    setEducation(e.target.value);
+  };
+
+  const handleSkillsChange = (e) => {
+    setSkills(e.target.value);
+  };
+
   return (
     <>
-      <div className="sitePage">
+      <div className="sitePage" onSubmit={onSubmitClick}>
         <h1> Umfrage</h1>
         <p>
           Damit ich etwas über die Studienteilnehmenden erfahre, möchte ich hier
@@ -25,14 +71,68 @@ export default function Umfrage() {
         <form id="umfrage">
           <InputField
             InputType="number"
+            onChange={handleAgeChange}
             LabelName="Wie alt bist du? (Alter in Jahren)"
           />
-          <select>
-            <option value="male">Männlich</option>
-            <option value="female">Weiblich</option>
-            <option value="divers">divers</option>
-            <option value="sex_na">Keine Angabe</option>
-          </select>
+          <div>
+            <label htmlFor="gender">Welches Geschlecht hast du?</label> <br />
+            <select
+              name="gender"
+              id="gender"
+              onChange={handleGenderChange}
+              defaultValue="DEFAULT"
+            >
+              <option disabled value="DEFAULT">
+                -- Bitte wähle etwas aus --{" "}
+              </option>
+              <option value="male">Männlich</option>
+              <option value="female">Weiblich</option>
+              <option value="divers">divers</option>
+              <option value="sex_na">Keine Angabe</option>
+            </select>
+          </div>
+          <div>
+            <label htmlFor="education">
+              Welches ist deine höchste abgeschlossene Ausbildung?
+            </label>
+            <select
+              name="education"
+              id="education"
+              onChange={handleEducationChange}
+              defaultValue="DEFAULT"
+            >
+              <option disabled value="DEFAULT">
+                -- Bitte wähle deine Ausbildung aus --
+              </option>
+              <option>Berufslehre</option>
+              <option>Gymnasiale Maturität</option>
+              <option>Berufsmatura</option>
+              <option>Bachelor</option>
+              <option>Master oder höher</option>
+              <option>Keine Angabe</option>
+            </select>
+          </div>
+          <div>
+            <label htmlFor="itskills">
+              Wie schätzt du deine Kompetenzen im Bereich der Informatik als
+              Anwender ein?
+            </label>
+            <select
+              name="itskills"
+              id="itskills"
+              onChange={handleSkillsChange}
+              defaultValue="DEFAULT"
+            >
+              <option disabled value="DEFAULT">
+                -- Bitte wähle etwas aus --
+              </option>
+              <option>Sehr gut</option>
+              <option>Gut</option>
+              <option>Mittel</option>
+              <option>Eher nicht so gut</option>
+              <option>Gar nicht gut</option>
+            </select>
+          </div>
           <SubmitField
             InputName="Umfrage abschicken"
             InputValue="Umfrage abschicken"

From 8424cb346fb0ff322886a56432ae5013f7c00015 Mon Sep 17 00:00:00 2001
From: cami <cami+giteaspcodes@mailbox.org>
Date: Thu, 24 Jun 2021 02:53:42 +0200
Subject: [PATCH 3/4] Added some more questions and fixed some css

---
 frontend/src/components/Input.css        |  9 ++++++++-
 frontend/src/components/pages/Umfrage.js | 20 +++++++++++++-------
 2 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/frontend/src/components/Input.css b/frontend/src/components/Input.css
index 4da45d1..4810ff9 100644
--- a/frontend/src/components/Input.css
+++ b/frontend/src/components/Input.css
@@ -1,12 +1,15 @@
 .input-field {
   width: auto;
+  margin-bottom: 2em;
+  font-size: 1.5em;
 }
 
 .input-field p {
   font-size: 1.5em;
 }
 
-.input-field input {
+.input-field input,
+.input-field select {
   width: 100%;
   border-color: var(--primary);
   background-color: var(--secondary);
@@ -27,3 +30,7 @@
 .input-field input[type="submit"]:hover {
   background-color: var(--primary-contr);
 }
+
+.input-field label {
+  font-size: 1.5em;
+}
\ No newline at end of file
diff --git a/frontend/src/components/pages/Umfrage.js b/frontend/src/components/pages/Umfrage.js
index 53825e4..439eb01 100644
--- a/frontend/src/components/pages/Umfrage.js
+++ b/frontend/src/components/pages/Umfrage.js
@@ -1,6 +1,7 @@
 import React from "react";
 import { useState } from "react/cjs/react.development";
 import "../../App.css";
+import "../Input.css";
 import Footer from "../../Footer";
 import InputField from "../InputField";
 import SubmitField from "../SubmitField";
@@ -53,7 +54,7 @@ export default function Umfrage() {
 
   return (
     <>
-      <div className="sitePage" onSubmit={onSubmitClick}>
+      <div className="sitePage">
         <h1> Umfrage</h1>
         <p>
           Damit ich etwas über die Studienteilnehmenden erfahre, möchte ich hier
@@ -65,16 +66,18 @@ export default function Umfrage() {
         </p>
         <p>
           Die Umfrage dauert nur ca. 2 Minuten und nach der ersten Befragung
-          musst du diese auch nicht mehr ausfüllen, da ich dann eine Auswertung
-          machen kann.
+          musst du diese auch nicht mehr ausfüllen, da ich dann eine ungefähre
+          Auswertung machen kann, wie sich die Studienteilnehmenden aufteilen.
+          So kann es für mich beispielsweise relevant sein, wenn sämtliche
+          Teilnehmenden ein sehr gutes Informatikverständnis haben.
         </p>
-        <form id="umfrage">
+        <form id="umfrage" onClick={onSubmitClick}>
           <InputField
             InputType="number"
             onChange={handleAgeChange}
             LabelName="Wie alt bist du? (Alter in Jahren)"
           />
-          <div>
+          <div className="input-field">
             <label htmlFor="gender">Welches Geschlecht hast du?</label> <br />
             <select
               name="gender"
@@ -91,10 +94,11 @@ export default function Umfrage() {
               <option value="sex_na">Keine Angabe</option>
             </select>
           </div>
-          <div>
+          <div className="input-field">
             <label htmlFor="education">
               Welches ist deine höchste abgeschlossene Ausbildung?
             </label>
+            <br />
             <select
               name="education"
               id="education"
@@ -112,11 +116,12 @@ export default function Umfrage() {
               <option>Keine Angabe</option>
             </select>
           </div>
-          <div>
+          <div className="input-field">
             <label htmlFor="itskills">
               Wie schätzt du deine Kompetenzen im Bereich der Informatik als
               Anwender ein?
             </label>
+            <br />
             <select
               name="itskills"
               id="itskills"
@@ -131,6 +136,7 @@ export default function Umfrage() {
               <option>Mittel</option>
               <option>Eher nicht so gut</option>
               <option>Gar nicht gut</option>
+              <option>Keine Angabe</option>
             </select>
           </div>
           <SubmitField

From 520252bbeef7adaf0b022519f6316a954b73ca20 Mon Sep 17 00:00:00 2001
From: cami <cami+giteaspcodes@mailbox.org>
Date: Fri, 25 Jun 2021 03:02:44 +0200
Subject: [PATCH 4/4] Added backend to prod docker environment

---
 backend/Dockerfile.prod |  7 ++++---
 docker-compose.prod.yml | 12 ++++++++++++
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/backend/Dockerfile.prod b/backend/Dockerfile.prod
index 3eba885..1bd4a72 100644
--- a/backend/Dockerfile.prod
+++ b/backend/Dockerfile.prod
@@ -1,12 +1,13 @@
 FROM python
 
-WORKDIR /opt/demo/
+WORKDIR /app
+
+RUN apt-get -y update && apt-get -y upgrade
 
 COPY requirements.txt .
 
-RUN apt-get -y update && apt-get -y upgrade
 RUN pip install -r requirements.txt
 
 COPY /src .
 
-CMD [ "python", "main.py" ]
+CMD [ "python", "app.py" ]
diff --git a/docker-compose.prod.yml b/docker-compose.prod.yml
index b67cb2c..22f54f4 100644
--- a/docker-compose.prod.yml
+++ b/docker-compose.prod.yml
@@ -8,3 +8,15 @@ services:
       dockerfile: Dockerfile.prod
     ports:
       - 8877:80
+  backend-prod:
+    container_name: backend_bt
+    build:
+      context: ./backend
+      dockerfile: Dockerfile.prod
+    ports:
+      - 5000:5000
+    environment:
+      DEBUG: "no"
+      PORT: 5000
+      HOST: "0.0.0.0"
+