From 026bd92d651c666a36a068b0658d81c107b61aba Mon Sep 17 00:00:00 2001 From: Dano van den Bosch Date: Tue, 5 Mar 2024 16:03:15 +0100 Subject: [PATCH] =?UTF-8?q?I=20did=20it=20=F0=9F=98=8A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/main.js | 115 ++++++++++++++++++++-------------------------------- 1 file changed, 44 insertions(+), 71 deletions(-) diff --git a/web/main.js b/web/main.js index 2c9f35f..090c1b3 100644 --- a/web/main.js +++ b/web/main.js @@ -10,35 +10,11 @@ let valueArray = [1, 2, 3, 4, 5]; let newValueArray = [4, 5, 6]; let myValue = 1; let intervalDelay = 50; -const sendorDataNode1 = []; -const sendorDataNode2 = []; - -// const socket = new WebSocket("ws://127.0.0.1:8001"); +const sensorData = {}; // Create WebSocket connection. const socket = new WebSocket("ws://145.92.8.114/ws"); -/* -function openConnection() { -// Connection opened -socket.addEventListener("open", (event) => { - console.log("Connected to the WebSocket server"); - socket.send("Hello Server!"); -});} - -// Error handling -socket.addEventListener('error', (event) => { - console.error('WebSocket error:', event); -}); - -// Message handling -socket.addEventListener("message", (event) => { - console.log('Message from server:', event.data); -}); - -openConnection(); -*////////////////////// - function openConnection() { // Open connection socket.addEventListener("open", (event) => { @@ -85,52 +61,39 @@ function handleIncomingData(data) { humidity = data.Humi; CO2 = data.eCO2; TVOC = data.TVOC; - - // console.log("Temperature: ", temperature); - // console.log("Humidity: ", humidity); - // console.log("CO2: ", CO2); - // console.log("TVOC: ", TVOC); - if (nodeNumber == 1) { - sendorDataNode1.push({ - 'node': nodeNumber, - 'temp': temperature, - 'humi': humidity, - 'CO2': CO2, - 'TVOC': TVOC, - }); - } else if (nodeNumber == 2) { - sendorDataNode2.push({ - 'node': nodeNumber, - 'temp': temperature, - 'humi': humidity, - 'CO2': CO2, - 'TVOC': TVOC, - }); + processNodeData(nodeNumber, temperature, humidity, CO2, TVOC); +} + +function processNodeData(nodeNumber, temperature, humidity, CO2, TVOC) { + // Initialize the array for this node if it doesn't exist yet + if (!sensorData[nodeNumber]) { + sensorData[nodeNumber] = []; } - // sendorData.push({ - // 'node': nodeNumber, - // 'temp': temperature, - // 'humi': humidity, - // 'CO2': CO2, - // 'TVOC': TVOC, - // }); + // Push the new data onto the array for this node + sensorData[nodeNumber].push({ + 'node': nodeNumber, + 'temp': temperature, + 'humi': humidity, + 'CO2': CO2, + 'TVOC': TVOC, + }); - if (nodeNumber == 1) { - console.log(sendorDataNode1); - } else if (nodeNumber == 2) { - console.log(sendorDataNode2); - } + // updateNodeData(node, temperature, humidity, lightIntensity) + updateNodeData(nodeNumber, temperature, humidity, CO2, TVOC); - if (sendorDataNode1.length >= 10) { - sendorDataNode1.shift(); - } - if (sendorDataNode2.length >= 10) { - sendorDataNode2.shift(); + // Log the array for this node + console.log(sensorData[nodeNumber]); + + // If the array for this node has more than 10 elements, remove the oldest one + if (sensorData[nodeNumber].length >= 10) { + sensorData[nodeNumber].shift(); } } + + function pushArray(array) { for (let i = 0; i < 10; i++) { array.push(Math.random() * 10); @@ -187,10 +150,6 @@ function nodeData(data, node) { // console.log("Hello World"); } -// nodeData("Temperature: ", 1); -// nodeData("Humidity: ", 2); - - function createNodeData(node) { // Create main div var nodeData = document.createElement("div"); @@ -212,9 +171,9 @@ function createNodeData(node) { flexLiveData.className = "flex-LiveData"; // Create data divs (Temperature, Humidity, Light Intensity) - var dataTypes = ["Temperatuur", "Luchtvochtigheid", "Lichtintensiteit"]; - var ids = ["temperature", "humidity", "lightIntensity"]; - var statusIds = ["tempStatus", "humidStatus", "lightIntensityStatus"]; + var dataTypes = ["Temperatuur", "Luchtvochtigheid", "CO2", "TVOC"]; + var ids = ["temperature", "humidity", "CO2", "TVOC"]; + var statusIds = ["tempStatus", "humidStatus", "CO2Status", "TVOCStatus"]; for (var i = 0; i < dataTypes.length; i++) { var dataDiv = document.createElement("div"); @@ -223,7 +182,7 @@ function createNodeData(node) { dataTypeDiv.textContent = dataTypes[i] + ": "; var pElement = document.createElement("p"); - pElement.id = ids[i]; + pElement.id = ids[i] + node; pElement.textContent = "Not connected"; dataTypeDiv.appendChild(pElement); @@ -278,6 +237,20 @@ function createNodeData(node) { } } +function updateNodeData(node, temperature, humidity, eCO2, TVOC) { + // Update the temperature, humidity and light intensity values + document.getElementById("temperature" + node).textContent = temperature; + document.getElementById("humidity" + node).textContent = humidity; + document.getElementById("CO2" + node).textContent = eCO2; + document.getElementById("TVOC" + node).textContent = TVOC; + + // Update the status text + document.getElementById("tempStatus").textContent = "Connected"; + document.getElementById("humidStatus").textContent = "Connected"; + document.getElementById("CO2Status").textContent = "Connected"; + document.getElementById("TVOCStatus").textContent = "Connected"; +} + // Call the function to create the HTML structure createNodeData(1); createNodeData(2);