homebridge-melcloud-control 3.9.0-beta.17 → 3.9.0-beta.19

package/homebridge-ui/public/index.html

@@ -37,11 +37,12 @@
 
         <div class="mb-3 position-relative">
           <label for="passwd" class="form-label">Password</label>
-          <input id="passwd" type="password" class="form-control" autocomplete="off" required>
-          <span id="togglePassword"
-            style="position:absolute; top:50%; right:10px; cursor:pointer; transform:translateY(-50%)">
-            <i class="fas fa-eye"></i>
-          </span>
+          <div class="input-group">
+            <input id="passwd" type="password" class="form-control" autocomplete="off" required>
+            <button type="button" id="togglePasswd" class="btn btn-outline-secondary">
+              <i class="fas fa-eye"></i>
+            </button>
+          </div>
         </div>
 
         <div class="mb-3">
@@ -94,60 +95,56 @@
         homebridge.showSchemaForm();
         return;
       }
-      this.configButtonState = false;
 
-      const accountsCount = pluginConfig[0].accounts.length;
       this.deviceIndex = 0;
+
+      const accountsCount = pluginConfig[0].accounts.length;
       for (let i = 0; i < accountsCount; i++) {
         const button = document.createElement("button");
-        button.setAttribute("type", "button");
-        button.setAttribute("id", `button${i}`);
-        button.setAttribute("class", "btn btn-primary");
+        button.type = "button";
+        button.id = `button${i}`;
+        button.className = "btn btn-primary";
         button.style.textTransform = 'none';
         button.innerText = pluginConfig[0].accounts[i].name;
         document.getElementById("accountButton").appendChild(button);
 
-        document.getElementById(`button${i}`).addEventListener('click', async () => {
+        button.addEventListener('click', async () => {
           for (let j = 0; j < accountsCount; j++) {
-            j === i
-              ? document.getElementById(`button${j}`).setAttribute("class", "btn btn-secondary")
-              : document.getElementById(`button${j}`).setAttribute("class", "btn btn-primary");
+            document.getElementById(`button${j}`).className = (j === i ? 'btn btn-secondary' : 'btn btn-primary');
           }
 
-          document.getElementById('accountName').innerHTML = pluginConfig[0].accounts[i].name || '';
-          document.getElementById('name').value = pluginConfig[0].accounts[i].name || '';
-          document.getElementById('user').value = pluginConfig[0].accounts[i].user || '';
-          document.getElementById('passwd').value = pluginConfig[0].accounts[i].passwd || '';
-          document.getElementById('language').value = pluginConfig[0].accounts[i].language || '';
+          const acc = pluginConfig[0].accounts[i];
+          document.getElementById('accountName').innerText = acc.name || '';
+          document.getElementById('name').value = acc.name || '';
+          document.getElementById('user').value = acc.user || '';
+          document.getElementById('passwd').value = acc.passwd || '';
+          document.getElementById('language').value = acc.language || '';
 
-          const accountConfigured = pluginConfig[0].accounts[i].name && pluginConfig[0].accounts[i].user && pluginConfig[0].accounts[i].passwd && pluginConfig[0].accounts[i].language;
-          document.getElementById('logIn').disabled = !accountConfigured;
+          document.getElementById('logIn').disabled = !(acc.name && acc.user && acc.passwd && acc.language);
 
-          await homebridge.updatePluginConfig(pluginConfig);
           this.deviceIndex = i;
-        });
-        if (i === accountsCount - 1) {
-          document.getElementById(`button0`).click();
           await homebridge.updatePluginConfig(pluginConfig);
-        }
+        });
+
+        if (i === accountsCount - 1) document.getElementById(`button0`).click();
       }
 
       document.getElementById('melCloudAccount').style.display = 'block';
 
       document.getElementById('configForm').addEventListener('input', async () => {
-        pluginConfig[0].accounts[this.deviceIndex].name = document.querySelector('#name').value;
-        pluginConfig[0].accounts[this.deviceIndex].user = document.querySelector('#user').value;
-        pluginConfig[0].accounts[this.deviceIndex].passwd = document.querySelector('#passwd').value;
-        pluginConfig[0].accounts[this.deviceIndex].language = document.querySelector('#language').value;
+        const acc = pluginConfig[0].accounts[this.deviceIndex];
+        acc.name = document.querySelector('#name').value;
+        acc.user = document.querySelector('#user').value;
+        acc.passwd = document.querySelector('#passwd').value;
+        acc.language = document.querySelector('#language').value;
 
-        const accountConfigured = pluginConfig[0].accounts[this.deviceIndex].name && pluginConfig[0].accounts[this.deviceIndex].user && pluginConfig[0].accounts[this.deviceIndex].passwd && pluginConfig[0].accounts[this.deviceIndex].language;
-        document.getElementById('logIn').disabled = !accountConfigured;
+        document.getElementById('logIn').disabled = !(acc.name && acc.user && acc.passwd && acc.language);
 
         await homebridge.updatePluginConfig(pluginConfig);
         await homebridge.savePluginConfig(pluginConfig);
       });
 
-      // Config button toggle cleanup
+      // --- Config Button Toggle ---
       const configButton = document.getElementById('configButton');
       let configButtonState = false;
       configButton.addEventListener('click', () => {
@@ -156,28 +153,30 @@
         configButton.className = configButtonState ? 'btn btn-primary' : 'btn btn-secondary';
       });
 
-      // Password show/hide toggle
+      // --- Improved Show/Hide Password ---
       const passwdInput = document.getElementById('passwd');
       const togglePassword = document.getElementById('togglePassword');
 
       togglePassword.addEventListener('click', () => {
-        if (passwdInput.type === 'password') {
-          passwdInput.type = 'text';
-          togglePassword.innerHTML = '<i class="fas fa-eye-slash"></i>';
-        } else {
-          passwdInput.type = 'password';
-          togglePassword.innerHTML = '<i class="fas fa-eye"></i>';
-        }
+        const hidden = passwdInput.type === 'password';
+        passwdInput.type = hidden ? 'text' : 'password';
+        togglePassword.innerHTML = `<i class="fas fa-${hidden ? 'eye-slash' : 'eye'}"></i>`;
+        togglePassword.dataset.clicked = hidden; // remember permanent toggle
+      });
+
+      togglePassword.addEventListener('mouseenter', () => {
+        passwdInput.type = 'text';
+        togglePassword.innerHTML = `<i class="fas fa-eye-slash"></i>`;
       });
 
-      // Optional: toggle password with Tab key (pressing Tab will show/hide)
-      passwdInput.addEventListener('keydown', (e) => {
-        if (e.key === 'Tab') {
-          e.preventDefault(); // prevent default tab behavior
-          togglePassword.click();
+      togglePassword.addEventListener('mouseleave', () => {
+        if (!togglePassword.dataset.clicked || togglePassword.dataset.clicked === 'false') {
+          passwdInput.type = 'password';
+          togglePassword.innerHTML = `<i class="fas fa-eye"></i>`;
         }
       });
 
+      // --- Device Handling & Login Logic ---
       function removeStaleDevices(configDevices, melcloudDevices) {
         const melcloudIds = melcloudDevices.map(d => d.DeviceID);
         const removedDevices = [];
@@ -194,181 +193,92 @@
       function updateInfo(id, text, color) {
         const el = document.getElementById(id);
         if (el) {
-          el.innerHTML = text;
+          el.innerText = text;
           el.style.color = color;
         }
       }
 
       document.getElementById('logIn').addEventListener('click', async () => {
         homebridge.showSpinner();
-        document.getElementById(`logIn`).setAttribute("class", "btn btn-primary");
+        document.getElementById(`logIn`).className = "btn btn-primary";
         updateInfo('info', 'Connecting...', 'yellow');
 
         try {
-          const account = pluginConfig[0].accounts[this.deviceIndex];
-          const { name: accountName, user, passwd, language } = account;
-          const payload = { accountName, user, passwd, language };
+          const acc = pluginConfig[0].accounts[this.deviceIndex];
+          const payload = { accountName: acc.name, user: acc.user, passwd: acc.passwd, language: acc.language };
           const devicesInMelCloud = await homebridge.request('/connect', payload);
 
+          // Initialize devices arrays
           const newDevices = { ata: [], ataPresets: [], atw: [], atwPresets: [], erv: [], ervPresets: [] };
-          const devicesByTypeInMelCloud = { ata: [], atw: [], erv: [] };
-
-          for (const deviceInMelcloud of devicesInMelCloud) {
-            switch (deviceInMelcloud.Type) {
-              case 0: devicesByTypeInMelCloud.ata.push(deviceInMelcloud); break;
-              case 1: devicesByTypeInMelCloud.atw.push(deviceInMelcloud); break;
-              case 3: devicesByTypeInMelCloud.erv.push(deviceInMelcloud); break;
-            }
-          }
+          const devicesByType = { ata: [], atw: [], erv: [] };
 
-          const ataDevicesInConfig = account.ataDevices ?? (account.ataDevices = []);
-          const atwDevicesInConfig = account.atwDevices ?? (account.atwDevices = []);
-          const ervDevicesInConfig = account.ervDevices ?? (account.ervDevices = []);
-
-          const removedAta = removeStaleDevices(ataDevicesInConfig, devicesByTypeInMelCloud.ata);
-          const removedAtw = removeStaleDevices(atwDevicesInConfig, devicesByTypeInMelCloud.atw);
-          const removedErv = removeStaleDevices(ervDevicesInConfig, devicesByTypeInMelCloud.erv);
-
-          // === Handle ATA devices ===
-          devicesByTypeInMelCloud.ata.forEach(device => {
-            const { DeviceID: deviceId, Type: deviceType, DeviceName: deviceName, Presets: devicePresets = [] } = device;
-            const deviceAta = {
-              id: deviceId,
-              type: deviceType,
-              typeString: "Air Conditioner",
-              name: deviceName,
-              displayMode: 1,
-              heatDryFanMode: 1,
-              coolDryFanMode: 1,
-              autoDryFanMode: 1,
-              temperatureSensor: false,
-              temperatureSensorOutdoor: false,
-              presets: [],
-              buttonsSensors: []
-            };
-            if (!ataDevicesInConfig.some(d => d.id === deviceId)) {
-              ataDevicesInConfig.push(deviceAta);
-              newDevices.ata.push(deviceAta);
-            }
-            devicePresets.forEach(preset => {
-              const { ID: presetId, NumberDescription: presetName } = preset;
-              preset.id = presetId;
-              preset.name = presetName;
-              preset.displayType = 0;
-              preset.namePrefix = false;
-              const ataDevice = ataDevicesInConfig.find(d => d.id === deviceId);
-              if (ataDevice && !ataDevice.presets.some(p => p.id === presetId)) {
-                ataDevice.presets.push(preset);
-                newDevices.ataPresets.push(preset);
-              }
-            });
+          devicesInMelCloud.forEach(d => {
+            if (d.Type === 0) devicesByType.ata.push(d);
+            if (d.Type === 1) devicesByType.atw.push(d);
+            if (d.Type === 3) devicesByType.erv.push(d);
           });
 
-          // === Handle ATW devices ===
-          devicesByTypeInMelCloud.atw.forEach(device => {
-            const { DeviceID: deviceId, Type: deviceType, DeviceName: deviceName, Presets: devicePresets = [] } = device;
-            const deviceAtw = {
-              id: deviceId,
-              type: deviceType,
-              typeString: "Heat Pump",
-              name: deviceName,
-              displayMode: 1,
-              hideZone: 0,
-              temperatureSensor: false,
-              presets: [],
-              buttonsSensors: []
-            };
-            if (!atwDevicesInConfig.some(d => d.id === deviceId)) {
-              atwDevicesInConfig.push(deviceAtw);
-              newDevices.atw.push(deviceAtw);
-            }
-            devicePresets.forEach(preset => {
-              const { ID: presetId, NumberDescription: presetName } = preset;
-              preset.id = presetId;
-              preset.name = presetName;
-              preset.displayType = 0;
-              preset.namePrefix = false;
-              const atwDevice = atwDevicesInConfig.find(d => d.id === deviceId);
-              if (atwDevice && !atwDevice.presets.some(p => p.id === presetId)) {
-                atwDevice.presets.push(preset);
-                newDevices.atwPresets.push(preset);
+          acc.ataDevices ??= [];
+          acc.atwDevices ??= [];
+          acc.ervDevices ??= [];
+
+          const removedAta = removeStaleDevices(acc.ataDevices, devicesByType.ata);
+          const removedAtw = removeStaleDevices(acc.atwDevices, devicesByType.atw);
+          const removedErv = removeStaleDevices(acc.ervDevices, devicesByType.erv);
+
+          // Function to handle device & presets
+          const handleDevices = (devicesInCloud, devicesInConfig, typeString, newArr, newPresets) => {
+            devicesInCloud.forEach(device => {
+              const { DeviceID: id, Type: type, DeviceName: name, Presets: presets = [] } = device;
+              const devObj = { id, type, typeString, name, displayMode: 1, presets: [], buttonsSensors: [] };
+              if (!devicesInConfig.some(d => d.id === id)) {
+                devicesInConfig.push(devObj);
+                newArr.push(devObj);
               }
+              presets.forEach(p => {
+                p.id = p.ID;
+                p.name = p.NumberDescription;
+                p.displayType = 0;
+                p.namePrefix = false;
+                const devConfig = devicesInConfig.find(d => d.id === id);
+                if (devConfig && !devConfig.presets.some(x => x.id === p.ID)) {
+                  devConfig.presets.push(p);
+                  newPresets.push(p);
+                }
+              });
             });
-          });
+          };
 
-          // === Handle ERV devices ===
-          devicesByTypeInMelCloud.erv.forEach(device => {
-            const { DeviceID: deviceId, Type: deviceType, DeviceName: deviceName, Presets: devicePresets = [] } = device;
-            const deviceErv = {
-              id: deviceId,
-              type: deviceType,
-              typeString: "ERV",
-              name: deviceName,
-              displayMode: 1,
-              temperatureSensor: false,
-              presets: [],
-              buttonsSensors: []
-            };
-            if (!ervDevicesInConfig.some(d => d.id === deviceId)) {
-              ervDevicesInConfig.push(deviceErv);
-              newDevices.erv.push(deviceErv);
-            }
-            devicePresets.forEach(preset => {
-              const { ID: presetId, NumberDescription: presetName } = preset;
-              preset.id = presetId;
-              preset.name = presetName;
-              preset.displayType = 0;
-              preset.namePrefix = false;
-              const ervDevice = ervDevicesInConfig.find(d => d.id === deviceId);
-              if (ervDevice && !ervDevice.presets.some(p => p.id === presetId)) {
-                ervDevice.presets.push(preset);
-                newDevices.ervPresets.push(preset);
-              }
-            });
-          });
-
-          // --- Display Info Section ---
-          const textAta = `ATA: ${newDevices.ata.length}`;
-          const textAtw = `ATW: ${newDevices.atw.length}`;
-          const textErv = `ERV: ${newDevices.erv.length}`;
-          const textAtaPresets = `ATA Presets: ${newDevices.ataPresets.length}`;
-          const textAtwPresets = `ATW Presets: ${newDevices.atwPresets.length}`;
-          const textErvPresets = `ERV Presets: ${newDevices.ervPresets.length}`;
-          const textRemovedAta = `ATA: ${removedAta.length}`;
-          const textRemovedAtw = `ATW: ${removedAtw.length}`;
-          const textRemovedErv = `ERV: ${removedErv.length}`;
+          handleDevices(devicesByType.ata, acc.ataDevices, "Air Conditioner", newDevices.ata, newDevices.ataPresets);
+          handleDevices(devicesByType.atw, acc.atwDevices, "Heat Pump", newDevices.atw, newDevices.atwPresets);
+          handleDevices(devicesByType.erv, acc.ervDevices, "ERV", newDevices.erv, newDevices.ervPresets);
 
+          // Display summary
           const newDevicesCount = newDevices.ata.length + newDevices.atw.length + newDevices.erv.length;
           const newPresetsCount = newDevices.ataPresets.length + newDevices.atwPresets.length + newDevices.ervPresets.length;
           const removedCount = removedAta.length + removedAtw.length + removedErv.length;
 
-          if (newDevicesCount === 0 && newPresetsCount === 0 && removedCount === 0) {
+          if (!newDevicesCount && !newPresetsCount && !removedCount) {
             updateInfo('info', 'No changes detected.', 'white');
           } else {
-            if (newDevicesCount > 0) {
-              updateInfo('info', `Found new devices: ${textAta}, ${textAtw}, ${textErv}.`, 'green');
-            }
-            if (newPresetsCount > 0) {
-              updateInfo('info1', `Found new presets: ${textAtaPresets}, ${textAtwPresets}, ${textErvPresets}.`, 'green');
-            }
-            if (removedCount > 0) {
-              updateInfo('info2', `Removed devices: ${textRemovedAta}, ${textRemovedAtw}, ${textRemovedErv}.`, 'orange');
-            }
+            if (newDevicesCount) updateInfo('info', `Found new devices: ATA: ${newDevices.ata.length}, ATW: ${newDevices.atw.length}, ERV: ${newDevices.erv.length}.`, 'green');
+            if (newPresetsCount) updateInfo('info1', `Found new presets: ATA: ${newDevices.ataPresets.length}, ATW: ${newDevices.atwPresets.length}, ERV: ${newDevices.ervPresets.length}.`, 'green');
+            if (removedCount) updateInfo('info2', `Removed devices: ATA: ${removedAta.length}, ATW: ${removedAtw.length}, ERV: ${removedErv.length}.`, 'orange');
           }
 
           await homebridge.updatePluginConfig(pluginConfig);
           await homebridge.savePluginConfig(pluginConfig);
-          document.getElementById('logIn').setAttribute('class', 'btn btn-secondary');
-          homebridge.hideSpinner();
+          document.getElementById('logIn').className = "btn btn-secondary";
 
         } catch (error) {
           updateInfo('info', 'Check Your credentials data and try again.', 'yellow');
           updateInfo('info1', `Error: ${error}`, 'red');
-          document.getElementById('logIn').setAttribute('class', 'btn btn-secondary');
+          document.getElementById('logIn').className = "btn btn-secondary";
         } finally {
           homebridge.hideSpinner();
         }
       });
+
     })();
   </script>
 </body>

package/package.json

@@ -1,7 +1,7 @@
 {
   "displayName": "MELCloud Control",
   "name": "homebridge-melcloud-control",
-  "version": "3.9.0-beta.17",
+  "version": "3.9.0-beta.19",
   "description": "Homebridge plugin to control Mitsubishi Air Conditioner, Heat Pump and Energy Recovery Ventilation.",
   "license": "MIT",
   "author": "grzegorz914",