From b971fe0b5492c6a5d896a0837453fe7e1a67044d Mon Sep 17 00:00:00 2001 From: Dano van den Bosch Date: Wed, 6 Mar 2024 11:25:58 +0100 Subject: [PATCH] dev page documentation added to pages --- docs/.pages | 2 + .../SoftwareDocumentatie/Dev_page.md | 151 ++++++++++++++++++ 2 files changed, 153 insertions(+) create mode 100644 docs/brainstorm/SoftwareDocumentatie/Dev_page.md diff --git a/docs/.pages b/docs/.pages index 2887b9f..5c63f2f 100644 --- a/docs/.pages +++ b/docs/.pages @@ -22,4 +22,6 @@ nav: - Infrastructure: brainstorm/UML-infrastructure - Taskflow: brainstorm/Taskflow - Design: Sp1SchetsProject/FirstDesign + - 🖨️ Software: + - Dev page: brainstrom/SotwareDocumentatie/Dev_page \ No newline at end of file diff --git a/docs/brainstorm/SoftwareDocumentatie/Dev_page.md b/docs/brainstorm/SoftwareDocumentatie/Dev_page.md new file mode 100644 index 0000000..138990e --- /dev/null +++ b/docs/brainstorm/SoftwareDocumentatie/Dev_page.md @@ -0,0 +1,151 @@ + + +### parsing JSON + +```js + const jsonData = JSON.parse(event.data); + // Use the parsed JSON data as needed + handleIncomingData(jsonData); +``` + +### Pro + + +function handleIncomingData(data) { + nodeNumber = data.node; + temperature = data.Temp; + humidity = data.Humi; + CO2 = data.eCO2; + TVOC = data.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] = []; + } + + // Push the new data onto the array for this node + sensorData[nodeNumber].push({ + 'node': nodeNumber, + 'temp': temperature, + 'humi': humidity, + 'CO2': CO2, + 'TVOC': TVOC, + }); + + // updateNodeData(node, temperature, humidity, lightIntensity) + updateNodeData(nodeNumber, temperature, humidity, CO2, TVOC); + + // 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 createNodeData(node) { + // Create main div + var nodeData = document.createElement("div"); + nodeData.className = "nodeData"; + + // Create flex-NodeData div + var flexNodeData = document.createElement("div"); + flexNodeData.clsName = "flex-NodeData"; + + // Create p element + var pNode = document.createElement("p"); + pNode.textContent = "Node " + node; + + // Append p to flex-NodeData + flexNodeData.appendChild(pNode); + + // Create flex-LiveData div + var flexLiveData = document.createElement("div"); + flexLiveData.className = "flex-LiveData"; + + // Create data divs (Temperature, Humidity, Light Intensity) + 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"); + + var dataTypeDiv = document.createElement("div"); + dataTypeDiv.textContent = dataTypes[i] + ": "; + + var pElement = document.createElement("p"); + pElement.id = ids[i] + node; + pElement.textContent = "Not connected"; + + dataTypeDiv.appendChild(pElement); + dataDiv.appendChild(dataTypeDiv); + + var statusElement = document.createElement("div"); + statusElement.className = "statusElement"; + + var statusText = document.createElement("p"); + statusText.className = "statusText"; + statusText.id = statusIds[i]; + statusText.textContent = "Not connected"; + + statusElement.appendChild(statusText); + dataDiv.appendChild(statusElement); + + flexLiveData.appendChild(dataDiv); + } + + // Append flex-LiveData to flex-NodeData + flexNodeData.appendChild(flexLiveData); + + // Create flex-graph div + var flexGraph = document.createElement("div"); + flexGraph.className = "flex-graph"; + + var graphDiv = document.createElement("div"); + + var graphP = document.createElement("p"); + graphP.textContent = "Live graph:"; + + var liveGraph = document.createElement("div"); + liveGraph.id = "liveGraph"; + + graphDiv.appendChild(graphP); + graphDiv.appendChild(liveGraph); + flexGraph.appendChild(graphDiv); + + // Append flex-graph to flex-NodeData + flexNodeData.appendChild(flexGraph); + + // Append flex-NodeData to main div + nodeData.appendChild(flexNodeData); + + // Check if nodeDataLocation element exists + var nodeDataLocation = document.getElementById("nodeDataLocation"); + if (nodeDataLocation) { + // Append main div to nodeDataLocation + nodeDataLocation.appendChild(nodeData); + } else { + console.error("Element with ID 'nodeDataLocation' does not exist."); + } +} + +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"; +} +