homebridge-unifi-protect 6.7.0 → 6.9.0

package/homebridge-ui/public/index.html

@@ -178,6 +178,10 @@
       // Retrieve the current plugin configuration.
       let currentConfig = await homebridge.getPluginConfig();
 
+      // Keep a list of all the feature options and option groups.
+      let featureOptionList = {};
+      let featureOptionGroups = {};
+
       // Show an navigation bar at the top of the plugin configuration UI.
       const showIntro = () => {
 
@@ -243,7 +247,7 @@
         }
 
         // Initialize our informational header.
-        document.getElementById("headerInfo").innerHTML = "Feature options are applied in prioritized order, from global to device-specific options:<br><i>Global options</i> (lowest priority) &rarr; <i>Protect controller options</i> &rarr; <i>Protect device options</i> (highest priority)"
+        document.getElementById("headerInfo").innerHTML = "Feature options are applied in prioritized order, from global to device-specific options:<br><i class=\"text-warning\">Global options</i> (lowest priority) &rarr; <i class=\"text-success\">Protect controller options</i> &rarr; <i class=\"text-info\">Protect device options</i> (highest priority)"
 
         // Enumerate our global options.
         const trGlobal = document.createElement("tr");
@@ -321,7 +325,6 @@
           controllersTable.appendChild(trDevice);
 
           controllerList.push(label);
-
         }
 
         // All done. Let the user interact with us.
@@ -371,6 +374,9 @@
         const modelKeys = [...new Set(ufpDevices.map(x => x.modelKey))];
         const deviceList = [];
 
+        // The first entry returned by getDevices is always the controller.
+        const nvr = ufpDevices[0];
+
         // Start with a clean slate.
         devicesTable.innerHTML = "";
 
@@ -382,7 +388,7 @@
           // If it's a controller, we handle that case differently.
           if((key === "nvr") && devices.length) {
 
-            // Change the name of the controler that we show users once we've connected with the controller.
+            // Change the name of the controller that we show users once we've connected with the controller.
             controllerList.map(x => (x.name === controller.address) ? x.childNodes[0].nodeValue = devices[0].name : true);
             continue;
           }
@@ -417,7 +423,7 @@
             const label = document.createElement("label");
 
             label.name = device.id;
-            label.appendChild(document.createTextNode(device.name));
+            label.appendChild(document.createTextNode(device.name ?? device.marketName));
             label.style.cursor = "pointer";
             label.classList.add("mx-2", "my-0", "p-0", "w-100");
 
@@ -451,31 +457,182 @@
         };
 
         // Initialize our feature option configuration.
-        updateConfigOptions(currentConfig[0].options ?? [])
+        updateConfigOptions(currentConfig[0].options ?? []);
+
+        // Is this feature option set explicitly?
+        const isOptionSet = (featureOption, deviceMac) => {
+
+          const optionRegex = new RegExp("^(?:Enable|Disable)\\." + featureOption + (!deviceMac ? "" : "\\." + deviceMac) + "$", "gi");
+          return optionsList.filter(x => optionRegex.test(x)).length ? true : false;
+        };
 
         // Is a feature option globally enabled?
-        const isGlobalOptionEnabled = (featureOption, defaultValue) => {
+        const isGlobalOptionEnabled = (featureOption, defaultState) => {
 
           featureOption = featureOption.toUpperCase();
 
           // Test device-specific options.
           return optionsList.some(x => x === ("ENABLE." + featureOption)) ? true :
-            (optionsList.some(x => x === ("DISABLE." + featureOption)) ? false : defaultValue
+            (optionsList.some(x => x === ("DISABLE." + featureOption)) ? false : defaultState
             );
         };
 
-        // Is a feature option enabled at the device or controller level.
-        const isDeviceOptionEnabled = (featureOption, mac, defaultValue) => {
+        // Is a feature option enabled at the device or global level. This function does not traverse the scoping hierarchy.
+        const isDeviceOptionEnabled = (featureOption, mac, defaultState) => {
+
+          if(!mac) {
+
+            return isGlobalOptionEnabled(featureOption, defaultState);
+          }
 
           featureOption = featureOption.toUpperCase();
           mac = mac.toUpperCase();
 
           // Test device-specific options.
           return optionsList.some(x => x === ("ENABLE." + featureOption + "." + mac)) ? true :
-            (optionsList.some(x => x === ("DISABLE." + featureOption + "." + mac)) ? false : defaultValue
+            (optionsList.some(x => x === ("DISABLE." + featureOption + "." + mac)) ? false : defaultState
             );
         };
 
+        // Is a value-centric feature option enabled at the device or global level. This function does not traverse the scoping hierarchy.
+        const isOptionValueSet = (featureOption, deviceMac) => {
+
+          const optionRegex = new RegExp("^Enable\\." + featureOption + (!deviceMac ? "" : "\\." + deviceMac) + "\\.([^\\.]+)$", "gi");
+
+          return optionsList.filter(x => optionRegex.test(x)).length ? true : false;
+        };
+
+        // Get the value of a value-centric feature option.
+        const getOptionValue = (featureOption, deviceMac) => {
+
+          const optionRegex = new RegExp("^Enable\\." + featureOption + (!deviceMac ? "" : "\\." + deviceMac) + "\\.([^\\.]+)$", "gi");
+
+          // Get the option value, if we have one.
+          for(const option of optionsList) {
+
+            const regexMatch = optionRegex.exec(option);
+
+            if(regexMatch) {
+
+              return regexMatch[1];
+            }
+          }
+
+          return undefined;
+        };
+
+        // Is a feature option enabled at the device or global level. It does traverse the scoping hierarchy.
+        const isOptionEnabled = (featureOption, deviceMac) => {
+
+          const defaultState = featureOptionList[featureOption]?.default ?? true;
+
+          if(deviceMac) {
+
+            // Device level check.
+            if(isDeviceOptionEnabled(featureOption, deviceMac, defaultState) !== defaultState) {
+
+              return !defaultState;
+            }
+
+            // Controller level check.
+            if(isDeviceOptionEnabled(featureOption, nvr.mac, defaultState) !== defaultState) {
+
+              return !defaultState;
+            }
+          }
+
+          // Global check.
+          if(isGlobalOptionEnabled(featureOption, defaultState) !== defaultState) {
+
+            return !defaultState;
+          }
+
+          // Return the default.
+          return defaultState;
+        };
+
+        // Return the scope level of a feature option.
+        const optionScope = (featureOption, deviceMac, defaultState, isOptionValue = false) => {
+
+          // Scope priority is always: device, NVR, global.
+
+          // If we have a value-centric feature option, our lookups are a bit different.
+          if(isOptionValue) {
+
+            if(deviceMac) {
+
+              if(isOptionValueSet(featureOption, deviceMac)) {
+
+                return "device";
+              }
+
+              if(isOptionValueSet(featureOption, nvr.mac)) {
+
+                return "nvr";
+              }
+            }
+
+            if(isOptionValueSet(featureOption)) {
+
+              return "global";
+            }
+
+            return "none";
+          }
+
+          if(deviceMac) {
+
+            // Let's see if we've set it at the device-level.
+            if((isDeviceOptionEnabled(featureOption, deviceMac, defaultState) !== defaultState) || isOptionSet(featureOption, deviceMac)) {
+
+              return "device";
+            }
+
+            // Now let's test the controller level.
+            if((isDeviceOptionEnabled(featureOption, nvr.mac, defaultState) !== defaultState) || isOptionSet(featureOption, nvr.mac)) {
+
+              return "nvr";
+            }
+          }
+
+          // Finally, let's test the global level.
+          if((isGlobalOptionEnabled(featureOption, defaultState) !== defaultState) || isOptionSet(featureOption)) {
+
+            return "global";
+          }
+
+          // Option isn't set to a non-default value.
+          return "none";
+        };
+
+        // Return the color hinting for a given option's scope.
+        const optionScopeColor = (featureOption, deviceMac, defaultState, isOptionValue) => {
+
+          switch(optionScope(featureOption, deviceMac, defaultState, isOptionValue)) {
+
+            case "device":
+
+              return "text-info";
+              break;
+
+            case "nvr":
+
+              return "text-success";
+              break;
+
+            case "global":
+
+              return deviceMac ? "text-warning" : "text-info";
+              break;
+
+            default:
+
+              break;
+          }
+
+          return null;
+        };
+
         // Show feature option information for a specific device, controller, or globally.
         const showDeviceInfo = async (deviceId) => {
 
@@ -522,6 +679,36 @@
           let newConfigTableHtml = "";
           configTable.innerHTML = "";
 
+          // Initialize the full list of options.
+          featureOptionList = {};
+          featureOptionGroups = {};
+
+          for(const category of ufpFeatures.categories) {
+
+            // Now enumerate all the feature options for a given device and add then to the full list.
+            for(const option of optionsDevice[category.name]) {
+
+              const featureOption = category.name + (option.name.length ? ("." + option.name): "");
+
+              // Add it to our full list.
+              featureOptionList[featureOption] = option;
+
+              // Cross reference the feature option group it belongs to, if any.
+              if(option.group !== undefined) {
+
+                const expandedGroup = category.name + (option.group.length ? ("." + option.group): "");
+
+                // Initialize the group entry if needed.
+                if(!featureOptionGroups[expandedGroup]) {
+
+                  featureOptionGroups[expandedGroup] = [];
+                }
+
+                featureOptionGroups[expandedGroup].push(featureOption);
+              }
+            }
+          }
+
           for(const category of ufpFeatures.categories) {
 
             // Only show feature option categories that are valid for this context.
@@ -540,7 +727,7 @@
             optionTable.classList.add("table", "table-borderless", "table-sm", "table-hover");
             th.classList.add("p-0");
             th.style.fontWeight = "bold";
-            th.colSpan = 2;
+            th.colSpan = 3;
             tbody.classList.add("table-bordered");
 
             // Add the feature option category description.
@@ -556,6 +743,7 @@
             // Finally, add the table head to the table.
             optionTable.appendChild(thead);
 
+            // Now enumerate all the feature options for a given device.
             for(const option of optionsDevice[category.name]) {
 
               // Only show feature options that are valid for this device.
@@ -565,9 +753,13 @@
                 continue;
               }
 
+              // Expand the full feature option.
+              const featureOption = category.name + (option.name.length ? ("." + option.name): "");
+
               // Create the next table row.
               const trX = document.createElement("tr");
               trX.classList.add("align-top");
+              trX.id = "row-" + featureOption;
 
               // Create a checkbox for the option.
               const tdCheckbox = document.createElement("td");
@@ -575,40 +767,68 @@
               // Create the actual checkbox for the option.
               const checkbox = document.createElement("input");
 
-              const featureOption = category.name + (option.name.length ? ("." + option.name): "");
               checkbox.type = "checkbox";
+              checkbox.readOnly = false;
               checkbox.id = featureOption;
               checkbox.name = featureOption;
               checkbox.value = featureOption + (!ufpDevice ? "" : ("." + ufpDevice.mac));
-              checkbox.checked = !ufpDevice ? isGlobalOptionEnabled(featureOption, option.default) :
-                isDeviceOptionEnabled(featureOption, ufpDevice.mac, option.default);
 
-              checkbox.defaultChecked = option.default;
-              checkbox.classList.add("mx-2");
+              let initialValue = undefined;
+              let initialScope;
 
-              // Add or remove the setting from our configuration when we've changed our state.
-              checkbox.addEventListener("change", async () => {
+              // Determine our initial option scope to show the user what's been set.
+              switch(initialScope = optionScope(featureOption, ufpDevice?.mac, option.default, ("defaultValue" in option))) {
 
-                // Find the option in our list and delete it if it exists.
-                const optionRegex = new RegExp("^(Enable|Disable)\." + checkbox.id + (!ufpDevice ? "" : ("\." + ufpDevice.mac)) + "$", "gi")
-                const newOptions = configOptions.filter(x => !x.match(optionRegex));
+                case "global":
+                case "nvr":
 
-                // The setting is different from the default, highlight it for the user, and add it to our configuration.
-                if(checkbox.checked !== option.default) {
+                  // If we're looking at the global scope, show the option value. Otherwise, we show that we're inheriting a value from the scope above.
+                  if(!ufpDevice) {
 
-                  labelDescription.classList.add("text-info");
-                  newOptions.push((checkbox.checked ? "Enable." : "Disable.") + checkbox.value);
-                } else {
+                    if("defaultValue" in option) {
 
-                  // We've reset to the defaults, remove our highlighting.
-                  labelDescription.classList.remove("text-info");
-                }
+                      checkbox.checked = isOptionValueSet(featureOption);
+                      initialValue = getOptionValue(checkbox.id);
+                    } else {
 
-                // Update our configuration in Homebridge.
-                currentConfig[0].options = newOptions;
-                updateConfigOptions(newOptions);
-                await homebridge.updatePluginConfig(currentConfig);
-              });
+                      checkbox.checked = isGlobalOptionEnabled(featureOption, option.default);
+                    }
+
+                    if(checkbox.checked) {
+
+                      checkbox.indeterminate = false;
+                    }
+
+                  } else {
+
+                    if("defaultValue" in option) {
+
+                      initialValue = getOptionValue(checkbox.id, (initialScope === "nvr") ? nvr.mac : undefined);
+                    }
+
+                    checkbox.readOnly = checkbox.indeterminate = true;
+                  }
+
+                  break;
+
+                case "device":
+                case "none":
+                default:
+
+                  if("defaultValue" in option) {
+
+                    checkbox.checked = isOptionValueSet(featureOption, ufpDevice?.mac);
+                    initialValue = getOptionValue(checkbox.id, ufpDevice?.mac);
+                  } else {
+
+                    checkbox.checked = isDeviceOptionEnabled(featureOption, ufpDevice?.mac, option.default);
+                  }
+
+                  break;
+              }
+
+              checkbox.defaultChecked = option.default;
+              checkbox.classList.add("mx-2");
 
               // Add the checkbox to the table cell.
               tdCheckbox.appendChild(checkbox);
@@ -618,6 +838,50 @@
 
               const tdLabel = document.createElement("td");
               tdLabel.classList.add("w-100");
+              tdLabel.colSpan = 2;
+
+              let inputValue = null;
+
+              // Add an input field if we have a value-centric feature option.
+              if(("defaultValue" in option)) {
+
+                const tdInput = document.createElement("td");
+
+                inputValue = document.createElement("input");
+                inputValue.type = "text";
+                inputValue.value = initialValue ?? option.defaultValue;
+                inputValue.size = 5;
+                inputValue.readOnly = !checkbox.checked;
+                inputValue.classList.add("mr-2");
+
+                // Add or remove the setting from our configuration when we've changed our state.
+                inputValue.addEventListener("change", async () => {
+
+                  // Find the option in our list and delete it if it exists.
+                  const optionRegex = new RegExp("^(?:Enable|Disable)\\." + checkbox.id + (!ufpDevice ? "" : ("\\." + ufpDevice.mac)) + "\\.[^\\.]+$", "gi");
+                  const newOptions = configOptions.filter(x => !optionRegex.test(x));
+
+                  if(checkbox.checked) {
+
+                    newOptions.push("Enable." + checkbox.value + "." + inputValue.value);
+                  } else if(checkbox.indeterminate) {
+
+                    // If we're in an indeterminate state, we need to traverse the tree to get the upstream value we're inheriting.
+                    inputValue.value = (ufpDevice?.mac !== nvr.mac) ? (getOptionValue(checkbox.id, nvr.mac) ?? getOptionValue(checkbox.id)) : (getOptionValue(checkbox.id) ?? option.defaultValue);
+                  } else {
+
+                    inputValue.value = option.defaultValue;
+                  }
+
+                  // Update our configuration in Homebridge.
+                  currentConfig[0].options = newOptions;
+                  updateConfigOptions(newOptions);
+                  await homebridge.updatePluginConfig(currentConfig);
+                });
+
+                tdInput.appendChild(inputValue);
+                trX.appendChild(tdInput);
+              }
 
               // Create a label for the checkbox with our option description.
               const labelDescription = document.createElement("label");
@@ -626,11 +890,131 @@
               labelDescription.classList.add("user-select-none", "my-0", "py-0");
 
               // Highlight options for the user that are different than our defaults.
-              if(checkbox.checked !== checkbox.defaultChecked) {
+              const scopeColor = optionScopeColor(featureOption, ufpDevice?.mac, option.default, ("defaultValue" in option));
 
-                labelDescription.classList.add("text-info");
+              if(scopeColor) {
+
+                labelDescription.classList.add(scopeColor);
               }
 
+              // Add or remove the setting from our configuration when we've changed our state.
+              checkbox.addEventListener("change", async () => {
+
+                // Find the option in our list and delete it if it exists.
+                const optionRegex = new RegExp("^(?:Enable|Disable)\\." + checkbox.id + (!ufpDevice ? "" : ("\\." + ufpDevice.mac)) + "$", "gi");
+                const newOptions = configOptions.filter(x => !optionRegex.test(x));
+
+                // Figure out if we've got the option set upstream.
+                let upstreamOption = false;
+
+                // We explicitly want to check for the scope of the feature option above where we are now, so we can appropriately determine what we should show.
+                switch(optionScope(checkbox.id, (ufpDevice && (ufpDevice.mac !== nvr.mac)) ? nvr.mac : null, option.default, ("defaultValue" in option))) {
+
+                  case "device":
+                  case "nvr":
+
+                    if(ufpDevice.mac !== nvr.mac) {
+
+                      upstreamOption = true;
+                    }
+
+                    break;
+
+                  case "global":
+
+                    if(ufpDevice) {
+
+                      upstreamOption = true;
+                    }
+
+                    break;
+
+                  default:
+
+                    break;
+                }
+
+                // For value-centric feature options, if there's an upstream value assigned above us, we don't allow for an unchecked state as it makes no sense in that context.
+                if(checkbox.readOnly && (!("defaultValue" in option) || (("defaultValue" in option) && inputValue && !upstreamOption))) {
+
+                  // We're truly unchecked. We need this because a checkbox can be in both an unchecked and indeterminate simultaneously,
+                  // so we use the readOnly property to let us know that we've just cycled from an indeterminate state.
+                  checkbox.checked = checkbox.readOnly = false;
+                } else if(!checkbox.checked) {
+
+                  // If we have an upstream option configured, we reveal a third state to show inheritance of that option and allow the user to select it.
+                  if(upstreamOption) {
+
+                    // We want to set the readOnly property as well, since it will survive a user interaction when they click the checkbox to clear out the
+                    // indeterminate state. This allows us to effectively cycle between three states.
+                    checkbox.readOnly = checkbox.indeterminate = true;
+                  }
+
+                  if(("defaultValue" in option) && inputValue) {
+
+                    inputValue.readOnly = true;
+                  }
+                } else if(checkbox.checked) {
+
+                  // We've explicitly checked this option.
+                  checkbox.readOnly = checkbox.indeterminate = false;
+
+                  if(("defaultValue" in option) && inputValue) {
+
+                    inputValue.readOnly = false;
+                  }
+                }
+
+                // The setting is different from the default, highlight it for the user, accounting for upstream scope, and add it to our configuration.
+                if(!checkbox.indeterminate && ((checkbox.checked !== option.default) || upstreamOption)) {
+
+                  labelDescription.classList.add("text-info");
+                  newOptions.push((checkbox.checked ? "Enable." : "Disable.") + checkbox.value);
+                } else {
+
+                  // We've reset to the defaults, remove our highlighting.
+                  labelDescription.classList.remove("text-info");
+                }
+
+                // Update our Homebridge configuration.
+                if(("defaultValue" in option) && inputValue) {
+
+                  // Inform our value-centric feature option to update Homebridge.
+                  const changeEvent = new Event("change");
+
+                  inputValue.dispatchEvent(changeEvent);
+                } else {
+
+                  // Update our configuration in Homebridge.
+                  currentConfig[0].options = newOptions;
+                  updateConfigOptions(newOptions);
+                  await homebridge.updatePluginConfig(currentConfig);
+                }
+
+                // If we've reset to defaults, make sure our color coding for scope is reflected.
+                if((checkbox.checked === option.default) || checkbox.indeterminate) {
+
+                  const scopeColor = optionScopeColor(featureOption, ufpDevice?.mac, option.default, ("defaultValue" in option));
+
+                  if(scopeColor) {
+
+                    labelDescription.classList.add(scopeColor);
+                  }
+                }
+
+                // Adjust visibility of other feature options that depend on us.
+                if(featureOptionGroups[checkbox.id]) {
+
+                  const entryVisibility = isOptionEnabled(featureOption, ufpDevice?.mac) ? "" : "none";
+
+                  // Lookup each feature option setting and set the visibility accordingly.
+                  for(const entry of featureOptionGroups[checkbox.id]) {
+
+                    document.getElementById("row-" + entry).style.display = entryVisibility;
+                  }
+                }
+              });
+
               // Add the actual description for the option after the checkbox.
               labelDescription.appendChild(document.createTextNode(option.description));
 
@@ -643,6 +1027,12 @@
               // Add the label table cell to the table row.
               trX.appendChild(tdLabel);
 
+              // Adjust the visibility of the feature option, if it's logically grouped.
+              if((option.group !== undefined) && !isOptionEnabled(category.name + (option.group.length ? ("." + option.group): ""), ufpDevice?.mac)) {
+
+                trX.style.display = "none";
+              }
+
               // Add the table row to the table body.
               tbody.appendChild(trX);
             }

package/homebridge-ui/server.js

@@ -11,7 +11,7 @@
 /* eslint-disable new-cap */
 "use strict";
 
-import { featureOptionCategories, featureOptions, optionEnabled } from "../dist/protect-options.js";
+import { featureOptionCategories, featureOptions, isOptionEnabled } from "../dist/protect-options.js";
 import { HomebridgePluginUiServer } from "@homebridge/plugin-ui-utils";
 import { ProtectApi } from "unifi-protect";
 import * as fs from "node:fs";
@@ -50,40 +50,40 @@ class PluginUiServer extends HomebridgePluginUiServer {
 
         bootstrap.cameras.sort((a, b) => {
 
-          const aCase = a.name.toLowerCase();
-          const bCase = b.name.toLowerCase();
+          const aCase = (a.name ?? a.marketName).toLowerCase();
+          const bCase = (b.name ?? b.marketName).toLowerCase();
 
           return aCase > bCase ? 1 : (bCase > aCase ? -1 : 0);
         });
 
         bootstrap.chimes.sort((a, b) => {
 
-          const aCase = a.name.toLowerCase();
-          const bCase = b.name.toLowerCase();
+          const aCase = (a.name ?? a.marketName).toLowerCase();
+          const bCase = (b.name ?? b.marketName).toLowerCase();
 
           return aCase > bCase ? 1 : (bCase > aCase ? -1 : 0);
         });
 
         bootstrap.lights.sort((a, b) => {
 
-          const aCase = a.name.toLowerCase();
-          const bCase = b.name.toLowerCase();
+          const aCase = (a.name ?? a.marketName).toLowerCase();
+          const bCase = (b.name ?? b.marketName).toLowerCase();
 
           return aCase > bCase ? 1 : (bCase > aCase ? -1 : 0);
         });
 
         bootstrap.sensors.sort((a, b) => {
 
-          const aCase = a.name.toLowerCase();
-          const bCase = b.name.toLowerCase();
+          const aCase = (a.name ?? a.marketName).toLowerCase();
+          const bCase = (b.name ?? b.marketName).toLowerCase();
 
           return aCase > bCase ? 1 : (bCase > aCase ? -1 : 0);
         });
 
         bootstrap.viewers.sort((a, b) => {
 
-          const aCase = a.name.toLowerCase();
-          const bCase = b.name.toLowerCase();
+          const aCase = (a.name ?? a.marketName).toLowerCase();
+          const bCase = (b.name ?? b.marketName).toLowerCase();
 
           return aCase > bCase ? 1 : (bCase > aCase ? -1 : 0);
         });
@@ -113,7 +113,7 @@ class PluginUiServer extends HomebridgePluginUiServer {
 
           for(const options of featureOptions[category.name]) {
 
-            options.value = optionEnabled(request.configOptions, request.nvrUfp, request.deviceUfp, category.name + "." + options.name, options.default);
+            options.value = isOptionEnabled(request.configOptions, request.nvrUfp, request.deviceUfp, category.name + "." + options.name, options.default);
             optionSet[category.name].push(options);
           }
         }