webui: highlight individual temperature sensors

This commit is contained in:
2026-06-12 01:31:20 -06:00
parent c3b8cbbb74
commit eba0012e71
@@ -981,11 +981,22 @@ function render(data){
`<div class="item"><span>No cell data</span><strong class="muted">--</strong></div>`; `<div class="item"><span>No cell data</span><strong class="muted">--</strong></div>`;
const visibleTemps=(data.temps||[]).filter(t=>t.enabled && t.online && typeof t.temperature_f==="number"); const visibleTemps=(data.temps||[]).filter(t=>t.enabled && t.online && typeof t.temperature_f==="number");
$("temps").innerHTML=visibleTemps.map(t=>` $("temps").innerHTML=visibleTemps.map(t=>{
<div class="item"> const alertActive =
!!t.high_alert ||
(
t.high_alert_enabled &&
typeof t.temperature_f === "number" &&
typeof t.high_alert_f === "number" &&
t.temperature_f > t.high_alert_f
);
return `
<div class="item ${alertActive ? 'temp-alert' : ''}">
<span>${t.name||t.id}</span> <span>${t.name||t.id}</span>
<strong class="good">${temp(t.temperature_f)}</strong> <strong class="${alertActive ? '' : 'good'}">${temp(t.temperature_f)}</strong>
</div>`).join(""); </div>`;
}).join("");
$("relays").innerHTML=(data.relays||[]).map(r=>` $("relays").innerHTML=(data.relays||[]).map(r=>`
<div class="item"> <div class="item">
@@ -1177,40 +1188,7 @@ function tempDisplayGroup(t){
return String(t.name || "").trim().toLowerCase(); return String(t.name || "").trim().toLowerCase();
} }
function applyTempAlertStyles(data){ function applyTempAlertStyles(data) { return; }
const temps = data && Array.isArray(data.temps) ? data.temps : [];
const active = temps.filter(tempHighAlertActive);
document.querySelectorAll(".temp-alert").forEach(el => el.classList.remove("temp-alert"));
if (!active.length) return;
const alertKeys = new Set();
active.forEach(t => {
const name = String(t.name || "").trim().toLowerCase();
const group = tempDisplayGroup(t);
if (name) alertKeys.add(name);
if (group) alertKeys.add(group);
if (group === "fridge") alertKeys.add("fridge");
if (group === "cabin") alertKeys.add("cabin");
if (group === "outside") alertKeys.add("outside");
});
const candidates = document.querySelectorAll(
".tempConfigCard, [id^='tempName'], [id^='tempAddress'], .temps, #temps, #tempConfigList > *"
);
candidates.forEach(el => {
const card = el.closest(".tempConfigCard") || el;
const text = (card.textContent || "").toLowerCase();
for (const key of alertKeys) {
if (key && text.includes(key)) {
card.classList.add("temp-alert");
return;
}
}
});
}
function renderConfigControls(data){ function renderConfigControls(data){
const cfg=data.config||{}; const cfg=data.config||{};