Smikkelbakje/J2S1-Kobuki
1
0
Fork 0
mirror of https://gitlab.fdmci.hva.nl/technische-informatica-sm3/ti-projectten/rooziinuubii79.git synced 2025-08-03 20:04:58 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

switched to older version

Browse Source
This commit is contained in:
ishak jmilou.ishak
2024-12-18 12:30:41 +01:00
parent 1ecd474ca1
commit f0b87de63d
1 changed files with 21 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/Python/flask/web/static/script.js
View File

@@ -1,36 +1,32 @@
document.addEventListener("DOMContentLoaded", function() { // Selecteer alle knoppen en voeg een event listener toe aan elke knop
document.querySelectorAll(".btn").forEach(button => { document.querySelectorAll(".btn").forEach(button => {
button.addEventListener("click", function(event) { button.addEventListener("click", function(event) {
event.preventDefault(); // prevents page refresh event.preventDefault(); // voorkomt pagina-verversing
// Get the value of the button // Haal de waarde van de knop op
const direction = event.target.value; const direction = event.target.value;
fetch("/move", { fetch("/move", {
method: "POST", method: "POST",
headers: { headers: {
"Content-Type": "application/json" "Content-Type": "application/json"
}, },
body: JSON.stringify({ direction: direction }) body: JSON.stringify({ direction: direction })
}) })
.then(response => response.json()) .then(response => response.json())
.then(data => {script .then(data => {
console.log("Success:", data); console.log("Success:", data);
}) })
.catch(error => { .catch(error => {
console.error("Error:", error); console.error("Error:", error);
});
}); });
}); });
// Fetch data from the server // Fetch data from the server
async function fetchData() { async function fetchData() {
try{
const response = await fetch("/data"); const response = await fetch("/data");
const data = await response.json(); const data = await response.json();
return data; return data;
} catch (error) {
console.error("Error:", error);
} }
// Parse the data and show it on the website // Parse the data and show it on the website
@@ -38,7 +34,7 @@ document.addEventListener("DOMContentLoaded", function() {
const data = await fetchData(); const data = await fetchData();
const sensorDataContainer = document.getElementById("sensor-data"); const sensorDataContainer = document.getElementById("sensor-data");
sensorDataContainer.innerHTML = ""; // Clear previous data sensorDataContainer.innerHTML = ""; // Clear previous data
// For each object in JSON array, create a new paragraph element and append it to the sensorDataContainer //for each object in json array create a new paragraph element and append it to the sensorDataContainer
for (const [key, value] of Object.entries(data)) { for (const [key, value] of Object.entries(data)) {
const dataElement = document.createElement("p"); const dataElement = document.createElement("p");
dataElement.textContent = `${key}: ${value}`; dataElement.textContent = `${key}: ${value}`;
@@ -46,15 +42,6 @@ document.addEventListener("DOMContentLoaded", function() {
} }
} }
// Update the image
function updateImage() {
var img = document.getElementById("robot-image");
img.src = "/image?" + new Date().getTime(); // Add timestamp to avoid caching
}
// Fetch and display sensor data every 5 seconds // Fetch and display sensor data every 5 seconds
setInterval(parseData, 1000); setInterval(parseData, 5000);
// Update the image every 5 seconds
setInterval(updateImage, 200);
}); });