Merge branch 'main' into firmware-selector
This commit is contained in:
Paul Wieland
GitHub
commit
4d8cb14917
|
|
@ -235,9 +235,16 @@
|
|||
<esp-web-install-button></esp-web-install-button>
|
||||
</p>
|
||||
|
||||
|
||||
<h2>Wiring Diagram</h2>
|
||||
<img id="wiring_diagram" src="wiring_diagrams/secplus_diagram.png" alt="Security + 1 and 2 wiring diagram" />
|
||||
|
||||
<h3>Documentation</h3>
|
||||
<ul>
|
||||
<li><a href="webui_documentation.html">Web User Interface Documentation</a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
<h3>Drivers</h3>
|
||||
<p>If you can't connect to your ratgdo board make sure you have the right driver installed for the type of board you have.</p>
|
||||
<ul>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,670 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>ESPHome ratgdo Web UI Documentation</title>
|
||||
<meta name="description" content="Install ratgdo on your ESPHome devices." />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<meta name="color-scheme" content="dark light" />
|
||||
<meta property="og:title" content="ESPHome ratgdo Web UI Documentation" />
|
||||
<meta property="og:site_name" content="ESPHome ratgdo" />
|
||||
<meta property="og:url" content="https://ratgdo.github.io/esphome-ratgdo/" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:description" content="Documentation for the web user interface of ratgdo ESPHome" />
|
||||
<meta property="og:image" content="https://ratgdo.github.io/esphome-ratgdo/header.png" />
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:site" content="@esphome_ratgdo" />
|
||||
<meta name="twitter:title" content="ESPHome ratgdo" />
|
||||
<meta name="twitter:description" content="Documentation for the web user interface of ratgdo ESPHome" />
|
||||
<meta name="twitter:image" content="https://ratgdo.github.io/esphome-ratgdo/header.png" />
|
||||
|
||||
<style>
|
||||
body {
|
||||
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI",
|
||||
Roboto, Ubuntu, sans-serif;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.content {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: block;
|
||||
width: 100%;
|
||||
aspect-ratio: 1200 / 675;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin-top: 1.5em;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #03a9f4;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
li {
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
.footer {
|
||||
margin-top: 24px;
|
||||
border-top: 1px solid #ccc;
|
||||
padding-top: 24px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer .initiative {
|
||||
font-style: italic;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
input:checked+img {
|
||||
border-color: #58a6ff;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #58a6ff;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 450px) {
|
||||
.radios label {
|
||||
width: calc(50% - 16px);
|
||||
max-width: initial;
|
||||
}
|
||||
}
|
||||
|
||||
.diy::after {
|
||||
content: "DIY";
|
||||
background-color: #f44336;
|
||||
color: #fff;
|
||||
padding: 2px 4px;
|
||||
border-radius: 4px;
|
||||
font-size: 0.8em;
|
||||
position: absolute;
|
||||
bottom: 12px;
|
||||
left: 12px;
|
||||
}
|
||||
|
||||
body .diy {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body.show-diy .diy {
|
||||
display: initial;
|
||||
}
|
||||
|
||||
table,
|
||||
th,
|
||||
td {
|
||||
border: 1px solid;
|
||||
border-spacing: 0px;
|
||||
}
|
||||
|
||||
table thead th {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
table tr.odd {
|
||||
background-color: rgba(127, 127, 127, 0.3);
|
||||
}
|
||||
|
||||
table td, table th{
|
||||
padding: 10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="content">
|
||||
<img class="header" src="./header.png" alt="ESPHome ratgdo" />
|
||||
<h1>ESPHome ratgdo Web UI Documentation</h1>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr class="odd">
|
||||
<th>Name</th>
|
||||
<th>State</th>
|
||||
<th>Actions</th>
|
||||
<th>Explanation</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Button
|
||||
</td>
|
||||
<td>
|
||||
OFF
|
||||
</td>
|
||||
<td></td>
|
||||
<td>
|
||||
A sensor indicating when the wall panel button is pressed to toggle the door.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Client ID
|
||||
</td>
|
||||
<td>
|
||||
1234
|
||||
</td>
|
||||
<td>
|
||||
<div class="range">
|
||||
<label>
|
||||
1337
|
||||
</label>
|
||||
<input type="number" name="number-client_id" id="number-client_id" step="4096" min="1337"
|
||||
max="8385849" value="12345">
|
||||
<label>
|
||||
8385849
|
||||
</label>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
A unique identifier used to generate security + 2.0 codes
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Closing duration
|
||||
</td>
|
||||
<td>
|
||||
0.0 s
|
||||
</td>
|
||||
<td>
|
||||
<div class="range">
|
||||
<label>
|
||||
0
|
||||
</label>
|
||||
<input type="range" name="number-closing_duration" id="number-closing_duration" step="0.1"
|
||||
min="0" max="180">
|
||||
<label>
|
||||
180
|
||||
</label>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
The amount of time it takes for the door to close (learned after one door cycle)
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Door
|
||||
</td>
|
||||
<td>
|
||||
OPEN | CLOSED
|
||||
</td>
|
||||
<td>
|
||||
<button class="rnd">
|
||||
↑
|
||||
</button>
|
||||
|
||||
<button class="rnd">
|
||||
☐
|
||||
</button>
|
||||
|
||||
<button class="rnd">
|
||||
↓
|
||||
</button>
|
||||
</td>
|
||||
<td>
|
||||
Discrete controls for the door.
|
||||
<ul>
|
||||
<li><button class="rnd">↑</button> - open the door, ignore if alreay opened.</li>
|
||||
<li><button class="rnd">☐</button> - stop the door, only if door is moving.</li>
|
||||
<li><button class="rnd">↓</button> - close the door, ignore if already closed.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Dry contact close
|
||||
</td>
|
||||
<td>
|
||||
OFF | ON
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
</td>
|
||||
<td>The state of the ratgdo trigger door close input.
|
||||
<ul>
|
||||
<li>OFF - input is floating</li>
|
||||
<li>ON - input is connected to GND</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Dry contact light
|
||||
</td>
|
||||
<td>
|
||||
OFF | ON
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
</td>
|
||||
<td>The state of the ratgdo trigger light input.
|
||||
<ul>
|
||||
<li>OFF - input is floating</li>
|
||||
<li>ON - input is connected to GND</li>
|
||||
</ul>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Dry contact open
|
||||
</td>
|
||||
<td>
|
||||
OFF | ON
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
</td>
|
||||
<td>The state of the ratgdo trigger door open input.
|
||||
<ul>
|
||||
<li>OFF - input is floating</li>
|
||||
<li>ON - input is connected to GND</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Learn
|
||||
</td>
|
||||
<td>
|
||||
OFF | ON
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<esp-switch color="var(--primary-color,currentColor)"></esp-switch>
|
||||
</td>
|
||||
<td>
|
||||
Put the GDO in learn mode (same as pressing the learn button)
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Light
|
||||
</td>
|
||||
<td>
|
||||
OFF | ON
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
<esp-switch color="var(--primary-color,currentColor)"></esp-switch>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
Toggle the GDO's light on or off.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Lock remotes
|
||||
</td>
|
||||
<td>
|
||||
UNLOCKED
|
||||
</td>
|
||||
<td>
|
||||
|
||||
<button class="rnd">
|
||||
🔐
|
||||
</button>
|
||||
|
||||
<button class="rnd">
|
||||
🔓
|
||||
</button>
|
||||
|
||||
<button class="rnd">
|
||||
↑
|
||||
</button>
|
||||
</td>
|
||||
<td>
|
||||
Lockout the wireless remotes.
|
||||
<ul>
|
||||
<li><button class="rnd">🔐</button> - lock the remotes. Wireless remotes will be ignored by
|
||||
the GDO.</li>
|
||||
<li><button class="rnd">🔓</button> - unlock the remotes. The GDO will respond to commands
|
||||
from wireless remotes.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Motion
|
||||
</td>
|
||||
<td>
|
||||
OFF | ON
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
ON - Motion was detected by the wall control panel (on Sec + 1.0, triggers when the light turns
|
||||
on)
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Motor
|
||||
</td>
|
||||
<td>
|
||||
OFF | ON
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
Indicates whether the GDO motor is running or not.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Obstruction
|
||||
</td>
|
||||
<td>
|
||||
OFF | ON
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
Indicates whether the obstruction sensor beam is blocked by an object or not.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Opening duration
|
||||
</td>
|
||||
<td>
|
||||
0.0 s
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
<div class="range">
|
||||
<label>
|
||||
0
|
||||
</label>
|
||||
<input type="range" name="number-opening_duration" id="number-opening_duration" step="0.1"
|
||||
min="0" max="180">
|
||||
<label>
|
||||
180
|
||||
</label>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
The amount of time it takes for the door to open (learned after one door cycle)
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Openings
|
||||
</td>
|
||||
<td>
|
||||
200 openings
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
The number of times the GDO has cycled
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Paired Devices
|
||||
</td>
|
||||
<td>
|
||||
6
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
The number of clients which are paired with the GDO.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Query Paired Devices
|
||||
</td>
|
||||
<td>
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
<button class="rnd">
|
||||
☐
|
||||
</button>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
Send a query to the GDO to get the number of paired devices.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Query openings
|
||||
</td>
|
||||
<td>
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
<button class="rnd">
|
||||
☐
|
||||
</button>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
Send a query to the GDO to get the current Openings count. This value is automatically updated
|
||||
during normal status updates.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Query status
|
||||
</td>
|
||||
<td>
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
<button class="rnd">
|
||||
☐
|
||||
</button>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
Get the current physical status of the garage door, light, wireless lockout, learn, openings,
|
||||
etc.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Restart
|
||||
</td>
|
||||
<td>
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
<button class="rnd">
|
||||
☐
|
||||
</button>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
Restart ratgdo
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Rolling code counter
|
||||
</td>
|
||||
<td>
|
||||
22 codes
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<div class="range">
|
||||
<label>
|
||||
0
|
||||
</label>
|
||||
<input type="number" name="number-rolling_code_counter" id="number-rolling_code_counter"
|
||||
step="1" min="0" max="268435500" value="55">
|
||||
<label>
|
||||
268435500
|
||||
</label>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
The current rolling code counter for Security + 2.0, it's increemnted for each operation.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Safe mode boot
|
||||
</td>
|
||||
<td>
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
<button class="rnd">
|
||||
☐
|
||||
</button>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
Restarts the device in a safe mode, useful if the device is missbehaving/crashing in a way that is preventing an Over-The-Air update to be performed.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
Sync
|
||||
</td>
|
||||
<td>
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
<button class="rnd">
|
||||
☐
|
||||
</button>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
Manually sync the ratgdo client with the GDO. If the GDO isn't responding to commands from
|
||||
ratgdo, a sync should force them to be on the same rolling code counter.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="odd">
|
||||
<td>
|
||||
Toggle door
|
||||
</td>
|
||||
<td>
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
<button class="rnd">
|
||||
☐
|
||||
</button>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
Cycles the door regardless of it's current state.
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="footer">
|
||||
<a href="https://esphome.io">ESPHome</a>
|
||||
— Installer powered by
|
||||
<a href="https://esphome.github.io/esp-web-tools/">ESP Web Tools</a>.
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
document.querySelectorAll('input[name="type"]').forEach((radio) =>
|
||||
radio.addEventListener("change", () => {
|
||||
const button = document.querySelector("esp-web-install-button");
|
||||
button.manifest = `./${radio.value}-manifest.json`;
|
||||
|
||||
document.querySelectorAll(".info").forEach((info) => {
|
||||
info.classList.add("hidden");
|
||||
});
|
||||
document
|
||||
.querySelector(`.info.${radio.value}`)
|
||||
.classList.remove("hidden");
|
||||
})
|
||||
);
|
||||
document
|
||||
.querySelector('input[name="type"]:checked')
|
||||
.dispatchEvent(new Event("change"));
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue