linse/boxweb
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[WIP] temp state not working

Browse Source
This commit is contained in:
zolliker
2025-06-04 08:08:02 +02:00
parent 21b76699a5
commit 725745665b
1 changed files with 51 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

126
templates/dil5.html
View File

@ -37,13 +37,13 @@
background-color: #B8EBE5; background-color: #B8EBE5;
border-radius: 12px; border-radius: 12px;
} }
.control-panel p { .control-panel p {
font-size: 20px; font-size: 20px;
font-family:verdana; font-family:verdana;
} }
.control-panel h { .control-panel h {
font-size: 32px; font-size: 32px;
font-family:verdana; font-family:verdana;
@ -74,13 +74,13 @@
} }
#outputtext { #outputtext {
width: 100%; width: 100%;
height: 200px; height: 200px;
resize: none; resize: none;
border-radius: 12px; border-radius: 12px;
} }
.content-container { .content-container {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -92,7 +92,7 @@
<body> <body>
<div class="content-container"> <div class="content-container">
<object id="pump-svg" type="image/svg+xml" data="/static/UI5.svg"></object> <object id="pump-svg" type="image/svg+xml" data="/static/UI5.svg"></object>
<div class="control-panel"> <div class="control-panel">
<h1> DIL5 Control </h1> <h1> DIL5 Control </h1>
<p> States </p> <p> States </p>
@ -113,11 +113,21 @@
//var ctr_ids = ["MV9", "turbopump", "MV10", "MV11", "MV12", "MV13", "MV8", "MVB", "MV2", "MV1", "MV3a", "MV3b", "GV1", "GV2", "MV14", "V1", "V2", "V9", "V5", "V4", "pump", "compressor"]; //var ctr_ids = ["MV9", "turbopump", "MV10", "MV11", "MV12", "MV13", "MV8", "MVB", "MV2", "MV1", "MV3a", "MV3b", "GV1", "GV2", "MV14", "V1", "V2", "V9", "V5", "V4", "pump", "compressor"];
//var ctr_mod = ["MV9", "turbopump", "MV10", "MV11", "MV12", "MV13", "MV8", "MVB", "MV2", "MV1", "MV3a", "MV3b", "GV1", "GV2", "MV14", "V1", "V2", "V9", "V5", "V4", "pump", "compressor"]; //var ctr_mod = ["MV9", "turbopump", "MV10", "MV11", "MV12", "MV13", "MV8", "MVB", "MV2", "MV1", "MV3a", "MV3b", "GV1", "GV2", "MV14", "V1", "V2", "V9", "V5", "V4", "pump", "compressor"];
var ctr_state = { function v(mod, value) {
V1: 0, V2: 0, V4: 0, V5: 0, V9: 0, }
function boolstate(mod, value) {
}
function label(mod, value) {
}
var modules = {
V1: v, V2: v, V4: v, V5: v, V9: v,
MV1: 0, MV2: 0, MV3a: 0, MV3b: 0, MV9: 0, MV10: 0, MV11: 0, MV12: 0, MV13: 0, MV1: 0, MV2: 0, MV3a: 0, MV3b: 0, MV9: 0, MV10: 0, MV11: 0, MV12: 0, MV13: 0,
GV1: 0, GV2: 0, GV1: 0, GV2: 0,
turbopump: 0, pump: 0, compressor: 0 turbopump: 0, pump: 0, compressor: 0,
Druckluft: 1,
} }
// var ctr_state = new Array(ctr_mod.length).fill("init"); // var ctr_state = new Array(ctr_mod.length).fill("init");
@ -131,23 +141,23 @@
var param_unit = [" mbar", " mbar", " mbar", " mbar", " mbar", " Hz", " %"]; var param_unit = [" mbar", " mbar", " mbar", " mbar", " mbar", " Hz", " %"];
var param_mod = ["p1", "p2", "p3", "p4", "p5", "turbopumpspeed", "turbopumpcurrent"]; var param_mod = ["p1", "p2", "p3", "p4", "p5", "turbopumpspeed", "turbopumpcurrent"];
var colors = {"true": "#66ffba", "false": "#ff3067", "error": "#ff8000", "clicked": "#ffffff"}; var colors = {true: "#66ffba", false: "#ff3067", error: "#ff8000", clicked: "#ffffff"};
var controlpanelObject = document.getElementById("pump-svg"); var controlpanelObject = document.getElementById("pump-svg");
var svgDoc; var svgDoc;
let active_state = "MANUAL"; let active_state = "MANUAL";
let pollTimer; let pollTimer;
const POLL_INTERVAL = 500; const POLL_INTERVAL = 500;
function handleStateClick(state) { function handleStateClick(state) {
changeState("stateMachine", state); changeState("stateMachine", state);
document.getElementById(state.toLowerCase() + "-btn").style.backgroundColor = "white"; document.getElementById(state.toLowerCase() + "-btn").style.backgroundColor = "white";
document.getElementById(active_state.toLowerCase() + "-btn").style.backgroundColor = "rgb(175, 176, 177)"; document.getElementById(active_state.toLowerCase() + "-btn").style.backgroundColor = "rgb(175, 176, 177)";
active_state = state; active_state = state;
} }
function updateState(state) { function updateState(state) {
document.getElementById(state.toLowerCase() + "-btn").style.backgroundColor = "white"; document.getElementById(state.toLowerCase() + "-btn").style.backgroundColor = "white";
document.getElementById(active_state.toLowerCase() + "-btn").style.backgroundColor = "rgb(175, 176, 177)"; document.getElementById(active_state.toLowerCase() + "-btn").style.backgroundColor = "rgb(175, 176, 177)";
@ -169,8 +179,8 @@
const index = state_mod.indexOf(mod); const index = state_mod.indexOf(mod);
const element = svgDoc.querySelector("#" + state_ids[index]); const element = svgDoc.querySelector("#" + state_ids[index]);
if (index !== -1 && element) { if (index !== -1 && element) {
element.style.fill = state === "true" ? "#66ffbaff" : element.style.fill = state === true ? "#66ffbaff" :
state === "false" ? "#ff3067ff" : "#eaeaea"; state === false ? "#ff3067ff" : "#eaeaea";
} }
} }
@ -210,7 +220,7 @@
function changeTarget(mod, value) { function changeTarget(mod, value) {
doSend(`change ${mod}:target ${value}`); doSend(`change ${mod}:target ${value}`);
} }
function changeState(mod, value) { function changeState(mod, value) {
@ -219,7 +229,7 @@
} }
function readValue(mod) { function readValue(mod) {
doSend("read " + mod + ":value"); doSend("read " + mod + ":value");
} }
function onClose(evt) { function onClose(evt) {
@ -235,50 +245,16 @@
stopPolling(); stopPolling();
websocket.close(); websocket.close();
} }
} }
function doSend(message) { function doSend(message) {
websocket.send(message); websocket.send(message);
} }
function handleUpdate(msg) { function handleUpdate(action, modpar, data) {
const teile = msg.split(":"); const [mod, param] = modpar.split(':')
const mod = teile[0].split(" ")[1]; const value = data[0]
const param = teile[1].split(" ")[0];
const value = teile[1].split(",")[0].split('[')[1];
if (param === "value") {
if (param_mod.includes(mod)) {
editText(mod, value);
} else if (ctr_mod.includes(mod)) {
console.log(mod, value);
changeControlledValve(mod, value);
} else if (state_mod.includes(mod)) {
fillstateID(mod, value);
} else if (mod == "stateMachine"){
console.log("StateMaschine")
}
} else if (param === "_speed") {
editText("turbopumpspeed", value);
} else if (param === "_current") {
editText("turbopumpcurrent", value);
}
}
function handleChange(msg) {
const teile = msg.split(":");
const mod = teile[0].split(" ")[1];
const value = teile[1].split(",")[0].split('[')[1];
changeControlledValve(mod, value);
}
function handleReply(msg) {
const teile = msg.split(" ");
const modt = teile[1].split(':')
const mod = modt[0]
const param = modt[1]
let value = JSON.parse(teile.slice(2).join(' '))[0]
if (param === "status") { if (param === "status") {
console.log('S', mod, value) console.log('S', mod, value)
@ -304,7 +280,7 @@
if (active_state != "MANUAL"){ if (active_state != "MANUAL"){
updateState("MANUAL") updateState("MANUAL")
} }
} }
} }
} else if (param === "_speed") { } else if (param === "_speed") {
@ -318,14 +294,14 @@
} }
function handleMSG(msg) { function handleMSG(msg) {
if (msg.startsWith("changed")) { const [action, modpar, ...tail] = msg.split(" ");
handleChange(msg); let data = tail.join(' ');
} else if (msg.startsWith("update")) { if (data) {
handleUpdate(msg); data = JSON.parse(data)
} else if (msg.startsWith("reply")) { }
handleReply(msg); if (action in ["changed", "update", "reply"]) {
} else if (msg.startsWith("error_update")) { handleUpdate(action, modpar, data);
// writeToScreen("Error in update: " + msg + '\n'); } else {
console.log(msg); console.log(msg);
} }
} }
@ -360,16 +336,16 @@
pollAllStates(); pollAllStates();
}, POLL_INTERVAL); }, POLL_INTERVAL);
} }
function stopPolling() { function stopPolling() {
clearInterval(pollTimer); clearInterval(pollTimer);
} }
function sleep(ms) { function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms)); return new Promise(resolve => setTimeout(resolve, ms));
} }
async function pollAllStates() { async function pollAllStates() {
for (const mod in ctr_state) { for (const mod in ctr_state) {
doSend(`read ${mod}:value`); doSend(`read ${mod}:value`);
@ -387,14 +363,14 @@
doSend(`read ${mod}:value`); doSend(`read ${mod}:value`);
await sleep(50); await sleep(50);
} }
for (const mod of param_mod) { for (const mod of param_mod) {
doSend(`read ${mod}:value`); doSend(`read ${mod}:value`);
await sleep(50); await sleep(50);
} }
} }
function pollSingle(mod) { function pollSingle(mod) {
doSend(`read ${mod}:value`); doSend(`read ${mod}:value`);
} }
@ -417,11 +393,11 @@
}; };
requestAnimationFrame(processUpdateQueue); requestAnimationFrame(processUpdateQueue);
} }
window.onload = function () { winLoaded = true; if (svgLoaded) afterLoad(); } window.onload = function () { winLoaded = true; if (svgLoaded) afterLoad(); }
controlpanelObject.onload = function () { svgLoaded = true; if (winLoaded) afterLoad(); } controlpanelObject.onload = function () { svgLoaded = true; if (winLoaded) afterLoad(); }
</script> </script>
</body> </body>
</html> </html>