fafo/jeol-t330a
15
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages Wiki Activity Actions

Succbone HMI Updates #10

Merged
q3k merged 4 commits from succd-style into main 2024-10-05 17:37:12 +00:00
Conversation 1 Commits 4 Files changed 1 +22 -14
1 changed files with 22 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit 314dd72aa6 - Show all commits

36
succbone/succd/index.html
View file

@ -317,6 +317,14 @@ window.addEventListener("load", (_) => {
let rpoff = document.querySelector("#rpoff"); let rpoff = document.querySelector("#rpoff");
canvas = document.querySelector("#graph").getContext("2d"); canvas = document.querySelector("#graph").getContext("2d");
let colors = {
default: "background-color: #e8e8e8",
highlightNeutral: "background-color: #8282ff",
highlightCaution: "background-color: #ff941a",
highlightFault: "background-color: #f06060",
highlightGood: "background-color: #60f060",
};
// TODO(q3k): unhardcode this. // TODO(q3k): unhardcode this.
historicalDraw(1024, 512); historicalDraw(1024, 512);
@ -338,7 +346,7 @@ window.addEventListener("load", (_) => {
connected = true; connected = true;
console.log("Socket connected!"); console.log("Socket connected!");
status.innerHTML = "Online"; status.innerHTML = "Online";
status.style = "background-color: #60f060;"; status.style = colors.default;
}); });
socket.addEventListener("message", (event) => { socket.addEventListener("message", (event) => {
const data = JSON.parse(event.data); const data = JSON.parse(event.data);
@ -346,47 +354,47 @@ window.addEventListener("load", (_) => {
mbar.innerHTML = data.Pirani.Mbar; mbar.innerHTML = data.Pirani.Mbar;
if (data.Safety.Failsafe) { if (data.Safety.Failsafe) {
failsafe.innerHTML = "ON"; failsafe.innerHTML = "ON";
failsafe.style = "background-color: #f06060"; failsafe.style = colors.highlightFault;
} else { } else {
failsafe.innerHTML = "OFF"; failsafe.innerHTML = "OFF";
failsafe.style = "background-color: #60f060"; failsafe.style = colors.default;
} }
if (data.Safety.HighPressure) { if (data.Safety.HighPressure) {
highpressure.innerHTML = "ON"; highpressure.innerHTML = "ON";
highpressure.style = "background-color: #f06060"; highpressure.style = colors.default;
} else { } else {
highpressure.innerHTML = "OFF"; highpressure.innerHTML = "OFF";
highpressure.style = "background-color: #60f060"; highpressure.style = colors.default;
} }
if (data.Pumps.RPOn) { if (data.Pumps.RPOn) {
rp.innerHTML = "ON"; rp.innerHTML = "ON";
rp.style = "background-color: #60f060"; rp.style = colors.default;
} else { } else {
rp.innerHTML = "OFF"; rp.innerHTML = "OFF";
rp.style = "background-color: #f06060"; rp.style = colors.highlightNeutral;
} }
if (data.Pumps.DPOn) { if (data.Pumps.DPOn) {
dp.innerHTML = "ON"; dp.innerHTML = "ON";
dp.style = "background-color: #60f060"; dp.style = colors.highlightCaution;
} else { } else {
dp.innerHTML = "OFF"; dp.innerHTML = "OFF";
dp.style = "background-color: #f06060"; dp.style = colors.default;
} }
let t = []; let t = [];
if (data.Feedback.RoughReached) { if (data.Feedback.RoughReached) {
trough.innerHTML = "OK"; trough.innerHTML = "OK";
trough.style = "background-color: #60f060"; trough.style = colors.highlightGood;
} else { } else {
trough.innerHTML = "NOK"; trough.innerHTML = "NOK";
trough.style = "background-color: #f06060"; trough.style = colors.default;
} }
if (data.Feedback.HighReached) { if (data.Feedback.HighReached) {
thigh.innerHTML = "OK"; thigh.innerHTML = "OK";
thigh.style = "background-color: #60f060"; thigh.style = colors.highlightGood;
} else { } else {
thigh.innerHTML = "NOK"; thigh.innerHTML = "NOK";
thigh.style = "background-color: #f06060"; thigh.style = colors.default;
} }
load.innerHTML = data.LoopLoad.toString() + "%"; load.innerHTML = data.LoopLoad.toString() + "%";
historicalPush(data.Pirani.MbarFloat); historicalPush(data.Pirani.MbarFloat);
@ -394,7 +402,7 @@ window.addEventListener("load", (_) => {
}); });
socket.addEventListener("close", (event) => { socket.addEventListener("close", (event) => {
status.innerHTML = "Offline"; status.innerHTML = "Offline";
status.style = "background-color: #f06060;"; status.style = colors.highlightFault;
if (connected) { if (connected) {
console.log("Socket dead, reconnecting..."); console.log("Socket dead, reconnecting...");
} }