webui: more typings, clean-up sensor units init

code/html/src/rfbridge.mjs

@@ -11,33 +11,51 @@ import {
     loadConfigTemplate,
 } from './template.mjs';
 
+/** @param {Event} event */
 function onButtonPress(event) {
+    if (!(event.target instanceof HTMLElement)) {
+        return;
+    }
+
     const prefix = "button-rfb-";
     const [buttonRfbClass] = Array.from(event.target.classList)
         .filter(x => x.startsWith(prefix));
 
-    if (buttonRfbClass) {
-        const container = event.target.parentElement.parentElement;
-        const input = container.querySelector("input");
-
-        sendAction(`rfb${buttonRfbClass.replace(prefix, "")}`, {
-            id: parseInt(input.dataset["id"], 10),
-            status: input.name === "rfbON"
-        });
+    if (!buttonRfbClass) {
+        return;
     }
+
+    const container = event.target?.parentElement?.parentElement;
+    if (!container) {
+        return;
+    }
+
+    const input = container.querySelector("input");
+    if (!input || !input.dataset["id"]) {
+        return;
+    }
+
+    sendAction(`rfb${buttonRfbClass.replace(prefix, "")}`, {
+        id: parseInt(input.dataset["id"], 10),
+        status: input.name === "rfbON"
+    });
 }
 
 function addNode() {
-    let container = document.getElementById("rfbNodes");
+    const container = document.getElementById("rfbNodes");
+    if (!container) {
+        return;
+    }
 
-    const id = container.childElementCount;
+    const id = container.childElementCount.toString();
     const line = loadConfigTemplate("rfb-node");
-    line.querySelector("span").textContent = id;
-
-    for (let input of line.querySelectorAll("input")) {
+    line.querySelectorAll("span").forEach((span) => {
+        span.textContent = id;
+    });
+    line.querySelectorAll("input").forEach((input) => {
         input.dataset["id"] = id;
         input.setAttribute("id", `${input.name}${id}`);
-    }
+    });
 
     for (let action of ["learn", "forget"]) {
         for (let button of line.querySelectorAll(`.button-rfb-${action}`)) {
@@ -48,21 +66,31 @@ function addNode() {
     mergeTemplate(container, line);
 }
 
-function handleCodes(value) {
-    value.codes.forEach((codes, id) => {
-        const realId = id + value.start;
-        const [off, on] = codes;
+/**
+ * @typedef {[string, string]} CodePair
+ * @param {CodePair[]} pairs
+ * @param {!number} start
+ */
+function handleCodePairs(pairs, start) {
+    pairs.forEach((pair, id) => {
+        const realId = id + (start ?? 0);
+        const [off, on] = pair;
 
-        const rfbOn = document.getElementById(`rfbON${realId}`);
-        setInputValue(rfbOn, on);
-
-        const rfbOff = document.getElementById(`rfbOFF${realId}`);
+        const rfbOff = /** @type {!HTMLInputElement} */
+            (document.getElementById(`rfbOFF${realId}`));
         setInputValue(rfbOff, off);
 
+        const rfbOn = /** @type {!HTMLInputElement} */
+            (document.getElementById(`rfbON${realId}`));
+        setInputValue(rfbOn, on);
+
         setOriginalsFromValues([rfbOn, rfbOff]);
     });
 }
 
+/**
+ * @returns {import('./settings.mjs').KeyValueListeners}
+ */
 function listeners() {
     return {
         "rfbCount": (_, value) => {
@@ -71,7 +99,7 @@ function listeners() {
             }
         },
         "rfb": (_, value) => {
-            handleCodes(value);
+            handleCodePairs(value.codes, value.start);
         },
     };
 }