@homebridge-plugins/homebridge-august
Version:
The August plugin allows you to access your August & Yale device(s) from HomeKit.
203 lines • 9.11 kB
HTML
<p class="text-center">
<img src="https://raw.githubusercontent.com/homebridge-plugins/homebridge-august/latest/branding/Homebridge_x_August.svg"
alt="homebridge-august logo" style="width: 45%" />
</p>
<div id="pageIntro" style="display: none">
<p class="lead text-center">Thank you for installing<strong> homebridge-august</strong></p>
<p class="lead text-center">To get started link your August Account:</p>
<ol>
<li class="mb-3">Input your August <strong>E-mail/Phone Number</strong> into the August Account Info.</li>
<li class="mb-3">Restart Homebridge to receive an August <strong>Validate Code</strong>.</li>
<li class="mb-3">Input your <strong>Validate Code</strong> into the August Account Info.</li>
<li class="mb-3">Finally <strong>Restart</strong> Homebridge..</li>
</ol>
<div class="text-center">
<button type="button" class="btn btn-primary" id="introLink">Continue →</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="menuDevices">Devices</button>
<button type="button" class="btn btn-primary" id="menuSettings">Settings</button>
<button type="button" class="btn btn-primary mr-0" id="menuHome">Support</button>
</div>
<div id="pageDevices" class="mt-4" style="display: none">
<div id="deviceInfo">
<form>
<div class="form-group">
<select class="form-control" id="deviceSelect"></select>
</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">Lock ID</th>
<td id="lockId"></td>
</tr>
<tr>
<th scope="row">Model</th>
<td id="model"></td>
</tr>
<tr>
<th scope="row">Firmware Version</th>
<td id="firmwareRevision"></td>
</tr>
</tbody>
</table>
<p class="text-center">External Accessories Will Not Display Here.</p>
</div>
</div>
<div id="pageSupport" class="mt-4" style="display: none">
<p class="text-center lead">Thank you for using <strong>homebridge-august</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/homebridge-plugins/homebridge-august/wiki" target="_blank">Wiki Home</a>
</li>
<li>
<a href="https://github.com/homebridge-plugins/homebridge-august/wiki/Configuration" target="_blank">Configuration</a>
</li>
<li>
<a href="https://github.com/homebridge-plugins/homebridge-august/wiki/Beta-Version" target="_blank">Beta Version</a>
</li>
<li>
<a href="https://github.com/homebridge-plugins/homebridge-august/wiki/Node-Version" target="_blank">Node Version</a>
</li>
<li>
<a href="https://github.com/homebridge-plugins/homebridge-august/wiki/Uninstallation"
target="_blank">Uninstallation</a>
</li>
</ul>
<h5>Features</h5>
<ul>
<li>
<a href="https://github.com/homebridge-plugins/homebridge-august/wiki/Supported-Devices" target="_blank">Supported
Devices</a>
</li>
</ul>
<h5>Help/About</h5>
<ul>
<li>
<a href="https://github.com/homebridge-plugins/homebridge-august/issues/new/choose" target="_blank">Support Request</a>
</li>
<li>
<a href="https://github.com/homebridge-plugins/homebridge-august/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';
showDevices();
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;
const deviceConfig = currentConfig.find((x) => x.UUID === UUID);
document.getElementById('displayName').innerHTML = thisAcc.displayName;
document.getElementById('lockId').innerHTML = context.lockId;
document.getElementById('model').innerHTML = context.model;
document.getElementById('firmwareRevision').innerHTML = context.firmwareRevision || 'N/A';
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);
}
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();
};
menuHome.addEventListener('click', () => showSupport());
menuDevices.addEventListener('click', () => showDevices());
menuSettings.addEventListener('click', () => showSettings());
if (currentConfig.length) {
document.getElementById('menuWrapper').style.display = 'inline-flex';
showDevices();
} else {
currentConfig.push({ name: 'August' });
await homebridge.updatePluginConfig(currentConfig);
showIntro();
}
} catch (err) {
homebridge.toast.error(err.message, 'Error');
} finally {
homebridge.hideSpinner();
}
})();
</script>