@switchbot/homebridge-switchbot 5.0.0-beta.11 → 5.0.0-beta.111

package/dist/homebridge-ui/public/css/styles.css

@@ -0,0 +1,254 @@
+:root {
+  color-scheme: light dark;
+  --switchbot-red: #ef4444;
+  --switchbot-red-hover: #dc2626;
+  --switchbot-red-light: #fee2e2;
+}
+
+@media (prefers-color-scheme: light) {
+  body {
+    background: #f5f5f5;
+    color: #1a1a1a;
+  }
+  input {
+    background: #fff;
+    border-color: #ddd;
+    color: #1a1a1a;
+  }
+  input:focus {
+    border-color: #6366f1;
+  }
+  .card {
+    background: #fff;
+    border: 1px solid #ddd;
+  }
+  code {
+    background: #f0f0f0;
+    color: #1a1a1a;
+  }
+  h2 {
+    border-bottom-color: #ddd;
+  }
+  .status {
+    color: #666;
+  }
+}
+
+@media (prefers-color-scheme: dark) {
+  body {
+    background: #1a1a1a;
+    color: #fff;
+  }
+  input {
+    background: #2a2a2a;
+    border-color: #444;
+    color: #fff;
+  }
+  .card {
+    background: #2a2a2a;
+  }
+  code {
+    background: #333;
+    color: #fff;
+  }
+  h2 {
+    border-bottom-color: #444;
+  }
+  .status {
+    color: #888;
+  }
+  .device-item {
+    background: #333;
+    border: 1px solid #444;
+  }
+}
+
+@media (prefers-color-scheme: light) {
+  .device-item {
+    background: #f9f9f9;
+    border: 1px solid #e0e0e0;
+  }
+}
+
+body {
+  font-family:
+    system-ui,
+    -apple-system,
+    Arial;
+  padding: 16px;
+}
+
+h1 {
+  font-size: 24px;
+  margin-top: 0;
+}
+
+h2 {
+  font-size: 16px;
+  margin-top: 24px;
+  margin-bottom: 12px;
+  border-bottom: 1px solid;
+  padding-bottom: 8px;
+}
+
+ul {
+  padding-left: 0;
+  list-style: none;
+}
+
+li {
+  margin: 8px 0;
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+button {
+  padding: 10px 20px;
+  background: var(--switchbot-red);
+  color: #fff;
+  border: none;
+  border-radius: 6px;
+  cursor: pointer;
+  font-weight: 500;
+  font-size: 14px;
+  transition: all 0.2s ease;
+}
+
+button:hover {
+  background: var(--switchbot-red-hover);
+  transform: translateY(-1px);
+  box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3);
+}
+
+button:active {
+  transform: translateY(0);
+  box-shadow: 0 2px 6px rgba(239, 68, 68, 0.2);
+}
+
+button.secondary {
+  background: #6b7280;
+  color: #fff;
+}
+
+button.secondary:hover {
+  background: #4b5563;
+  box-shadow: 0 4px 12px rgba(107, 114, 128, 0.3);
+}
+
+button.success {
+  background: #10b981;
+}
+
+button.success:hover {
+  background: #059669;
+  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
+}
+
+code {
+  padding: 4px 6px;
+  border-radius: 4px;
+  font-family: monospace;
+}
+
+.form-group {
+  margin-bottom: 16px;
+}
+
+label {
+  display: block;
+  margin-bottom: 6px;
+  font-weight: 500;
+  font-size: 12px;
+  color: #6b7280;
+}
+
+input {
+  width: 100%;
+  max-width: 400px;
+  padding: 8px 10px;
+  border: 1px solid #d1d5db;
+  border-radius: 6px;
+  font-family: system-ui, -apple-system, monospace;
+  font-size: 14px;
+  transition: all 0.2s ease;
+}
+
+input:focus {
+  outline: none;
+  border-color: var(--switchbot-red, #ef4444);
+  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
+}
+
+input:disabled,
+input[readonly] {
+  background-color: #f9fafb;
+  cursor: not-allowed;
+}
+
+select {
+  padding: 8px 10px;
+  border: 1px solid #d1d5db;
+  border-radius: 6px;
+  font-family: system-ui, -apple-system, Arial;
+  font-size: 14px;
+  transition: all 0.2s ease;
+  cursor: pointer;
+}
+
+select:focus {
+  outline: none;
+  border-color: var(--switchbot-red, #ef4444);
+  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
+}
+
+.status {
+  font-size: 14px;
+  margin-top: 4px;
+}
+
+.status.ok {
+  color: #10b981;
+}
+
+.error {
+  color: #ef4444;
+}
+
+.success-msg {
+  color: #10b981;
+  margin-top: 8px;
+}
+
+.card {
+  padding: 16px;
+  border-radius: 8px;
+  margin-bottom: 16px;
+}
+
+.device-item {
+  padding: 10px 12px;
+  border-radius: 6px;
+  margin-bottom: 6px;
+  display: flex;
+  gap: 10px;
+  align-items: center;
+  justify-content: space-between;
+  transition: all 0.2s ease;
+}
+
+.device-item:hover {
+  transform: translateY(-1px);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+.card {
+  padding: 16px;
+  border-radius: 8px;
+  margin-bottom: 16px;
+  transition: box-shadow 0.2s ease;
+}
+
+.card:hover {
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
+}

package/dist/homebridge-ui/public/index.html

@@ -1,249 +1,114 @@
-<p class="text-center">
-  <img
-    src="https://raw.githubusercontent.com/OpenWonderLabs/homebridge-switchbot/latest/branding/Homebridge_x_SwitchBot.svg"
-    alt="homebridge-switchbot logo" style="width: 50%" />
-</p>
-<div id="pageIntro" style="display: none">
-  <p class="lead text-center">Thank you for installing <strong>homebridge-switchbot</strong></p>
-  <p class="lead text-center">Before continuing:</p>
-  <ol>
-    <li class="mb-3">
-      Download the SwitchBot App from either the
-      <a href="https://apps.apple.com/us/app/switchbot/id1087374760" target="_blank" rel="noreferrer noopener">App
-        Store</a> or the
-      <a href="https://play.google.com/store/apps/details?id=com.theswitchbot.switchbot&hl=en_US&gl=US" target="_blank"
-        rel="noreferrer noopener">Play Store</a>.
-    </li>
-    <li class="mb-3">Select <strong>Profile</strong>.</li>
-    <li class="mb-3">Select <strong>Preferences</strong>.</li>
-    <li class="mb-3">Tap the <strong>App version</strong> 10 times, this will enable Developer Options.</li>
-    <li class="mb-3">Select <strong>Developer Options</strong>.</li>
-    <li class="mb-3">Copy your token by hitting <strong>Copy to Clipboard</strong>.</li>
-    <li class="mb-3">Paste the Token into the Token parameter on the next page.</li>
-  </ol>
-  <div class="text-center">
-    <button type="button" class="btn btn-primary" id="introLink">Continue &rarr;</button>
-  </div>
-</div>
-<div id="menuWrapper" class="btn-group w-100 mb-0" role="group" aria-label="UI Menu" style="display: none">
-  <button type="button" class="btn btn-primary" id="menuSettings">Settings</button>
-  <button type="button" class="btn btn-primary" id="menuDevices">Devices</button>
-  <button type="button" class="btn btn-primary mr-0" id="menuHome">Support</button>
-</div>
-<div id="disabledBanner" class="alert alert-secondary mb-0 mt-3" role="alert" style="display: none">
-  Plugin is currently disabled
-  <button id="disabledEnable" type="button" class="btn btn-link p-0 m-0 float-right">Enable</button>
-</div>
-<div id="pageDevices" class="mt-4" style="display: none">
-  <div id="deviceInfo">
-    <form>
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width,initial-scale=1" />
+    <title>SwitchBot Plugin UI</title>
+    <link rel="stylesheet" href="css/styles.css" />
+  </head>
+  <body>
+    <h1>🤖 SwitchBot Configuration</h1>
+
+    <div class="card">
+      <h2>API Credentials</h2>
+      <p>
+        Configure your SwitchBot API token and secret to enable device discovery
+        and control.
+      </p>
+
       <div class="form-group">
-        <select class="form-control" id="deviceSelect"></select>
+        <label for="token">API Token:</label>
+        <input
+          type="password"
+          id="token"
+          placeholder="Enter your SwitchBot API token"
+        />
+        <div class="status" id="tokenStatus"></div>
       </div>
-    </form>
-    <table class="table w-100" id="deviceTable" style="display: none">
-      <thead>
-        <tr class="table-active">
-          <th scope="col" style="width: 40%">Device Name</th>
-          <th scope="col" style="width: 60%" id="displayName"></th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr>
-          <th scope="row">Device ID</th>
-          <td id="deviceId"></td>
-        </tr>
-        <tr>
-          <th scope="row">Model</th>
-          <td id="model"></td>
-        </tr>
-        <tr>
-          <th scope="row">Firmware Version</th>
-          <td id="version"></td>
-        </tr>
-        <tr>
-          <th scope="row">Device Type</th>
-          <td id="deviceType"></td>
-        </tr>
-        <tr>
-          <th scope="row">Connection Type</th>
-          <td id="connectionType"></td>
-        </tr>
-      </tbody>
-    </table>
-    <p class="text-center">External accessories will not be displayed here.</p>
-  </div>
-</div>
-<div id="pageSupport" class="mt-4" style="display: none">
-  <p class="text-center lead">Thank you for using <strong>homebridge-switchbot</strong></p>
-  <p class="text-center">The links below will take you to our GitHub wiki</p>
-  <h5>Setup</h5>
-  <ul>
-    <li>
-      <a href="https://github.com/OpenWonderLabs/homebridge-switchbot/wiki" target="_blank">Wiki Home</a>
-    </li>
-    <li>
-      <a href="https://github.com/OpenWonderLabs/homebridge-switchbot/wiki/Configuration"
-        target="_blank">Configuration</a>
-    </li>
-    <li>
-      <a href="https://github.com/OpenWonderLabs/homebridge-switchbot/wiki/Beta-Version" target="_blank">Beta
-        Version</a>
-    </li>
-    <li>
-      <a href="https://github.com/OpenWonderLabs/homebridge-switchbot/wiki/Node-Version" target="_blank">Node
-        Version</a>
-    </li>
-    <li>
-      <a href="https://github.com/OpenWonderLabs/homebridge-switchbot/wiki/Uninstallation"
-        target="_blank">Uninstallation</a>
-    </li>
-  </ul>
-  <h5>Features</h5>
-  <ul>
-    <li>
-      <a href="https://github.com/OpenWonderLabs/homebridge-switchbot/wiki/Supported-Devices" target="_blank">Supported
-        Devices</a>
-    </li>
-  </ul>
-  <h5>Help/About</h5>
-  <ul>
-    <li>
-      <a href="https://github.com/OpenWonderLabs/homebridge-switchbot/issues/new/choose" target="_blank">Support
-        Request</a>
-    </li>
-    <li>
-      <a href="https://github.com/OpenWonderLabs/homebridge-switchbot/blob/latest/CHANGELOG.md"
-        target="_blank">Changelog</a>
-    </li>
-  </ul>
-</div>
-<script>
-  (async () => {
-    try {
-      const currentConfig = await homebridge.getPluginConfig();
-      showIntro = () => {
-        const introLink = document.getElementById('introLink');
-        introLink.addEventListener('click', () => {
-          homebridge.showSpinner();
-          document.getElementById('pageIntro').style.display = 'none';
-          document.getElementById('menuWrapper').style.display = 'inline-flex';
-          showSettings();
-          homebridge.hideSpinner();
-        });
-        document.getElementById('pageIntro').style.display = 'block';
-      };
-      showDevices = async () => {
-        homebridge.showSpinner();
-        homebridge.hideSchemaForm();
-        document.getElementById('menuHome').classList.remove('btn-elegant');
-        document.getElementById('menuHome').classList.add('btn-primary');
-        document.getElementById('menuDevices').classList.add('btn-elegant');
-        document.getElementById('menuDevices').classList.remove('btn-primary');
-        document.getElementById('menuSettings').classList.remove('btn-elegant');
-        document.getElementById('menuSettings').classList.add('btn-primary');
-        document.getElementById('pageSupport').style.display = 'none';
-        document.getElementById('pageDevices').style.display = 'block';
-        const cachedAccessories =
-          typeof homebridge.getCachedAccessories === 'function'
-            ? await homebridge.getCachedAccessories()
-            : await homebridge.request('/getCachedAccessories');
-        if (cachedAccessories.length > 0) {
-          cachedAccessories.sort((a, b) => {
-            return a.displayName.toLowerCase() > b.displayName.toLowerCase() ? 1 : b.displayName.toLowerCase() > a.displayName.toLowerCase() ? -1 : 0;
-          });
-        }
-        const deviceSelect = document.getElementById('deviceSelect');
-        deviceSelect.innerHTML = '';
-        cachedAccessories.forEach((a) => {
-          const option = document.createElement('option');
-          option.text = a.displayName;
-          option.value = a.UUID;
-          deviceSelect.add(option);
-        });
-        showDeviceInfo = async (UUID) => {
-          homebridge.showSpinner();
-          const thisAcc = cachedAccessories.find((x) => x.UUID === UUID);
-          const context = thisAcc.context;
-          document.getElementById('displayName').innerHTML = thisAcc.displayName;
-          document.getElementById('deviceId').innerHTML = context.deviceId;
-          document.getElementById('model').innerHTML = context.model;
-          document.getElementById('version').innerHTML = context.version;
-          document.getElementById('deviceType').innerHTML = context.deviceType;
-          document.getElementById('connectionType').innerHTML = context.connectionType;
-          document.getElementById('refreshRate').innerHTML = context.refreshRate;
-          document.getElementById('updateRate').innerHTML = context.updateRate;
-          document.getElementById('pushRate').innerHTML = context.pushRate;
-          document.getElementById('deviceTable').style.display = 'inline-table';
-          homebridge.hideSpinner();
-        };
-        deviceSelect.addEventListener('change', (event) => showDeviceInfo(event.target.value));
-        if (cachedAccessories.length > 0) {
-          showDeviceInfo(cachedAccessories[0].UUID);
-        } else {
-          const option = document.createElement('option');
-          option.text = 'No Devices';
-          deviceSelect.add(option);
-          deviceSelect.disabled = true;
-        }
-        homebridge.hideSpinner();
-      };
-      showSupport = () => {
-        homebridge.showSpinner();
-        homebridge.hideSchemaForm();
-        document.getElementById('menuHome').classList.add('btn-elegant');
-        document.getElementById('menuHome').classList.remove('btn-primary');
-        document.getElementById('menuDevices').classList.remove('btn-elegant');
-        document.getElementById('menuDevices').classList.add('btn-primary');
-        document.getElementById('menuSettings').classList.remove('btn-elegant');
-        document.getElementById('menuSettings').classList.add('btn-primary');
-        document.getElementById('pageSupport').style.display = 'block';
-        document.getElementById('pageDevices').style.display = 'none';
-        homebridge.hideSpinner();
-      };
-      showSettings = () => {
-        homebridge.showSpinner();
-        document.getElementById('menuHome').classList.remove('btn-elegant');
-        document.getElementById('menuHome').classList.add('btn-primary');
-        document.getElementById('menuDevices').classList.remove('btn-elegant');
-        document.getElementById('menuDevices').classList.add('btn-primary');
-        document.getElementById('menuSettings').classList.add('btn-elegant');
-        document.getElementById('menuSettings').classList.remove('btn-primary');
-        document.getElementById('pageSupport').style.display = 'none';
-        document.getElementById('pageDevices').style.display = 'none';
-        homebridge.showSchemaForm();
-        homebridge.hideSpinner();
-      };
-      showDisabledBanner = () => {
-        document.getElementById('disabledBanner').style.display = 'block';
-      };
-      enablePlugin = async () => {
-        homebridge.showSpinner();
-        document.getElementById('disabledBanner').style.display = 'none';
-        currentConfig[0].disablePlugin = false;
-        await homebridge.updatePluginConfig(currentConfig);
-        await homebridge.savePluginConfig();
-        homebridge.hideSpinner();
-      };
-      menuHome.addEventListener('click', () => showSupport());
-      menuDevices.addEventListener('click', () => showDevices());
-      menuSettings.addEventListener('click', () => showSettings());
-      disabledEnable.addEventListener('click', () => enablePlugin());
-      if (currentConfig.length) {
-        document.getElementById('menuWrapper').style.display = 'inline-flex';
-        showSettings();
-        if (currentConfig[0].disablePlugin) {
-          showDisabledBanner();
-        }
-      } else {
-        currentConfig.push({ name: 'SwitchBot' });
-        await homebridge.updatePluginConfig(currentConfig);
-        showIntro();
-      }
-    } catch (err) {
-      homebridge.toast.error(err.message, 'Error');
-    } finally {
-      homebridge.hideSpinner();
-    }
-  })();
-</script>
+
+      <div class="form-group">
+        <label for="secret">API Secret:</label>
+        <input
+          type="password"
+          id="secret"
+          placeholder="Enter your SwitchBot API secret"
+        />
+        <div class="status" id="secretStatus"></div>
+      </div>
+
+      <button id="saveBtn" onclick="saveCredentials()">Save Credentials</button>
+      <div id="saveStatus"></div>
+    </div>
+
+    <div class="card">
+      <h2>Discover Devices</h2>
+      <p>
+        Click "Discover" to find all devices available in your SwitchBot account
+        and add them to your configuration.
+      </p>
+      <div style="margin-bottom: 16px">
+        <label
+          style="display: flex; align-items: center; gap: 8px; cursor: pointer"
+        >
+          <input
+            type="checkbox"
+            id="autoAddAllCheckbox"
+            style="width: auto; margin: 0"
+          />
+          <span>Auto-add all discovered devices</span>
+        </label>
+      </div>
+      <button
+        id="discoverBtn"
+        onclick="discoverDevices()"
+        style="margin-bottom: 16px"
+      >
+        🔍 Discover Devices
+      </button>
+      <div id="discoverStatus" style="margin-bottom: 16px"></div>
+      <div id="discoveredList" style="display: none">
+        <h3 style="margin-top: 0">Available Devices</h3>
+        <ul
+          id="discoveredDevices"
+          style="max-height: 300px; overflow-y: auto"
+        ></ul>
+      </div>
+    </div>
+
+    <div class="card">
+      <h2>Configured Devices</h2>
+      <p>
+        This page lists devices found in your Homebridge config for the
+        SwitchBot platform. Use the copy button to insert device IDs into the
+        plugin configuration. Connection preference (BLE/OpenAPI) is shown when
+        available.
+      </p>
+      <div id="status">Loading…</div>
+      <ul id="devices"></ul>
+      <div
+        id="removeAllContainer"
+        style="
+          display: none;
+          margin-top: 16px;
+          padding-top: 16px;
+          border-top: 1px solid rgba(0, 0, 0, 0.1);
+        "
+      >
+        <button
+          id="removeAllBtn"
+          style="
+            background: #dc2626;
+            width: 100%;
+            padding: 10px 16px;
+            font-size: 14px;
+            font-weight: 500;
+          "
+        >
+          🗑️ Remove All Devices
+        </button>
+      </div>
+    </div>
+
+    <script type="module" src="js/app.js"></script>
+  </body>
+</html>

package/dist/homebridge-ui/public/js/api.d.ts

@@ -0,0 +1,23 @@
+import './types.js';
+export declare function syncParentPluginConfigFromDisk(autoSave?: boolean): Promise<boolean>;
+export declare function fetchCredentialStatus(): Promise<any>;
+export declare function saveCredentials(token: string, secret: string): Promise<any>;
+export declare function fetchDevices(): Promise<any[]>;
+export declare function discoverDevices(): Promise<any[]>;
+export declare function addDevice(deviceId: string, name: string, type: string, options?: {
+    address?: string;
+    model?: string;
+    rssi?: number;
+}): Promise<any>;
+export declare function addDevicesInBulk(devices: Array<{
+    deviceId: string;
+    name: string;
+    type: string;
+    rssi?: number;
+    address?: string;
+    model?: string;
+}>): Promise<any>;
+export declare function updateDevice(deviceId: string, configDeviceName?: string, configDeviceType?: string): Promise<any>;
+export declare function deleteDevice(deviceId: string): Promise<any>;
+export declare function deleteAllDevices(): Promise<any>;
+//# sourceMappingURL=api.d.ts.map

package/dist/homebridge-ui/public/js/api.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"api.d.ts","sourceRoot":"","sources":["../../../../src/homebridge-ui/public/js/api.ts"],"names":[],"mappings":"AACA,OAAO,YAAY,CAAA;AAYnB,wBAAsB,8BAA8B,CAAC,QAAQ,UAAQ,GAAG,OAAO,CAAC,OAAO,CAAC,CA2CvF;AAED,wBAAsB,qBAAqB,IAAI,OAAO,CAAC,GAAG,CAAC,CAe1D;AAED,wBAAsB,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,CAcjF;AAED,wBAAsB,YAAY,IAAI,OAAO,CAAC,GAAG,EAAE,CAAC,CASnD;AAED,wBAAsB,eAAe,IAAI,OAAO,CAAC,GAAG,EAAE,CAAC,CAatD;AAED,wBAAsB,SAAS,CAC7B,QAAQ,EAAE,MAAM,EAChB,IAAI,EAAE,MAAM,EACZ,IAAI,EAAE,MAAM,EACZ,OAAO,CAAC,EAAE;IAAE,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,GAC5D,OAAO,CAAC,GAAG,CAAC,CAmBd;AAED,wBAAsB,gBAAgB,CACpC,OAAO,EAAE,KAAK,CAAC;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,GAChH,OAAO,CAAC,GAAG,CAAC,CAad;AAED,wBAAsB,YAAY,CAChC,QAAQ,EAAE,MAAM,EAChB,gBAAgB,CAAC,EAAE,MAAM,EACzB,gBAAgB,CAAC,EAAE,MAAM,GACxB,OAAO,CAAC,GAAG,CAAC,CAkBd;AAED,wBAAsB,YAAY,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,CAcjE;AAED,wBAAsB,gBAAgB,IAAI,OAAO,CAAC,GAAG,CAAC,CAcrD"}