homebridge-unifi-protect
Version:
Homebridge UniFi Protect plugin providing complete HomeKit integration for the entire UniFi Protect ecosystem with full support for most features including HomeKit Secure Video, multiple controllers, blazing fast performance, and much more.
197 lines (189 loc) • 11 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-protect/main/images/homebridge-unifi-protect.svg" alt="homebridge-unifi-protect 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 Protect 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-protect</strong>.</p>
<table class="table table-sm table-borderless text-center">
<tr>
<td>
<input type="test" placeholder="Protect controller hostname or IP address" size="40" id="address"></input>
</td>
</tr>
<tr>
<td>
<input type="username" placeholder="Protect controller username" size="40" id="username"></input>
</td>
</tr>
<tr>
<td>
<input type="password" placeholder="Protect controller password" size="40" id="password"></input>
</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 Protect:
<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>
<li>If you have a large number of cameras, make sure you are running this plugin on a machine that has sufficient CPU resources for the best performance. The recommended configuration is to use any Apple Silicon-based macOS environment.</li>
<li>You may run into networking issues when using Docker-based environments. These are Homebridge-specific issues, not HBUP-specific ones. You can access the <a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/Troubleshooting.md">Troubleshooting</a> documentation for more information.</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;">
<div id="deviceInfo">
<table class="table table-sm table-borderless">
<tr class="align-center">
<td id="headerInfo" colspan="2" class="m-0 p-2 text-center font-weight-bold"></td>
</tr>
<tr class="align-top">
<td rowspan="3" class="w-25">
<table id="sidebar" class="table table-sm table-bordered m-0 p-0">
<tr>
<td>
<table class="table table-sm table-borderless m-0 p-0" id="controllersTable"></table>
</td>
</tr>
<tr>
<td>
<table class="table table-sm table-borderless m-0 p-0" id="devicesTable"></table>
</td>
</tr>
</table>
</td>
<td id="deviceStatsTable">
<table class="table table-sm table-borderless border-bottom m-0 p-0">
<tr id="deviceStatsHeader">
<th class="m-0 p-0" style="font-weight: bold; width: 30%;">Model</th>
<th class="m-0 p-0 w-25" style="font-weight: bold;">IP Address</th>
<th class="m-0 p-0" style="font-weight: bold; width: 20%;">MAC Address</th>
<th class="m-0 p-0 w-25" style="font-weight: bold;">Status</th>
</tr>
<tr>
<td id="device_model" class="m-0 p-0"></td>
<td id="device_address" class="m-0 p-0"></td>
<td id="device_mac" class="m-0 p-0"></td>
<td id="device_online" class="m-0 p-0"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td id="configTable" class="w-100"></td>
</tr>
</table>
</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-protect">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-protect/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-protect/blob/main/README.md#getting-started">Plugin Configuration</a>
: how to quickly get up and running.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/BestPractices.md">Best Practices</a>
: best practices for getting the most of your HomeKit setup and UniFi Protect.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/Troubleshooting.md" style="font-weight: bold;">Troubleshooting</a>
: running into login problems, network problems, or streaming issues? Give this a read before looking anywhere else.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/Changelog.md">Changelog</a>: changes and release history of this plugin, starting with v3.0.
</li>
</ul>
<h5>Additional Topics</h5>
<ul dir="auto">
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/FeatureOptions.md">Feature Options</a>: granular options to allow you to set the camera quality individually, show or hide specific cameras, controllers, and more.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/Autoconfiguration.md">Autoconfiguration</a>: how Protect controller autoconfiguration, transcoding and transmuxing work in HBUP, and why.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/AudioOptions.md">Audio Options</a>: options to further tailor how audio is handled from Protect, such as background noise reduction.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/Doorbell.md">Doorbells</a>: how UniFi Protect doorbell support works in this plugin, and how to use all the available features including doorbell messages.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/HomeKitSecureVideo.md">HomeKit Secure Video</a>: how HomeKit Secure Video support works in this plugin with UniFi Protect.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/Liveviews.md">Liveview Scenes</a>: use the UniFi Protect liveviews feature (available in the UniFi Protect controller webUI) to create motion-detection scenes.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/MQTT.md">MQTT</a>: how to configure MQTT support.
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/ConfigurationReference.md">Plugin Configuration Reference</a>: complete list of configuration options available in 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-protect/issues/new/choose">Create a Developer Support Request</a>
</li>
<li>
<a target="_blank" href="https://github.com/hjdhjd/homebridge-unifi-protect/blob/main/docs/Changelog.md">View the Changelog and Release Notes</a>
</li>
</ul>
</div>
<script type="module">
/* Copyright(C) 2017-2025, HJD (https://github.com/hjdhjd). All rights reserved.
*
* Plugin webUI script loader.
*/
;
// Ensure we load the webUI dynamically so it isn't cached on each load.
const script = document.createElement('script');
script.src = "./ui.mjs?v=" + Date.now().toString();
script.type = "module";
document.body.appendChild(script);
</script>