Begin work on grabbing data from the backend to display on the frontend

This commit is contained in:
Innovation 2024-03-30 12:18:10 -05:00
parent 61b3af2d7e
commit 5be1042cd7

View file

@ -168,15 +168,9 @@
<div id="offset">
<div id="topElements">
<div id="vitals">
<div id="heartrate">
<p>Heartrate: 0 BPM</p>
</div>
<div id="oxygen">
<p>Oxygen: 0% O2</p>
</div>
<div id="bodyTemperature">
<p>Body Temp: 0&deg;C</p>
</div>
<div id="heartrate"></div>
<div id="oxygen"></div>
<div id="bodyTemperature"></div>
</div>
<div id="topMessage">
<p>Top message - Notifications, warnings, and malfunctions and such</p>
@ -216,12 +210,65 @@
<p>Test2</p>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.2/jquery.min.js" integrity="sha512-tWHlutFnuG0C6nQRlpvrEhE4QpkG1nn2MOUMWmUeRePl4e3Aki0VB6W1v3oLjFtd0hVOtRQ9PHpSfN6u6/QXkQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script type="text/javascript">
// TODO: Make baseUrl be set by Flask
var baseUrl = "http://localhost:5000"
var baseUrl = "http://localhost:5000";
var vitalsUrl = baseUrl + "/api/vitals";
// Malfunction Messages (human-friendly)
malfunctionMessage = [ "API Malfunction" ]
apiMalfunctionI = 0
function displayMalfunction(malfunction) {
console.log(malfunction);
}
function setVitals(vitalsData) {
//var data = JSON.parse(vitalsData)
heartrate = vitalsData["0"]["heartrate"];
oxygen = vitalsData["0"]["oxygen"];
bodytemp = vitalsData["0"]["bodytemp"];
setVitalsHeartrate(heartrate);
setVitalsOxygen(oxygen);
setVitalsBodytemp(bodytemp);
}
function setVitalsHeartrate(heartrate) {
if(heartrate > 0) {
document.getElementById("heartrate").innerHTML = "<p>Heartrate: " + heartrate + " BPM</p>";
} else {
document.getElementById("heartrate").innerHTML = "";
}
}
function setVitalsOxygen(oxygen) {
if(oxygen > 0) {
document.getElementById("oxygen").innerHTML = "<p>Oxygen: " + oxygen + "% O2</p>";
} else {
document.getElementById("oxygen").innerHTML = "";
}
}
function setVitalsBodytemp(bodytemp) {
if(bodytemp > 0) {
document.getElementById("bodyTemperature").innerHTML = "<p>Body Temp: " + bodytemp + "°C</p>";
} else {
document.getElementById("bodyTemperature").innerHTML = "";
}
}
function updateAll() {
stopInterval(
$.get(vitalsUrl, (data, status) => {
if(status == "success") {
setVitals(data);
} else {
displayMalfunction(malfunctionMessage[apiMalfunctionI] + ": " + status);
}
});
//stopInterval(t)
}
var t=setInterval(updateAll, 1000)
</script>