homebridge-unifi-access
Version:
Homebridge UniFi Access plugin providing complete HomeKit integration for the UniFi Access ecosystem with full support for most features including autoconfiguration, motion detection, multiple controllers, and realtime updates.
161 lines (145 loc) • 7.8 kB
HTML
<style>
.hbup-blockquote {
background-color: #E6EEF9;
border-left: 5px solid #0559C9;
color: #536878;
font-size: 0.8rem;
font-weight: 550;
}
</style>
<p class="text-center">
<img src="https://raw.githubusercontent.com/hjdhjd/homebridge-unifi-access/main/images/homebridge-unifi-access.svg" alt="homebridge-unifi-access logo" class="w-50" />
</p>
<div id="pageFirstRun" style="display: none;">
<div class="mx-auto text-left" style="width: 90%;">
<p>Please enter the address of your UniFi Access controller (e.g. unvr.local or 10.0.0.1) and the login credentials for a <strong>local user</strong> to get started with <strong>homebridge-unifi-access</strong>.</p>
<table class="table table-sm table-borderless text-center">
<tr>
<td>
<input type="text" autocomplete="off" placeholder="Access controller hostname or IP address" size="40" id="address" />
</td>
</tr>
<tr>
<td>
<input type="username" autocomplete="username" placeholder="Access controller username" size="40" id="username" />
</td>
</tr>
<tr>
<td>
<input type="password" autocomplete="current-password" placeholder="Access controller password" size="40" id="password" />
</td>
</tr>
<tr>
<td class="m-0 p-2 text-center font-weight-bold text-danger" id="loginError">
</td>
</tr>
</table>
<blockquote class="blockquote hbup-blockquote mb-0 mt-0 pb-0 pt-0">
Things to keep in mind regarding UniFi Access:
<ul dir="auto">
<li style="font-weight: bold;">A local user account is required to use this plugin. Ubiquiti.com/UI.com accounts are not supported. You can create an account by accessing the <i>Admins & Users</i> tab in the UniFi console webUI.</li>
</ul>
</blockquote>
</div>
<div class="text-center">
<br>
<button type="button" class="btn btn-primary" id="firstRun">Configure Plugin →</button>
<br>
To optimize performance and responsiveness, please make this plugin a <a target="_blank" href="https://github.com/homebridge/homebridge/wiki/Child-Bridges">child bridge</a> once you've completed configuration.
</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="menuFeatureOptions">Feature Options</button>
<button type="button" class="btn btn-primary mr-0" id="menuHome">Support</button>
</div>
<div id="pageFeatureOptions" class="mt-2" style="display: none;" tabindex="0">
<!-- Header information bar -->
<div id="headerInfo" class="alert alert-info bg-transparent py-2 px-3 mb-2"></div>
<!-- Main content area -->
<div class="feature-main-content">
<!-- Sidebar -->
<aside id="sidebar" class="me-3">
<div class="sidebar-content">
<nav id="controllersContainer" class="p-2"></nav>
<nav id="devicesContainer" class="p-2"></nav>
</div>
</aside>
<!-- Main content -->
<main class="feature-content">
<!-- Device stats using CSS Grid -->
<div id="deviceStatsContainer"></div>
<!-- Search panel -->
<div id="search" class="mb-3"></div>
<!-- Options content area -->
<div id="optionsContainer" class="options-content alert-info rounded p-3">
<div id="configTable"></div>
</div>
</main>
</div>
</div>
<div id="pageSupport" class="mt-4" style="display: none;">
<h5>Introduction</h5>
<p class="px-4">I hope you enjoy this plugin as much as I enjoy developing it. All my projects are labors of love. If you'd like to show your appreciation - <a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-access">star this project on GitHub</A> and do some good in your community, either financially or with your time: a food bank, an animal shelter (two of my passions), or whatever resonates with you that can give something back to the world around you. If you're looking for a couple of my faves: <a target="_blank" href="https://wck.org/donate">World Central Kitchen</a> and <a target="_blank" href="https://bestfriends.org/donate">Best Friends</a>.</p>
<div class="px-4">
Plugins by <a target="_blank" href="https://github.com/hjdhjd">HJD</a>:
<ul dir="auto">
<li><a target="_blank" href="https://github.com/hjdhjd/homebridge-comed-hourlypricing">homebridge-comed-hourlypricing: HomeKit integration for ComEd Hourly Pricing customers.</a></li>
<li><a target="_blank" href="https://github.com/hjdhjd/homebridge-hunter-hydrawise">homebridge-hunter-hydrawise: Hunter Hydrawise integration for HomeKit.</a></li>
<li><a target="_blank" href="https://github.com/hjdhjd/homebridge-ratgdo">homebridge-ratgdo: Ratgdo (non-myQ Liftmaster and Chamberlain) garage door and gate opener support for HomeKit</a></li>
<li><a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-access">homebridge-unifi-access: HomeKit integration for the UniFi Access ecosystem</a></li>
<li><a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect">homebridge-unifi-protect: Complete HomeKit integration for the entire UniFi Protect ecosystem</a></li>
</ul>
</div>
<h5>Getting Started</h5>
<ul dir="auto">
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-access/blob/main/README.md#installation">Installation</a>
: installing this plugin, including system requirements.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-access/blob/main/docs/FeatureOptions.md">Feature Options</a>: granular options to allow you to configure options at a controller or device level.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-access/blob/main/docs/MQTT.md">MQTT</a>: how to configure MQTT support.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-access/blob/main/docs/Changelog.md">Changelog</a>: changes and release history of this plugin.
</li>
</ul>
<h5>Support</h5>
<ul>
<li>
<a target="_blank" href="https://discord.gg/QXqfHEW">Discord Support Channel</a>
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-access/issues/new/choose">Create a Developer Support Request</a>
</li>
</ul>
</div>
<script type="module">
/* Copyright(C) 2017-2025, HJD (https://github.com/hjdhjd). All rights reserved.
*
* Plugin webUI script loader.
*/
;
// Compute a timestamp for cache-busting so each URL appears unique.
const timestamp = Date.now();
// Next, set up an import map that will append a cache-busting query string to our modules.
const importMap = {
imports: {
"./ui.mjs": new URL("./ui.mjs", import.meta.url).href + "?cb=" + timestamp,
"./lib/featureOptions.js": new URL("./lib/featureOptions.js", import.meta.url).href + "?cb=" + timestamp,
"./lib/webUi.mjs": new URL("./lib/webUi.mjs", import.meta.url).href + "?cb=" + timestamp,
"./lib/webUi-featureOptions.mjs": new URL("./lib/webUi-featureOptions.mjs", import.meta.url).href + "?cb=" + timestamp
}
};
// Append the import map script to the document head so the browser applies it.
const mapScript = document.createElement("script");
mapScript.type = "importmap";
mapScript.textContent = JSON.stringify(importMap);
document.head.appendChild(mapScript);
// Finally, import the UI entry point so we always load a fresh copy.
await import("./ui.mjs");
</script>