From 6dba1d026217d656a5033fb2a6d15f76c0f1b498 Mon Sep 17 00:00:00 2001
From: Sam Hos <sam.hos@hva.nl>
Date: Wed, 6 Nov 2024 13:59:40 +0100
Subject: [PATCH] added sensordata to website

---
 src/Python/flask/web/app.py               |  2 +-
 src/Python/flask/web/static/script.js     | 27 +++++++++++++++++++++--
 src/Python/flask/web/templates/index.html |  2 ++
 3 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/src/Python/flask/web/app.py b/src/Python/flask/web/app.py
index e0be6b2..d92d5b0 100644
--- a/src/Python/flask/web/app.py
+++ b/src/Python/flask/web/app.py
@@ -34,7 +34,7 @@ def move():
 
 @app.route('/data', methods=['GET'])
 def data():
-    return jsonify({"kobuki_message": kobuki_message})
+    return kobuki_message
 
 
 
diff --git a/src/Python/flask/web/static/script.js b/src/Python/flask/web/static/script.js
index c6e8451..a5f0161 100644
--- a/src/Python/flask/web/static/script.js
+++ b/src/Python/flask/web/static/script.js
@@ -6,7 +6,6 @@ document.querySelectorAll(".btn").forEach(button => {
     // Haal de waarde van de knop op
     const direction = event.target.value;
 
-    // Verstuur de richting naar de server met fetch
     fetch("/move", {
       method: "POST",
       headers: {
@@ -22,4 +21,28 @@ document.querySelectorAll(".btn").forEach(button => {
       console.error("Error:", error);
     });
   });
-});
+
+  // Fetch data from the server
+  async function fetchData() {
+    const response = await fetch("/data");
+    const data = await response.json();
+    return data;
+  }
+
+  // Parse the data and show it on the website
+  async function parseData() {
+    const data = await fetchData();
+    console.log("Fetched data:", data); // Log the fetched data
+    const sensorDataContainer = document.getElementById("sensor-data");
+    sensorDataContainer.innerHTML = ""; // Clear previous data
+
+    for (const [key, value] of Object.entries(data)) {
+      const dataElement = document.createElement("p");
+      dataElement.textContent = `${key}: ${value}`;
+      sensorDataContainer.appendChild(dataElement);
+    }
+  }
+
+  // Fetch and display sensor data every 5 seconds
+  setInterval(parseData, 5000);
+});
\ No newline at end of file
diff --git a/src/Python/flask/web/templates/index.html b/src/Python/flask/web/templates/index.html
index eccf147..eb529e8 100644
--- a/src/Python/flask/web/templates/index.html
+++ b/src/Python/flask/web/templates/index.html
@@ -28,6 +28,8 @@
     </div>
     <div class="container">
       <h1>Sensor Data</h1>
+      <div id="sensor-data">
+      </div>
     </div>
     <script src="../static/script.js"></script>
   </body>