2023-02-01 21:52:55 +02:00
|
|
|
function zeroPad(number) {
|
|
|
|
return ("0" + number).slice(-2)
|
|
|
|
}
|
2023-02-01 22:12:56 +02:00
|
|
|
|
|
|
|
function timeStamp() {
|
2023-02-01 21:52:55 +02:00
|
|
|
now = new Date()
|
|
|
|
Y = now.getFullYear()
|
|
|
|
m = now.getMonth()
|
|
|
|
d = now.getDate()
|
|
|
|
H = zeroPad(now.getHours())
|
|
|
|
M = zeroPad(now.getMinutes())
|
|
|
|
S = zeroPad(now.getSeconds())
|
2023-02-01 22:12:56 +02:00
|
|
|
return `${Y}-${m}-${d} ${H}:${M}:${S}`
|
|
|
|
}
|
|
|
|
|
|
|
|
function coils(data) {
|
2023-02-12 13:42:11 +02:00
|
|
|
if (document.getElementById("coilval_0") == null) {
|
|
|
|
for (n=0; n<data.length; n++) {
|
|
|
|
tablerow = document.createElement("tr")
|
|
|
|
fields = ["address", "value", "symbol", "description"]
|
2023-02-02 13:25:40 +02:00
|
|
|
|
2023-02-12 13:42:11 +02:00
|
|
|
for (i=0; i<fields.length; i++) {
|
|
|
|
td = document.createElement("td")
|
|
|
|
if (fields[i] == "value") {
|
|
|
|
value = document.createTextNode(Number(data[n][fields[i]]))
|
|
|
|
td.id = "coilval_" + n;
|
|
|
|
} else {
|
|
|
|
value = document.createTextNode(data[n][fields[i]])
|
|
|
|
}
|
|
|
|
td.appendChild(value)
|
|
|
|
tablerow.appendChild(td)
|
|
|
|
}
|
2023-02-12 14:30:25 +02:00
|
|
|
if (data[n].reserved) {
|
|
|
|
tablerow.className = "reserved"
|
|
|
|
}
|
2023-02-12 13:42:11 +02:00
|
|
|
datatable.appendChild(tablerow)
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
for (n=0; n<data.length; n++) {
|
|
|
|
coilval = document.getElementById("coilval_" + n);
|
|
|
|
coilval.innerHTML = Number(data[n]["value"])
|
|
|
|
}
|
|
|
|
}
|
2023-02-01 22:12:56 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
function registers(data) {
|
2023-02-12 13:42:11 +02:00
|
|
|
if (document.getElementById("regval_0") == null) {
|
|
|
|
console.log(`${timeStamp()} Filling register data...`)
|
|
|
|
for (n=0; n<data.length; n++) {
|
|
|
|
tablerow = document.createElement("tr")
|
|
|
|
fields = ["address", "value", "symbol", "description"]
|
2023-02-02 13:10:30 +02:00
|
|
|
|
2023-02-12 13:42:11 +02:00
|
|
|
for (i=0; i<fields.length; i++) {
|
|
|
|
td = document.createElement("td")
|
|
|
|
if (fields[i] == "value" && data[n].type == "bitfield") {
|
|
|
|
value = document.createTextNode(data[n].bitfield)
|
|
|
|
} else {
|
|
|
|
value = document.createTextNode(data[n][fields[i]])
|
|
|
|
}
|
|
|
|
if (fields[i] == "value") {
|
|
|
|
td.id = "regval_" + n;
|
|
|
|
}
|
|
|
|
td.appendChild(value)
|
|
|
|
tablerow.appendChild(td)
|
|
|
|
}
|
2023-02-12 14:30:25 +02:00
|
|
|
if (data[n].reserved) {
|
|
|
|
tablerow.className = "reserved"
|
|
|
|
}
|
2023-02-12 13:42:11 +02:00
|
|
|
datatable.appendChild(tablerow)
|
|
|
|
}
|
|
|
|
console.log(`${timeStamp()} Done.`)
|
|
|
|
} else {
|
|
|
|
for (n=0; n<data.length; n++) {
|
|
|
|
regval = document.getElementById("regval_" + n);
|
|
|
|
if (data[n].type == "bitfield") {
|
|
|
|
regval.innerHTML = data[n]["bitfield"]
|
|
|
|
} else {
|
|
|
|
regval.innerHTML = data[n]["value"]
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2023-02-01 22:12:56 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
function getData() {
|
|
|
|
// document.getElementById('time').innerHTML = `${Y}-${m}-${d} ${H}:${M}:${S}`
|
|
|
|
document.getElementById('time').innerHTML = timeStamp()
|
2023-02-01 21:52:55 +02:00
|
|
|
|
|
|
|
error = false
|
|
|
|
// The same index.html is used for both coil and register data,
|
|
|
|
// change api url based on which we're looking at
|
|
|
|
if (document.location.pathname == "/coils/") {
|
|
|
|
url = "/api/v1/coils"
|
|
|
|
document.getElementById("title").innerHTML = "Coils | Enervent Pingvin Kotilämpö"
|
2023-02-02 13:25:40 +02:00
|
|
|
document.getElementById('caption').innerHTML = "Coil values at "
|
2023-02-01 21:52:55 +02:00
|
|
|
}
|
|
|
|
else if (document.location.pathname == "/registers/") {
|
|
|
|
url = "/api/v1/registers"
|
|
|
|
document.getElementById("title").innerHTML = "Registers | Enervent Pingvin Kotilämpö"
|
|
|
|
}
|
|
|
|
else {
|
|
|
|
document.getElementById("data").innerHTML = 'Page not found'
|
|
|
|
error = true
|
|
|
|
}
|
|
|
|
if (!error) {
|
|
|
|
// Fetch data from API
|
|
|
|
fetch(url)
|
|
|
|
.then((response) => {
|
|
|
|
if (!response.ok) {
|
|
|
|
throw new Error(`Error fetching data: ${response.status}`)
|
|
|
|
}
|
|
|
|
return response.json()
|
|
|
|
})
|
|
|
|
.then((data) => {
|
|
|
|
// Populate table
|
2023-02-01 22:12:56 +02:00
|
|
|
if (url == '/api/v1/coils') {
|
|
|
|
coils(data)
|
|
|
|
} else if (url == '/api/v1/registers') {
|
|
|
|
registers(data)
|
2023-02-01 21:52:55 +02:00
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
// Using setTimeout instead of setInterval to avoid possible connection issues
|
|
|
|
// There's no need to update exactly every 5 seconds, the skew is fine
|
2023-02-02 13:25:40 +02:00
|
|
|
setTimeout(getData, 5*1000);
|
2023-02-12 13:42:11 +02:00
|
|
|
}
|
2023-02-12 14:30:25 +02:00
|
|
|
|
|
|
|
// Show or hide rows for "reserved" values when clicking the checkbox
|
|
|
|
incl_res = document.getElementById("incl_res")
|
|
|
|
incl_res.addEventListener("change", (event) => {
|
|
|
|
reservedRows = document.getElementsByClassName("reserved")
|
|
|
|
if (event.currentTarget.checked) {
|
|
|
|
for (i=0; i<reservedRows.length; i++) {
|
|
|
|
reservedRows[i].hidden = true
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
for (i=0; i<reservedRows.length; i++) {
|
|
|
|
reservedRows[i].hidden = false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|