mirror of
https://github.com/emsesp/EMS-ESP32.git
synced 2025-12-07 16:29:51 +03:00
1893 lines
102 KiB
HTML
1893 lines
102 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
|
|
<title>ESPurna 0.0.0</title>
|
|
<meta charset="utf-8" />
|
|
<!-- shortcut::html/favicon.ico -->
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<!-- build:css style.css -->
|
|
<link rel="stylesheet" href="vendor/pure-1.0.0.min.css" />
|
|
<link rel="stylesheet" href="vendor/pure-grids-responsive-1.0.0.min.css" />
|
|
<link rel="stylesheet" href="vendor/side-menu.css" />
|
|
<!-- removeIf(!light) -->
|
|
<link rel="stylesheet" href="vendor/jquery.wheelcolorpicker-3.0.3.css" />
|
|
<!-- endRemoveIf(!light) -->
|
|
<!-- removeIf(!rfm69) -->
|
|
<link rel="stylesheet" href="vendor/datatables-1.10.16.css" />
|
|
<!-- endRemoveIf(!rfm69) -->
|
|
<link rel="stylesheet" href="custom.css" />
|
|
<!-- endbuild -->
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div id="password" class="webmode">
|
|
|
|
<div class="content">
|
|
|
|
<form id="formPassword" class="pure-form" autocomplete="off">
|
|
|
|
<div class="panel block" id="panel-password">
|
|
|
|
<div class="header">
|
|
<h1>SECURITY</h1>
|
|
<h2>Before using this device you have to change the default password for the user <strong>admin</strong>.
|
|
This password will be used for the <strong>AP mode hotspot</strong>, the <strong>web
|
|
interface</strong> (where you are now) and the <strong>over-the-air updates</strong>.</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4" for="adminPass1">New Password</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="adminPass1" minlength="8" maxlength="63"
|
|
type="password" tabindex="1" autocomplete="false" spellcheck="false" required />
|
|
<span class="no-select password-reveal"></span>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4" for="adminPass2">Repeat password</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="adminPass2" minlength="8" maxlength="63"
|
|
type="password" tabindex="2" autocomplete="false" spellcheck="false" required />
|
|
<span class="no-select password-reveal"></span>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<div class="pure-g">
|
|
<div class="pure-u-1 pure-u-lg-1 hint">
|
|
Password must be <strong>8..63 characters</strong> (numbers and letters and any of
|
|
these special characters: _,.;:~!?@#$%^&*<>\|(){}[]) and have at least
|
|
<strong>one lowercase</strong> and <strong>one uppercase</strong> or <strong>one number</strong>.</div>
|
|
</div>
|
|
|
|
|
|
<div class="pure-g">
|
|
<button class="pure-u-11-24 pure-u-lg-1-4 pure-button button-generate-password" type="button"
|
|
title="Generate password based on password policy">Generate</button>
|
|
<div class="pure-u-2-24 pure-u-lg-1-2"></div>
|
|
<button class="pure-u-11-24 pure-u-lg-1-4 pure-button button-update-password" type="button"
|
|
title="Save new password">Save</button>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
</div> <!-- content -->
|
|
|
|
</div>
|
|
|
|
<div id="layout" class="webmode">
|
|
|
|
<a id="menuLink" class="menu-link">
|
|
<span></span>
|
|
</a>
|
|
|
|
<div id="menu">
|
|
<div class="pure-menu">
|
|
|
|
<span class="pure-menu-heading" name="hostname">HOSTNAME</span>
|
|
<span class="pure-menu-heading small" name="title">ESPurna 0.0.0</span>
|
|
|
|
<ul class="pure-menu-list">
|
|
|
|
<li class="pure-menu-item">
|
|
<a href="#" class="pure-menu-link" data="panel-status">STATUS</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item menu-item-divided">
|
|
<a href="#" class="pure-menu-link" data="panel-boiler">BOILER</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item menu-item-divided">
|
|
<a href="#" class="pure-menu-link" data="panel-general">GENERAL</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item module module-dcz">
|
|
<a href="#" class="pure-menu-link" data="panel-domoticz">DOMOTICZ</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item module module-ha">
|
|
<a href="#" class="pure-menu-link" data="panel-ha">HASS</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item module module-idb">
|
|
<a href="#" class="pure-menu-link" data="panel-idb">INFLUXDB</a>
|
|
</li>
|
|
|
|
<!-- removeIf(!light) -->
|
|
<li class="pure-menu-item module module-color">
|
|
<a href="#" class="pure-menu-link" data="panel-color">LIGHTS</a>
|
|
</li>
|
|
<!-- endRemoveIf(!light) -->
|
|
|
|
<!-- removeIf(!rfm69) -->
|
|
<li class="pure-menu-item module module-rfm69">
|
|
<a href="#" class="pure-menu-link" data="panel-mapping">MAPPING</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item module module-rfm69">
|
|
<a href="#" class="pure-menu-link" data="panel-messages">MESSAGES</a>
|
|
</li>
|
|
<!-- endRemoveIf(!rfm69) -->
|
|
|
|
<li class="pure-menu-item module module-mqtt">
|
|
<a href="#" class="pure-menu-link" data="panel-mqtt">MQTT</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item module module-ntp">
|
|
<a href="#" class="pure-menu-link" data="panel-ntp">NTP</a>
|
|
</li>
|
|
|
|
<!-- removeIf(!rfbridge) -->
|
|
<li class="pure-menu-item module module-rfb">
|
|
<a href="#" class="pure-menu-link" data="panel-rfb">RF</a>
|
|
</li>
|
|
<!-- endRemoveIf(!rfbridge) -->
|
|
|
|
<li class="pure-menu-item module module-sch">
|
|
<a href="#" class="pure-menu-link" data="panel-schedule">SCHEDULE</a>
|
|
</li>
|
|
|
|
<!-- removeIf(!sensor) -->
|
|
<li class="pure-menu-item module module-sns">
|
|
<a href="#" class="pure-menu-link" data="panel-sns">SENSORS</a>
|
|
</li>
|
|
<!-- endRemoveIf(!sensor) -->
|
|
|
|
<li class="pure-menu-item module module-relay">
|
|
<a href="#" class="pure-menu-link" data="panel-relay">SWITCHES</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item module module-tspk">
|
|
<a href="#" class="pure-menu-link" data="panel-thingspeak">THINGSPEAK</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item">
|
|
<a href="#" class="pure-menu-link" data="panel-wifi">WIFI</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item menu-item-divided">
|
|
<a href="#" class="pure-menu-link" data="panel-admin">ADMIN</a>
|
|
</li>
|
|
|
|
<li class="pure-menu-item module module-dbg">
|
|
<a href="#" class="pure-menu-link" data="panel-dbg">DEBUG</a>
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
<div class="main-buttons">
|
|
<button class="pure-button button-update">Save</button>
|
|
<button class="pure-button button-reconnect">Reconnect</button>
|
|
<button class="pure-button button-reboot">Reboot</button>
|
|
</div>
|
|
|
|
<div class="footer">
|
|
© 2016-2018<br />
|
|
Xose Pérez<br />
|
|
<a href="https://twitter.com/xoseperez" target="_blank">@xoseperez</a><br />
|
|
<a href="http://tinkerman.cat" target="_blank">http://tinkerman.cat</a><br />
|
|
<a href="https://github.com/xoseperez/espurna" target="_blank">ESPurna @ GitHub</a><br />
|
|
GPLv3 license<br />
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="content">
|
|
|
|
<div class="panel block" id="panel-status">
|
|
|
|
<div class="header">
|
|
<h1>STATUS</h1>
|
|
<h2>Current configuration</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<form class="pure-form pure-form-aligned">
|
|
<fieldset>
|
|
|
|
<div id="relays"></div>
|
|
|
|
<!-- removeIf(!light) -->
|
|
<div id="colors"></div>
|
|
<div id="cct"></div>
|
|
<div id="channels"></div>
|
|
<!-- endRemoveIf(!light) -->
|
|
|
|
<!-- removeIf(!sensor) -->
|
|
<div id="magnitudes"></div>
|
|
<!-- endRemoveIf(!sensor) -->
|
|
|
|
<!-- removeIf(!rfm69) -->
|
|
<div class="pure-g module module-rfm69">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Packet count</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input class="pure-u-1" type="text" name="packetCount"
|
|
readonly /></div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-rfm69">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Node count</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input class="pure-u-1" type="text" name="nodeCount"
|
|
readonly /></div>
|
|
</div>
|
|
<!-- endRemoveIf(!rfm69) -->
|
|
|
|
<div class="pure-u-1 pure-u-lg-1-2 state">
|
|
|
|
<div class="pure-u-1-2">Manufacturer</div>
|
|
<div class="pure-u-11-24"><span class="right" name="manufacturer"></span></div>
|
|
|
|
<div class="pure-u-1-2">Device</div>
|
|
<div class="pure-u-11-24"><span class="right" name="device"></span></div>
|
|
|
|
<div class="pure-u-1-2">Chip ID</div>
|
|
<div class="pure-u-11-24"><span class="right" name="chipid"></span></div>
|
|
|
|
<div class="pure-u-1-2">Wifi MAC</div>
|
|
<div class="pure-u-11-24"><span class="right" name="mac"></span></div>
|
|
|
|
<div class="pure-u-1-2">SDK version</div>
|
|
<div class="pure-u-11-24"><span class="right" name="sdk"></span></div>
|
|
|
|
<div class="pure-u-1-2">Core version</div>
|
|
<div class="pure-u-11-24"><span class="right" name="core"></span></div>
|
|
|
|
<div class="pure-u-1-2">Firmware name</div>
|
|
<div class="pure-u-11-24"><span class="right" name="app_name"></span></div>
|
|
|
|
<div class="pure-u-1-2">Firmware version</div>
|
|
<div class="pure-u-11-24"><span class="right" name="app_version"></span></div>
|
|
|
|
<div class="pure-u-1-2">Firmware revision</div>
|
|
<div class="pure-u-11-24"><span class="right" name="app_revision"></span></div>
|
|
|
|
<div class="pure-u-1-2">Firmware build date</div>
|
|
<div class="pure-u-11-24"><span class="right" name="app_build"></span></div>
|
|
|
|
<div class="pure-u-1-2">Firmware size</div>
|
|
<div class="pure-u-11-24"><span class="right" name="sketch_size" post=" bytes"></span></div>
|
|
|
|
<div class="pure-u-1-2">Free space</div>
|
|
<div class="pure-u-11-24"><span class="right" name="free_size" post=" bytes"></span></div>
|
|
|
|
</div>
|
|
|
|
<div class="pure-u-1 pure-u-lg-11-24 state">
|
|
|
|
<div class="pure-u-1-2">Network</div>
|
|
<div class="pure-u-11-24"><span class="right" name="network"></span></div>
|
|
|
|
<div class="pure-u-1-2">BSSID</div>
|
|
<div class="pure-u-11-24"><span class="right" name="bssid"></span></div>
|
|
|
|
<div class="pure-u-1-2">Channel</div>
|
|
<div class="pure-u-11-24"><span class="right" name="channel"></span></div>
|
|
|
|
<div class="pure-u-1-2">RSSI</div>
|
|
<div class="pure-u-11-24"><span class="right" name="rssi"></span></div>
|
|
|
|
<div class="pure-u-1-2">IP</div>
|
|
<div class="pure-u-11-24"><a href=""><span class="right" name="deviceip"></span></a> (<a
|
|
href=""><span class="right">telnet</span></a>)</div>
|
|
|
|
<div class="pure-u-1-2">Free heap</div>
|
|
<div class="pure-u-11-24"><span class="right" name="heap" post=" bytes"></span></div>
|
|
|
|
<div class="pure-u-1-2">Load average</div>
|
|
<div class="pure-u-11-24"><span class="right" name="loadaverage"></span><span>%</span></div>
|
|
|
|
<div class="pure-u-1-2">VCC</div>
|
|
<div class="pure-u-11-24"><span class="right" name="vcc">? </span><span>mV</span></div>
|
|
|
|
<div class="pure-u-1-2 module module-mqtt">MQTT Status</div>
|
|
<div class="pure-u-11-24 module module-mqtt"><span class="right" name="mqttStatus"></span></div>
|
|
|
|
<div class="pure-u-1-2 module module-ntp">NTP Status</div>
|
|
<div class="pure-u-11-24 module module-ntp"><span class="right" name="ntpStatus"></span></div>
|
|
|
|
<div class="pure-u-1-2 module module-ntp">Current time</div>
|
|
<div class="pure-u-11-24 module module-ntp"><span class="right" name="now"></span></div>
|
|
|
|
<div class="pure-u-1-2">Uptime</div>
|
|
<div class="pure-u-11-24"><span class="right" name="uptime"></span></div>
|
|
|
|
<div class="pure-u-1-2">Last update</div>
|
|
<div class="pure-u-11-24"><span class="right" name="ago">?</span><span> seconds ago</span></div>
|
|
|
|
</div>
|
|
|
|
</fieldset>
|
|
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<form id="form-general" class="pure-form form-settings">
|
|
<div class="panel" id="panel-general">
|
|
|
|
<div class="header">
|
|
<h1>GENERAL</h1>
|
|
<h2>General configuration values</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Hostname</label>
|
|
<input name="hostname" class="pure-u-1 pure-u-lg-1-4" maxlength="31" type="text" action="reboot"
|
|
tabindex="1" />
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
This name will identify this device in your network
|
|
(http://<hostname>.local).<br />
|
|
Hostname may contain only the ASCII letters 'a' through 'z' (in a case-insensitive
|
|
manner), the digits '0' through '9', and the hyphen ('-'). They can neither start
|
|
or end with an hyphen.<br />
|
|
For this setting to take effect you should restart the wifi interface by clicking
|
|
the "Reconnect" button.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Double click delay</label>
|
|
<input name="btnDelay" class="pure-u-1 pure-u-lg-1-4" type="number" action="reboot" min="0"
|
|
step="100" max="1000" tabindex="6" />
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
Delay in milliseconds to detect a double click (from 0 to 1000ms).<br />
|
|
The lower this number the faster the device will respond to button clicks but the
|
|
harder it will be to get a double click.
|
|
Increase this number if you are having trouble to double click the button.
|
|
Set this value to 0 to disable double click. You won't be able to set the device in
|
|
AP mode manually but your device will respond immediately to button clicks.<br />
|
|
You will have to <strong>reboot the device</strong> after updating for this setting
|
|
to apply.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-led">
|
|
<label class="pure-u-1 pure-u-lg-1-4">LED mode</label>
|
|
<select name="ledMode0" class="pure-u-1 pure-u-lg-1-4" tabindex="7">
|
|
<option value="1">WiFi status</option>
|
|
<option value="8">Relay status</option>
|
|
<option value="0">MQTT managed</option>
|
|
<option value="4">Find me</option>
|
|
<option value="9">Relay & WiFi</option>
|
|
<option value="5">Find me & WiFi</option>
|
|
<option value="6">Always ON</option>
|
|
<option value="7">Always OFF</option>
|
|
</select>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
This setting defines the behaviour of the main LED in the board.<br />
|
|
When in "WiFi status" it will blink at 1Hz when trying to connect. If successfully
|
|
connected it will briefly blink every 5 seconds if in STA mode or every second if
|
|
in AP mode.<br />
|
|
When in "Relay status" mode the LED will be ON whenever any relay is ON, and OFF
|
|
otherwise. This is global status notification.<br />
|
|
When in "MQTT managed" mode you will be able to set the LED state sending a message
|
|
to "<base_topic>/led/0/set" with a payload of 0, 1 or 2 (to toggle it).<br />
|
|
When in "Find me" mode the LED will be ON when all relays are OFF. This is meant to
|
|
locate switches at night.<br />
|
|
When in "Relay & WiFi" mode it will follow the WiFi status but will stay mostly
|
|
off when relays are OFF, and mostly ON when any of them is ON.<br />
|
|
When in "Find me & WiFi" mode is the opposite of the "Relay & WiFi", it
|
|
will follow the WiFi status but will stay mostly on when relays are OFF, and mostly
|
|
OFF when any of them is ON.<br />
|
|
"Always ON" and "Always OFF" modes are self-explanatory.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-alexa">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Alexa integration</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="alexaEnabled" /></div>
|
|
</div>
|
|
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<form id="form-relay" class="pure-form form-settings">
|
|
<div class="panel" id="panel-relay">
|
|
|
|
<div class="header">
|
|
<h1>SWITCHES</h1>
|
|
<h2>Switch / relay configuration</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<legend class="module module-multirelay">General</legend>
|
|
|
|
<div class="pure-g module module-multirelay">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Switch sync mode</label>
|
|
<select name="relaySync" class="pure-u-1 pure-u-lg-3-4" tabindex="3">
|
|
<option value="0">No synchronisation</option>
|
|
<option value="1">Zero or one switches active</option>
|
|
<option value="2">One and just one switch active</option>
|
|
<option value="3">All synchronised</option>
|
|
</select>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Define how the different switches should be
|
|
synchronized.</div>
|
|
</div>
|
|
|
|
<div id="relayConfig"></div>
|
|
|
|
</fieldset>
|
|
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<!-- removeIf(!light) -->
|
|
<form id="form-color" class="pure-form form-settings">
|
|
<div class="panel" id="panel-color">
|
|
|
|
<div class="header">
|
|
<h1>LIGHTS</h1>
|
|
<h2>Lights configuration</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Use color</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="useColor" action="reload"
|
|
tabindex="8" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Use the first three channels as RGB channels.
|
|
This will also enable the color picker in the web UI. Will only work if the device
|
|
has at least 3 dimmable channels.<br />Reload the page to update the web interface.</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Use RGB picker</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="useRGB" action="reload"
|
|
tabindex="11" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Use RGB color picker if enabled (plus
|
|
brightness), otherwise use HSV (hue-saturation-value) style</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Use white channel</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="useWhite" action="reload"
|
|
tabindex="9" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Use forth dimmable channel as (cold) white
|
|
light calculated out of the RGB values.<br />Will only work if the device has at
|
|
least 4 dimmable channels.<br />Enabling this will render useless the "Channel 4"
|
|
slider in the status page.<br />Reload the page to update the web interface.</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Use white color temperature</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="useCCT" action="reload"
|
|
tabindex="10" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Use fifth dimmable channel as warm white light
|
|
and the forth dimmable channel as cold white.<br />Will only work if the device has
|
|
at least 5 dimmable channels and "white channel" above is also ON.<br />Enabling
|
|
this will render useless the "Channel 5" slider in the status page.<br />Reload the
|
|
page to update the web interface.</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Use gamma correction</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="useGamma" tabindex="11" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Use gamma correction for RGB channels.<br />Will
|
|
only work if "use colorpicker" above is also ON.</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Use CSS style</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="useCSS" tabindex="12" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Use CSS style to report colors to MQTT and
|
|
REST API. <br />Red will be reported as "#FF0000" if ON, otherwise "255,0,0"</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Color transitions</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="useTransitions"
|
|
tabindex="13" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">If enabled color changes will be smoothed.</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Transition time</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input class="pure-u-1" type="number" name="lightTime"
|
|
min="10" max="5000" tabindex="14" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Time in millisecons to transition from one
|
|
color to another.</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<div class="pure-u-1 pure-u-lg-1-4"><label>MQTT group</label></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4"><input name="mqttGroupColor" class="pure-u-1"
|
|
tabindex="15" action="reconnect" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Sync color between different lights.</div>
|
|
</div>
|
|
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- endRemoveIf(!light) -->
|
|
|
|
<form id="form-admin" class="pure-form form-settings">
|
|
<div class="panel" id="panel-admin">
|
|
|
|
<div class="header">
|
|
<h1>ADMINISTRATION</h1>
|
|
<h2>Device administration and security settings</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Settings</label>
|
|
<div class="pure-u-1-3 pure-u-lg-1-4"><button type="button" class="pure-button button-settings-backup pure-u-23-24">Backup</button></div>
|
|
<div class="pure-u-1-3 pure-u-lg-1-4"><button type="button" class="pure-button button-settings-restore pure-u-23-24">Restore</button></div>
|
|
<div class="pure-u-1-3 pure-u-lg-1-4"><button type="button" class="pure-button button-settings-factory pure-u-1">Factory
|
|
Reset</button></div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Admin password</label>
|
|
<input name="adminPass1" class="pure-u-1 pure-u-lg-3-4" placeholder="New password"
|
|
minlength="8" maxlength="63" type="password" action="reboot" tabindex="11"
|
|
autocomplete="false" spellcheck="false" />
|
|
<span class="no-select password-reveal"></span>
|
|
<div class="pure-u-1 pure-u-lg-1-4"></div>
|
|
<input name="adminPass2" class="pure-u-1 pure-u-lg-3-4" placeholder="Repeat password"
|
|
minlength="8" maxlength="63" type="password" action="reboot" tabindex="12"
|
|
autocomplete="false" spellcheck="false" />
|
|
<span class="no-select password-reveal"></span>
|
|
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
The administrator password is used to access this web interface (user 'admin'), but
|
|
also to connect to the device when in AP mode or to flash a new firmware
|
|
over-the-air (OTA).<br />
|
|
It must be <strong>8..63 characters</strong> (numbers and letters and any of these
|
|
special characters: _,.;:~!?@#$%^&*<>\|(){}[]) and have at least <strong>one
|
|
lowercase</strong> and <strong>one uppercase</strong> or <strong>one number</strong>.</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">HTTP port</label>
|
|
<input name="webPort" class="pure-u-1 pure-u-lg-1-4" type="text" action="reboot"
|
|
tabindex="13" />
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
This is the port for the web interface and API requests.
|
|
If different than 80 (standard HTTP port) you will have to add it explicitly to
|
|
your requests: http://myip:myport/
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable WS Auth</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="wsAuth" /></div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-api">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable HTTP API</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="apiEnabled" /></div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-api">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Restful API</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="apiRestFul" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
If enabled, API requests to change a status (like a relay) must be done using PUT.
|
|
If disabled you can issue them as GET requests (easier from a browser).
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-api">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Real time API</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="apiRealTime" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
By default, some magnitudes are being preprocessed and filtered to avoid spurious
|
|
values.
|
|
If you want to get real-time values (not preprocessed) in the API turn on this
|
|
setting.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-api">
|
|
<label class="pure-u-1 pure-u-lg-1-4">HTTP API Key</label>
|
|
<input name="apiKey" class="pure-u-3-4 pure-u-lg-1-2" type="text" tabindex="14" />
|
|
<div class="pure-u-1-4 pure-u-lg-1-4"><button type="button" class="pure-button button-apikey pure-u-23-24">Auto</button></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
This is the key you will have to pass with every HTTP request to the API, either to
|
|
get or write values.
|
|
All API calls must contain the <strong>apikey</strong> parameter with the value
|
|
above.
|
|
To know what APIs are enabled do a call to <strong>/apis</strong>.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-telnet">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable TELNET</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="telnetSTA" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Turn ON to be able to telnet to your device
|
|
while connected to your home router.<br />TELNET is always enabled in AP mode.</div>
|
|
</div>
|
|
|
|
|
|
<div class="pure-g module module-nofuss">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Automatic remote updates (NoFUSS)</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="nofussEnabled" /></div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-nofuss">
|
|
<label class="pure-u-1 pure-u-lg-1-4">NoFUSS server</label>
|
|
<input name="nofussServer" class="pure-u-1 pure-u-lg-3-4" type="text" tabindex="15" />
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">This name address of the NoFUSS server for
|
|
automatic remote updates (see https://bitbucket.org/xoseperez/nofuss).</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Upgrade</label>
|
|
<input class="pure-u-1-2 pure-u-lg-1-2" name="filename" type="text" readonly />
|
|
<div class="pure-u-1-4 pure-u-lg-1-8"><button type="button" class="pure-button button-upgrade-browse pure-u-23-24">Browse</button></div>
|
|
<div class="pure-u-1-4 pure-u-lg-1-8"><button type="button" class="pure-button button-upgrade pure-u-23-24">Upgrade</button></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">The device has <span name="free_size"></span>
|
|
bytes available for OTA updates. If your image is larger than this consider doing a
|
|
<a href="https://github.com/xoseperez/espurna/wiki/TwoStepUpdates" target="_blank"><strong>two-step
|
|
update</strong></a>.</div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4"><progress id="upgrade-progress"></progress></div>
|
|
<input name="upgrade" type="file" tabindex="16" />
|
|
</div>
|
|
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<form id="form-wifi" class="pure-form form-settings">
|
|
<div class="panel" id="panel-wifi">
|
|
|
|
<div class="header">
|
|
<h1>WIFI</h1>
|
|
<h2>You can configure up to 5 different WiFi networks. The device will try to connect in order
|
|
of signal strength.</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<legend>General</legend>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Scan networks</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="wifiScan" tabindex="1" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
ESPurna will scan for visible WiFi SSIDs and try to connect to networks defined
|
|
below in order of <strong>signal strength</strong>, even if multiple AP share the
|
|
same SSID.
|
|
When disabled, ESPurna will try to connect to the networks in the same order they
|
|
are listed below.
|
|
Disable this option if you are <strong>connecting to a single access point</strong>
|
|
(or router) or to a <strong>hidden SSID</strong>.
|
|
</div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<button class="pure-button button-wifi-scan" type="button">Scan now</button>
|
|
<div class="pure-u-0 pure-u-lg-1-4 scan loading"></div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<span class="pure-u-1 terminal" id="scanResult" name="scanResult"></span>
|
|
</div>
|
|
|
|
<legend>Networks</legend>
|
|
|
|
<div id="networks"></div>
|
|
|
|
<button type="button" class="pure-button button-add-network">Add network</button>
|
|
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<form id="form-schedule" class="pure-form form-settings">
|
|
<div class="panel" id="panel-schedule">
|
|
|
|
<div class="header">
|
|
<h1>SCHEDULE</h1>
|
|
<h2>Turn switches ON and OFF based on the current time.</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<div id="schedules"></div>
|
|
|
|
<button type="button" class="pure-button button-add-switch-schedule module module-relay">Add
|
|
switch schedule</button>
|
|
<!-- removeIf(!light) -->
|
|
<button type="button" class="pure-button button-add-light-schedule module module-color">Add
|
|
channel schedule</button>
|
|
<!-- endRemoveIf(!light) -->
|
|
|
|
</fieldset>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
|
|
<!-- removeIf(!rfm69) -->
|
|
<form id="form-mapping" class="pure-form form-settings">
|
|
<div class="panel" id="panel-mapping">
|
|
|
|
<div class="header">
|
|
<h1>MAPPING</h1>
|
|
<h2>
|
|
Configure the map between nodeID/key and MQTT topic. Messages from the given nodeID with
|
|
the given key will be forwarded to the specified topic.
|
|
You can also configure a default topic using {nodeid} and {key} as placeholders, if the
|
|
default topic is empty messages without defined map will be discarded.
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<legend>Default topic</legend>
|
|
|
|
<div class="pure-g">
|
|
<input name="rfm69Topic" type="text" class="pure-u-23-24" value="" size="8" tabindex="41"
|
|
placeholder="Default MQTT Topic (use {nodeid} and {key} as placeholders)">
|
|
</div>
|
|
|
|
<legend>Specific topics</legend>
|
|
|
|
<div id="mapping"></div>
|
|
|
|
<button type="button" class="pure-button button-add-mapping">Add</button>
|
|
|
|
</fieldset>
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
|
|
<form id="form-messages" class="pure-form">
|
|
<div class="panel" id="panel-messages">
|
|
<div class="header">
|
|
<h1>MESSAGES</h1>
|
|
<h2>
|
|
Messages being received. Previous messages are not displayed.
|
|
You have to keep the page open in order to keep receiving them.
|
|
You can filter/unfilter by clicking on the values.
|
|
Left click on a value to show only rows that match that value, middle click to show all
|
|
rows but those matching that value.
|
|
Filtered colums have red headers.
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<table id="packets" class="display" cellspacing="0">
|
|
<thead>
|
|
<tr>
|
|
<th>Timestamp</th>
|
|
<th>SenderID</th>
|
|
<th>PacketID</th>
|
|
<th>TargetID</th>
|
|
<th>Key</th>
|
|
<th>Value</th>
|
|
<th>RSSI</th>
|
|
<th>Duplicates</th>
|
|
<th>Missing</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
|
|
<button type="button" class="pure-button button-clear-filters">Clear filters</button>
|
|
<button type="button" class="pure-button button-clear-messages">Clear messages</button>
|
|
<button type="button" class="pure-button button-clear-counts">Clear counts</button>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- endRemoveIf(!rfm69) -->
|
|
|
|
<form id="form-mqtt" class="pure-form form-settings">
|
|
<div class="panel" id="panel-mqtt">
|
|
|
|
<div class="header">
|
|
<h1>MQTT</h1>
|
|
<h2>Configure an <strong>MQTT broker</strong> in your network and you will be able to change
|
|
the switch status via an MQTT message.</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable MQTT</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="mqttEnabled" tabindex="30" /></div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">MQTT Broker</label>
|
|
<input class="pure-u-1 pure-u-lg-1-4" name="mqttServer" type="text" tabindex="21"
|
|
placeholder="IP or address of your broker" />
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">MQTT Port</label>
|
|
<input class="pure-u-1 pure-u-lg-1-4" name="mqttPort" type="text" tabindex="22" value="1883" />
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">MQTT User</label>
|
|
<input class="pure-u-1 pure-u-lg-1-4" name="mqttUser" type="text" tabindex="23"
|
|
placeholder="Leave blank if no user" autocomplete="off" />
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">MQTT Password</label>
|
|
<input class="pure-u-1 pure-u-lg-1-4" name="mqttPassword" type="password" tabindex="24"
|
|
placeholder="Leave blank if no pass" autocomplete="new-password" spellcheck="false" />
|
|
<span class="no-select password-reveal"></span>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">MQTT Client ID</label>
|
|
<input class="pure-u-1 pure-u-lg-1-4" name="mqttClientID" type="text" tabindex="25" />
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
If left empty the firmware will generate a client ID based on the serial number of
|
|
the chip.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">MQTT QoS</label>
|
|
<select class="pure-u-1 pure-u-lg-1-4" name="mqttQoS" tabindex="26">
|
|
<option value="0">0: At most once</option>
|
|
<option value="1">1: At least once</option>
|
|
<option value="2">2: Exactly once</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">MQTT Retain</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="mqttRetain" tabindex="27" /></div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">MQTT Keep Alive</label>
|
|
<input class="pure-u-1 pure-u-lg-1-4" type="number" name="mqttKeep" min="10" max="3600"
|
|
tabindex="28" />
|
|
</div>
|
|
|
|
<div class="pure-g module module-mqttssl">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Use secure connection (SSL)</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="mqttUseSSL" tabindex="29" /></div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-mqttssl">
|
|
<label class="pure-u-1 pure-u-lg-1-4">SSL Fingerprint</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="mqttFP" type="text" maxlength="59" tabindex="30" />
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
This is the fingerprint for the SSL certificate of the server.<br />
|
|
You can get it using <a href="https://www.grc.com/fingerprints.htm" target="_blank">https://www.grc.com/fingerprints.htm</a><br />
|
|
or using openssl from a linux box by typing:<br />
|
|
<pre>$ openssl s_client -connect <host>:<port> < /dev/null 2>/dev/null | openssl x509 -fingerprint -noout -in /dev/stdin</pre>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">MQTT Root Topic</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="mqttTopic" type="text" tabindex="31" />
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
This is the root topic for this device. The {hostname} and {mac} placeholders will
|
|
be replaced by the device hostname and MAC address.<br />
|
|
- <strong><root>/relay/#/set</strong> Send a 0 or a 1 as a payload to this
|
|
topic to switch it on or off. You can also send a 2 to toggle its current state.
|
|
Replace # with the switch ID (starting from 0). If the board has only one switch it
|
|
will be 0.<br />
|
|
<!-- removeIf(!light) -->
|
|
<span class="module module-color">- <strong><root>/rgb/set</strong> Set the
|
|
color using this topic, your can either send an "#RRGGBB" value or
|
|
"RRR,GGG,BBB" (0-255 each).<br /></span>
|
|
<span class="module module-color">- <strong><root>/hsv/set</strong> Set the
|
|
color using hue (0-360), saturation (0-100) and value (0-100) values, comma
|
|
separated.<br /></span>
|
|
<span class="module module-color">- <strong><root>/brightness/set</strong>
|
|
Set the brighness (0-255).<br /></span>
|
|
<span class="module module-color">- <strong><root>/channel/#/set</strong> Set
|
|
the value for a single color channel (0-255). Replace # with the channel ID
|
|
(starting from 0 and up to 4 for RGBWC lights).<br /></span>
|
|
<span class="module module-color">- <strong><root>/mired/set</strong> Set the
|
|
temperature color in mired.<br /></span>
|
|
<!-- endRemoveIf(!light) -->
|
|
- <strong><root>/status</strong> The device will report a 1 to this topic
|
|
every few minutes. Upon MQTT disconnecting this will be set to 0.<br />
|
|
- Other values reported (depending on the build) are: <strong>firmware</strong> and
|
|
<strong>version</strong>, <strong>hostname</strong>, <strong>IP</strong>, <strong>MAC</strong>,
|
|
signal strenth (<strong>RSSI</strong>), <strong>uptime</strong> (in seconds),
|
|
<strong>free heap</strong> and <strong>power supply</strong>.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Use JSON payload</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="mqttUseJson" tabindex="32" /></div>
|
|
<div class="pure-u-1 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-1 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
All messages (except the device status) will be included in a JSON payload along
|
|
with the timestamp and hostname
|
|
and sent under the <strong><root>/data</strong> topic.<br />
|
|
Messages will be queued and sent after 100ms, so different messages could be merged
|
|
into a single payload.<br />
|
|
Subscriptions will still be done to single topics.
|
|
</div>
|
|
</div>
|
|
|
|
</fieldset>
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
|
|
<form id="form-ntp" class="pure-form form-settings">
|
|
<div class="panel" id="panel-ntp">
|
|
|
|
<div class="header">
|
|
<h1>NTP</h1>
|
|
<h2>Configure your NTP (Network Time Protocol) servers and local configuration to keep your
|
|
device time up to the second for your location.</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Device Current Time</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="now" type="text" readonly />
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">NTP Server</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="ntpServer" type="text" tabindex="41" />
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Time Zone</label>
|
|
<select class="pure-u-1 pure-u-lg-1-4" name="ntpOffset" tabindex="42"></select>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable DST</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="ntpDST" /></div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">DST Region</label>
|
|
<select class="pure-u-1 pure-u-lg-1-4" name="ntpRegion">
|
|
<option value="0">Europe</option>
|
|
<option value="1">USA</option>
|
|
</select>
|
|
</div>
|
|
|
|
</fieldset>
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
|
|
<form id="form-domoticz" class="pure-form form-settings">
|
|
<div class="panel" id="panel-domoticz">
|
|
|
|
<div class="header">
|
|
<h1>DOMOTICZ</h1>
|
|
<h2>
|
|
Configure the connection to your Domoticz server.
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<legend>General</legend>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable Domoticz</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="dczEnabled" tabindex="30" /></div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Domoticz IN Topic</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="dczTopicIn" type="text" tabindex="31" />
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Domoticz OUT Topic</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="dczTopicOut" type="text" action="reconnect"
|
|
tabindex="32" />
|
|
</div>
|
|
|
|
<legend>Sensors & actuators</legend>
|
|
|
|
<div class="pure-g">
|
|
<div class="pure-u-1 hint">Set IDX to 0 to disable notifications from that component.</div>
|
|
</div>
|
|
|
|
<div id="dczRelays"></div>
|
|
|
|
<!-- removeIf(!sensor) -->
|
|
<div id="dczMagnitudes"></div>
|
|
<!-- endRemoveIf(!sensor) -->
|
|
|
|
</fieldset>
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
|
|
<form id="form-ha" class="pure-form form-settings">
|
|
<div class="panel" id="panel-ha">
|
|
|
|
<div class="header">
|
|
<h1>HOME ASSISTANT</h1>
|
|
<h2>
|
|
Add this device to your Home Assistant.
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
<fieldset>
|
|
|
|
<legend>Discover</legend>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Discover</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="haEnabled" tabindex="14" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
Home Assistant auto-discovery feature. Enable and save to add the device to your HA
|
|
console.
|
|
<!-- removeIf(!light) -->
|
|
When using a colour light you might want to disable CSS style so Home Assistant can
|
|
parse the color.
|
|
<!-- endRemoveIf(!light) -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Prefix</label>
|
|
<input class="pure-u-1 pure-u-lg-1-4" name="haPrefix" type="text" tabindex="15" />
|
|
</div>
|
|
|
|
<legend>Configuration</legend>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Configuration</label>
|
|
<div class="pure-u-1-4 pure-u-lg-3-4"><button type="button" class="pure-button button-ha-config pure-u-1-3">Show</button></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
These are the settings you should copy to your Home Assistant "configuration.yaml"
|
|
file.
|
|
If any of the sections below (switch, light, sensor) already exists, do not
|
|
duplicate it,
|
|
simply copy the contents of the section below the ones already present.
|
|
</div>
|
|
</div>
|
|
<div class="pure-g">
|
|
<span class="pure-u-1 terminal" id="haConfig" name="haConfig"></span>
|
|
</div>
|
|
|
|
|
|
</fieldset>
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
|
|
<form id="form-thingspeak" class="pure-form form-settings">
|
|
<div class="panel" id="panel-thingspeak">
|
|
|
|
<div class="header">
|
|
<h1>THINGSPEAK</h1>
|
|
<h2>
|
|
Send your sensors data to Thingspeak.
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<legend>General</legend>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable Thingspeak</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="tspkEnabled" tabindex="30" /></div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Thingspeak API Key</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="tspkKey" type="text" tabindex="31" />
|
|
</div>
|
|
|
|
<legend>Sensors & actuators</legend>
|
|
|
|
<div class="pure-g">
|
|
<div class="pure-u-1 hint">Enter the field number to send each data to, 0 disable
|
|
notifications from that component.</div>
|
|
</div>
|
|
|
|
<div id="tspkRelays"></div>
|
|
|
|
<!-- removeIf(!sensor) -->
|
|
<div id="tspkMagnitudes"></div>
|
|
<!-- endRemoveIf(!sensor) -->
|
|
|
|
</fieldset>
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
|
|
<form id="form-idb" class="pure-form form-settings">
|
|
<div class="panel" id="panel-idb">
|
|
|
|
<div class="header">
|
|
<h1>INFLUXDB</h1>
|
|
<h2>
|
|
Configure the connection to your InfluxDB server. Leave the host field empty to disable
|
|
InfluxDB connection.
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable InfluxDB</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="idbEnabled" tabindex="40" /></div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Host</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="idbHost" type="text" tabindex="41" />
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Port</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="idbPort" type="text" tabindex="42" />
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Database</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="idbDatabase" type="text" tabindex="43" />
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Username</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="idbUsername" type="text" tabindex="44"
|
|
autocomplete="off" />
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Password</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="idbPassword" type="password" tabindex="45"
|
|
autocomplete="new-password" spellcheck="false" />
|
|
<span class="no-select password-reveal"></span>
|
|
</div>
|
|
|
|
</fieldset>
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
|
|
<form id="form-dbg" class="pure-form">
|
|
<div class="panel" id="panel-dbg">
|
|
|
|
<div class="header">
|
|
<h1>DEBUG LOG</h1>
|
|
<h2>
|
|
Shows debug messages from the device
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<div class="pure-g module module-cmd">
|
|
<div class="pure-u-1 hint">
|
|
Write a command and click send to execute it on the device. The output will be
|
|
shown in the debug text area below.
|
|
</div>
|
|
<input name="dbgcmd" class="pure-u-3-4" type="text" tabindex="2" />
|
|
<div class="pure-u-1-4 pure-u-lg-1-4"><button type="button" class="pure-button button-dbgcmd pure-u-23-24">Send</button></div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<textarea class="pure-u-1 terminal" id="weblog" name="weblog" wrap="off" readonly></textarea>
|
|
<div class="pure-u-1-4 pure-u-lg-1-4"><button type="button" class="pure-button button-dbg-clear pure-u-23-24">Clear</button></div>
|
|
</div>
|
|
|
|
</fieldset>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
|
|
<!-- removeIf(!sensor) -->
|
|
<form id="form-sns" class="pure-form form-settings">
|
|
<div class="panel" id="panel-sns">
|
|
|
|
<div class="header">
|
|
<h1>SENSOR CONFIGURATION</h1>
|
|
<h2>
|
|
Configure and calibrate your device sensors.
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
|
|
<fieldset>
|
|
|
|
<legend>General</legend>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Read interval</label>
|
|
<select class="pure-u-1 pure-u-lg-1-4" name="snsRead">
|
|
<option value="1">1 second</option>
|
|
<option value="6">6 seconds</option>
|
|
<option value="10">10 seconds</option>
|
|
<option value="15">15 seconds</option>
|
|
<option value="30">30 seconds</option>
|
|
<option value="60">1 minute</option>
|
|
<option value="300">5 minutes</option>
|
|
<option value="600">10 minutes</option>
|
|
<option value="900">15 minutes</option>
|
|
<option value="1800">30 minutes</option>
|
|
<option value="3600">60 minutes</option>
|
|
</select>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
Select the interval between readings. These will be filtered and averaged for the
|
|
report.
|
|
Please mind some sensors do not have fast refresh intervals. Check the sensor
|
|
datasheet to know the minimum read interval.
|
|
The default and recommended value is 6 seconds.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Report every</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input name="snsReport" class="pure-u-1" type="number"
|
|
min="1" step="1" max="60" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
Select the number of readings to average and report
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-pwr">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Save every</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input name="snsSave" class="pure-u-1" type="number"
|
|
min="0" step="1" max="200" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
Save aggregated data to EEPROM after these many reports. At the moment this only
|
|
applies to total energy readings.
|
|
Please mind: saving data to EEPROM too often will wear out the flash memory
|
|
quickly.
|
|
Set it to 0 to disable this feature (default value).
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-pwr">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Power units</label>
|
|
<select name="pwrUnits" tabindex="16" class="pure-u-1 pure-u-lg-1-4">
|
|
<option value="0">Watts (W)</option>
|
|
<option value="1">Kilowatts (kW)</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="pure-g module module-pwr">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Energy units</label>
|
|
<select name="eneUnits" tabindex="16" class="pure-u-1 pure-u-lg-1-4">
|
|
<option value="0">Joules (J)</option>
|
|
<option value="1">Kilowatts·hour (kWh)</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="pure-g module module-temperature">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Temperature units</label>
|
|
<select name="tmpUnits" tabindex="16" class="pure-u-1 pure-u-lg-1-4">
|
|
<option value="0">Celsius (°C)</option>
|
|
<option value="1">Fahrenheit (°F)</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="pure-g module module-temperature">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Temperature correction</label>
|
|
<input name="tmpCorrection" class="pure-u-1 pure-u-lg-1-4" type="number" action="reboot"
|
|
min="-100" step="0.1" max="100" tabindex="18" />
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
Temperature correction value is added to the measured value which may be inaccurate
|
|
due to many factors. The value can be negative.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-humidity">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Humidity correction</label>
|
|
<input name="humCorrection" class="pure-u-1 pure-u-lg-1-4" type="number" action="reboot"
|
|
min="-100" step="0.1" max="100" tabindex="18" />
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">
|
|
Humidity correction value is added to the measured value which may be inaccurate
|
|
due to many factors. The value can be negative.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-mics">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Calibrate gas sensor</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="snsResetCalibration"
|
|
tabindex="55" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Move this switch to ON and press "Save" to
|
|
reset gas sensor calibration. Check the sensor datasheet for calibration
|
|
conditions.</div>
|
|
</div>
|
|
|
|
<legend class="module module-hlw module-cse module-emon">Energy monitor</legend>
|
|
|
|
<div class="pure-g module module-emon">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Voltage</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4" name="pwrVoltage" type="text" tabindex="51" />
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Mains voltage in your system (in V).</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-hlw module-cse">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Expected Current</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4 pwrExpected" name="pwrExpectedC" type="text"
|
|
tabindex="52" placeholder="0" />
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">In Amperes (A). If you are using a pure
|
|
resistive load like a bulb, this will be the ratio between the two previous values,
|
|
i.e. power / voltage. You can also use a current clamp around one of the power
|
|
wires to get this value.</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-hlw module-cse">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Expected Voltage</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4 pwrExpected" name="pwrExpectedV" type="text"
|
|
tabindex="53" placeholder="0" />
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">In Volts (V). Enter your the nominal AC
|
|
voltage for your household or facility, or use multimeter to get this value.</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-hlw module-cse module-emon">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Expected Power</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4 pwrExpected" name="pwrExpectedP" type="text"
|
|
tabindex="54" placeholder="0" />
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">In Watts (W). Calibrate your sensor connecting
|
|
a pure resistive load (like a bulb) and enter here the its nominal power or use a
|
|
multimeter.</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-hlw module-cse module-emon">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Reset calibration</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="pwrResetCalibration"
|
|
tabindex="55" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Move this switch to ON and press "Save" to
|
|
revert to factory calibration values.</div>
|
|
</div>
|
|
|
|
<div class="pure-g module module-hlw module-cse module-emon">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Reset energy</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input type="checkbox" name="pwrResetE" tabindex="56" /></div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Move this switch to ON and press "Save" to set
|
|
energy count to 0.</div>
|
|
</div>
|
|
|
|
</fieldset>
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
<!-- endRemoveIf(!sensor) -->
|
|
|
|
<form id="form-boiler" class="pure-form form-settings">
|
|
<div class="panel" id="panel-boiler">
|
|
<div class="header">
|
|
<h1>BOILER</h1>
|
|
<h2>Configure the
|
|
<strong>BOILER</strong> settings. Make sure you Save after changing values.</h2>
|
|
</div>
|
|
<div class="page">
|
|
<fieldset>
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable Thermostat</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4">
|
|
<input type="checkbox" name="boilerThermostat" />
|
|
</div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Enable if you want to read/write from
|
|
Thermostat</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable Polling</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4">
|
|
<input type="checkbox" name="boilerPolling" />
|
|
</div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Polling for better support and debugging</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enable Shower</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4">
|
|
<input type="checkbox" name="boilerShower" />
|
|
</div>
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<div class="pure-u-0 pure-u-lg-1-4"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint">Monitor shower timings</div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Logging</label>
|
|
<select class="pure-u-1 pure-u-lg-1-4" name="boilerLogging" tabindex="26">
|
|
<option value="0">None</option>
|
|
<option value="1">Basic</option>
|
|
<option value="2">Verbose</option>
|
|
</select>
|
|
</div>
|
|
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<!-- removeIf(!rfbridge) -->
|
|
<form id="form-rfb" class="pure-form form-settings">
|
|
<div class="panel" id="panel-rfb">
|
|
|
|
<div class="header">
|
|
<h1>RADIO FREQUENCY</h1>
|
|
<h2>
|
|
Sonoff 433 RF Bridge & RF Link Configuration<br /><br />
|
|
This page allows you to configure the RF codes for the Sonoff RFBridge 433 and also for a
|
|
basic RF receiver.<br /><br />
|
|
To learn a new code click <strong>LEARN</strong> (the Sonoff RFBridge will beep) then press
|
|
a button on the remote, the new code should show up (and the RFBridge will double beep). If
|
|
the device double beeps but the code does not update it has not been properly learnt. Keep
|
|
trying.<br /><br />
|
|
Modify or create new codes manually and then click <strong>SAVE</strong> to store them in
|
|
the device memory. If your controlled device uses the same code to switch ON and OFF, learn
|
|
the code with the ON button and copy paste it to the OFF input box, then click SAVE on the
|
|
last one to store the value.<br /><br />
|
|
Delete any code clicking the <strong>FORGET</strong> button.
|
|
<span class="module module-rfbraw"><br /><br />You can also specify 116-chars long RAW
|
|
codes. Raw codes require a <a target="_blank" href="https://github.com/rhx/RF-Bridge-EFM8BB1">specific
|
|
firmware for for the EFM8BB1</a>.</span>
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="page">
|
|
<fieldset>
|
|
<div id="rfbNodes"></div>
|
|
</fieldset>
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
<!-- endRemoveIf(!rfbridge) -->
|
|
|
|
</div> <!-- content -->
|
|
|
|
</div> <!-- layout -->
|
|
|
|
<!-- Templates -->
|
|
|
|
<!-- removeIf(!rfbridge) -->
|
|
<div id="rfbNodeTemplate" class="template">
|
|
|
|
<legend>Switch #<span></span></legend>
|
|
|
|
<div class="pure-g">
|
|
<div class="pure-u-1 pure-u-lg-1-4"><label>Switch ON</label></div>
|
|
<input class="pure-u-1 pure-u-lg-1-3" type="text" maxlength="18" name="rfbcode" data-id="1" data-status="1" />
|
|
<div class="pure-u-1-3 pure-u-lg-1-8"><button type="button" class="pure-u-23-24 pure-button button-rfb-learn">LEARN</button></div>
|
|
<div class="pure-u-1-3 pure-u-lg-1-8"><button type="button" class="pure-u-23-24 pure-button button-rfb-send">SAVE</button></div>
|
|
<div class="pure-u-1-3 pure-u-lg-1-8"><button type="button" class="pure-u-23-24 pure-button button-rfb-forget">FORGET</button></div>
|
|
</div>
|
|
|
|
<div class="pure-g">
|
|
<div class="pure-u-1 pure-u-lg-1-4"><label>Switch OFF</label></div>
|
|
<input class="pure-u-1 pure-u-lg-1-3" type="text" maxlength="18" name="rfbcode" data-id="1" data-status="0" />
|
|
<div class="pure-u-1-3 pure-u-lg-1-8"><button type="button" class="pure-u-23-24 pure-button button-rfb-learn">LEARN</button></div>
|
|
<div class="pure-u-1-3 pure-u-lg-1-8"><button type="button" class="pure-u-23-24 pure-button button-rfb-send">SAVE</button></div>
|
|
<div class="pure-u-1-3 pure-u-lg-1-8"><button type="button" class="pure-u-23-24 pure-button button-rfb-forget">FORGET</button></div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- endRemoveIf(!rfbridge) -->
|
|
|
|
<div id="networkTemplate" class="template">
|
|
|
|
<div class="pure-g">
|
|
|
|
<label class="pure-u-1 pure-u-lg-1-4">Network SSID</label>
|
|
<div class="pure-u-5-6 pure-u-lg-2-3"><input name="ssid" type="text" action="reconnect" class="pure-u-23-24"
|
|
value="" tabindex="0" placeholder="Network SSID" required autocomplete="false" /></div>
|
|
<div class="pure-u-1-6 pure-u-lg-1-12"><button type="button" class="pure-button button-more-network pure-u-1">...</button></div>
|
|
|
|
<label class="pure-u-1 pure-u-lg-1-4 more">Password</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4 more" name="pass" type="password" action="reconnect" value="" tabindex="0"
|
|
autocomplete="new-password" spellcheck="false" />
|
|
<span class="no-select password-reveal more"></span>
|
|
|
|
<label class="pure-u-1 pure-u-lg-1-4 more">Static IP</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4 more" name="ip" type="text" action="reconnect" value="" maxlength="15"
|
|
tabindex="0" autocomplete="false" />
|
|
<div class="pure-u-0 pure-u-lg-1-4 more"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint more">Leave empty for DHCP negotiation</div>
|
|
|
|
<label class="pure-u-1 pure-u-lg-1-4 more">Gateway IP</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4 more" name="gw" type="text" action="reconnect" value="" maxlength="15"
|
|
tabindex="0" autocomplete="false" />
|
|
<div class="pure-u-0 pure-u-lg-1-4 more"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint more">Set when using a static IP</div>
|
|
|
|
<label class="pure-u-1 pure-u-lg-1-4 more">Network Mask</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4 more" name="mask" type="text" action="reconnect" value="255.255.255.0"
|
|
maxlength="15" tabindex="0" autocomplete="false" />
|
|
<div class="pure-u-0 pure-u-lg-1-4 more"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint more">Usually 255.255.255.0 for /24 networks</div>
|
|
|
|
<label class="pure-u-1 pure-u-lg-1-4 more">DNS IP</label>
|
|
<input class="pure-u-1 pure-u-lg-3-4 more" name="dns" type="text" action="reconnect" value="8.8.8.8"
|
|
maxlength="15" tabindex="0" autocomplete="false" />
|
|
<div class="pure-u-0 pure-u-lg-1-4 more"></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4 hint more">Set the Domain Name Server IP to use when using a static IP</div>
|
|
|
|
<div class="pure-u-0 pure-u-lg-1-4 more"></div>
|
|
<button class="pure-button button-del-network more" type="button">Delete network</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="scheduleTemplate" class="template">
|
|
|
|
<div class="pure-g">
|
|
|
|
<label class="pure-u-1 pure-u-lg-1-4">When time is</label>
|
|
<div class="pure-u-1-4 pure-u-lg-1-5">
|
|
<input class="pure-u-2-3" name="schHour" type="number" min="0" step="1" max="23" value="0" />
|
|
<div class="pure-u-1-4 hint center"> h</div>
|
|
</div>
|
|
<div class="pure-u-1-4 pure-u-lg-1-5">
|
|
<input class="pure-u-2-3" name="schMinute" type="number" min="0" step="1" max="59" value="0" />
|
|
<div class="pure-u-1-4 hint center"> m</div>
|
|
</div>
|
|
<div class="pure-u-0 pure-u-lg-1-3"></div>
|
|
|
|
<label class="pure-u-1 pure-u-lg-1-4">Use UTC time</label>
|
|
<div class="pure-u-1 pure-u-lg-3-4"><input type="checkbox" name="schUTC" /></div>
|
|
|
|
<div class="pure-u-0 pure-u-lg-1-2"></div>
|
|
<label class="pure-u-1 pure-u-lg-1-4">And weekday is one of</label>
|
|
<div class="pure-u-2-5 pure-u-lg-1-5">
|
|
<input class="pure-u-23-24 pure-u-lg-23-24" name="schWDs" type="text" maxlength="15" tabindex="0" value="1,2,3,4,5,6,7" />
|
|
</div>
|
|
<div class="pure-u-3-5 pure-u-lg-1-2 hint center"> 1 for Monday, 2 for Tuesday...</div>
|
|
|
|
<div id="schActionDiv" class="pure-u-1">
|
|
</div>
|
|
|
|
<label class="pure-u-1 pure-u-lg-1-4">Enabled</label>
|
|
<div class="pure-u-1 pure-u-lg-3-4"><input type="checkbox" name="schEnabled" /></div>
|
|
|
|
<div class="pure-u-1 pure-u-lg-1-2"></div>
|
|
<button class="pure-button button-del-schedule" type="button">Delete schedule</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="switchActionTemplate" class="template">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Action</label>
|
|
<div class="pure-u-1 pure-u-lg-1-5">
|
|
<select class="pure-u-1 pure-u-lg-23-24" name="schAction">
|
|
<option value="0">Turn OFF</option>
|
|
<option value="1">Turn ON</option>
|
|
<option value="2">Toggle</option>
|
|
</select>
|
|
</div>
|
|
<select class="pure-u-1 pure-u-lg-1-5 isrelay" name="schSwitch"></select>
|
|
<input type="hidden" name="schType" value="1">
|
|
</div>
|
|
|
|
<!-- removeIf(!light) -->
|
|
<div id="lightActionTemplate" class="template">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Brightness</label>
|
|
<div class="pure-u-1 pure-u-lg-1-5">
|
|
<input class="pure-u-2-3" name="schAction" type="number" min="0" step="1" max="255" value="0" />
|
|
</div>
|
|
<select class="pure-u-1 pure-u-lg-1-5 islight" name="schSwitch"></select>
|
|
<input type="hidden" name="schType" value="2">
|
|
</div>
|
|
<!-- endRemoveIf(!light) -->
|
|
|
|
<div id="relayTemplate" class="template">
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Switch #<span class="id"></span></label>
|
|
<div><input name="relay" type="checkbox" on="ON" off="OFF" /></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="relayConfigTemplate" class="template">
|
|
<legend>Switch #<span class="id"></span> (GPIO<span class="gpio"></span>)</legend>
|
|
<div class="pure-g">
|
|
<div class="pure-u-1 pure-u-lg-1-4"><label>Boot mode</label></div>
|
|
<select class="pure-u-1 pure-u-lg-3-4" name="relayBoot">
|
|
<option value="0">Always OFF</option>
|
|
<option value="1">Always ON</option>
|
|
<option value="2">Same as before</option>
|
|
<option value="3">Toggle before</option>
|
|
</select>
|
|
</div>
|
|
<div class="pure-g">
|
|
<div class="pure-u-1 pure-u-lg-1-4"><label>Pulse mode</label></div>
|
|
<select class="pure-u-1 pure-u-lg-3-4" name="relayPulse">
|
|
<option value="0">Don't pulse</option>
|
|
<option value="1">Normally OFF</option>
|
|
<option value="2">Normally ON</option>
|
|
</select>
|
|
</div>
|
|
<div class="pure-g">
|
|
<div class="pure-u-1 pure-u-lg-1-4"><label>Pulse time (s)</label></div>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input name="relayTime" class="pure-u-1" type="number" min="0" step="0.1"
|
|
max="3600" /></div>
|
|
</div>
|
|
<div class="pure-g module module-mqtt">
|
|
<div class="pure-u-1 pure-u-lg-1-4"><label>MQTT group</label></div>
|
|
<div class="pure-u-1 pure-u-lg-3-4"><input name="mqttGroup" class="pure-u-1" tabindex="0" data="0" action="reconnect" /></div>
|
|
</div>
|
|
<div class="pure-g module module-mqtt">
|
|
<div class="pure-u-1 pure-u-lg-1-4"><label>MQTT group sync</label></div>
|
|
<select class="pure-u-1 pure-u-lg-3-4" name="mqttGroupInv">
|
|
<option value="0">Same</option>
|
|
<option value="1">Inverse</option>
|
|
</select>
|
|
</div>
|
|
<div class="pure-g module module-mqtt">
|
|
<div class="pure-u-1 pure-u-lg-1-4"><label>On MQTT disconnect</label></div>
|
|
<select class="pure-u-1 pure-u-lg-3-4" name="relayOnDisc">
|
|
<option value="0">Don't change</option>
|
|
<option value="1">Turn the switch OFF</option>
|
|
<option value="2">Turn the switch ON</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="dczRelayTemplate" class="template">
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Switch</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input class="pure-u-1 pure-u-lg-23-24 dczRelayIdx" name="dczRelayIdx"
|
|
type="number" min="0" tabindex="0" data="0" /></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- removeIf(!sensor) -->
|
|
<div id="dczMagnitudeTemplate" class="template">
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Magnitude</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input class="pure-u-1 pure-u-lg-23-24 center" name="dczMagnitude" type="number"
|
|
min="0" tabindex="0" data="0" /></div>
|
|
<div class="pure-u-1 pure-u-lg-1-2 hint center"></div>
|
|
</div>
|
|
</div>
|
|
<!-- endRemoveIf(!sensor) -->
|
|
|
|
<div id="tspkRelayTemplate" class="template">
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Switch</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input class="pure-u-1 pure-u-lg-23-24" name="tspkRelay" type="number"
|
|
min="0" max="8" tabindex="0" data="0" /></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- removeIf(!sensor) -->
|
|
<div id="tspkMagnitudeTemplate" class="template">
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Magnitude</label>
|
|
<div class="pure-u-1 pure-u-lg-1-4"><input class="pure-u-1 pure-u-lg-23-24 center" name="tspkMagnitude"
|
|
type="number" min="0" max="8" tabindex="0" data="0" /></div>
|
|
<div class="pure-u-1 pure-u-lg-1-2 hint center"></div>
|
|
</div>
|
|
</div>
|
|
<!-- endRemoveIf(!sensor) -->
|
|
|
|
<!-- removeIf(!light) -->
|
|
<div id="colorTemplate" class="template">
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Color</label>
|
|
<input class="pure-u-1 pure-u-lg-1-4" data-wcp-layout="block" name="color" readonly />
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="brightnessTemplate" class="template">
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Brightness</label>
|
|
<input type="range" min="0" max="255" class="slider pure-u-lg-1-4" id="brightness">
|
|
<span class="slider brightness pure-u-lg-1-4"></span>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="channelTemplate" class="template">
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Channel #</label>
|
|
<input type="range" min="0" max="255" class="slider channels pure-u-lg-1-4" data="99">
|
|
<span class="slider pure-u-lg-1-4"></span>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="miredsTemplate" class="template">
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4">Mireds (Cold ↔ Warm)</label>
|
|
<input type="range" min="153" max="500" class="slider pure-u-lg-1-4" id="mireds">
|
|
<span class="slider mireds pure-u-lg-1-4"></span>
|
|
</div>
|
|
</div>
|
|
<!-- endRemoveIf(!light) -->
|
|
|
|
<!-- removeIf(!sensor) -->
|
|
<div id="magnitudeTemplate" class="template">
|
|
<div class="pure-g">
|
|
<label class="pure-u-1 pure-u-lg-1-4"></label>
|
|
<div class="pure-u-1 pure-u-lg-1-4">
|
|
<input class="pure-u-1 pure-u-lg-23-24 center" type="text" name="magnitude" data="256" readonly />
|
|
</div>
|
|
<div class="pure-u-1 pure-u-lg-1-2 hint center"></div>
|
|
</div>
|
|
</div>
|
|
<!-- endRemoveIf(!sensor) -->
|
|
|
|
<!-- removeIf(!rfm69) -->
|
|
<div id="nodeTemplate" class="template">
|
|
<div class="pure-g">
|
|
<div class="pure-u-md-1-6 pure-u-1-2"><input name="node" type="text" class="pure-u-11-12" value="" size="8"
|
|
tabindex="0" placeholder="Node ID" autocomplete="false"></div>
|
|
<div class="pure-u-md-1-6 pure-u-1-2"><input name="key" type="text" class="pure-u-11-12" value="" size="8"
|
|
tabindex="0" placeholder="Key"></div>
|
|
<div class="pure-u-md-1-2 pure-u-3-4"><input name="topic" type="text" class="pure-md-11-12 pure-u-23-24"
|
|
value="" size="8" tabindex="0" placeholder="MQTT Topic"></div>
|
|
<div class="pure-u-md-1-6 pure-u-1-4"><button type="button" class="pure-button button-del-mapping pure-u-5-6 pure-u-md-5-6">Del</button></div>
|
|
</div>
|
|
</div>
|
|
<!-- endRemoveIf(!rfm69) -->
|
|
|
|
<iframe id="downloader"></iframe>
|
|
<input id="uploader" type="file" />
|
|
|
|
</body>
|
|
|
|
<!-- build:js script.js -->
|
|
<script src="vendor/jquery-3.2.1.min.js"></script>
|
|
<script src="custom.js"></script>
|
|
<!-- removeIf(!light) -->
|
|
<script src="vendor/jquery.wheelcolorpicker-3.0.3.min.js"></script>
|
|
<!-- endRemoveIf(!light) -->
|
|
<!-- removeIf(!rfm69) -->
|
|
<script src="vendor/datatables-1.10.16.min.js"></script>
|
|
<!-- endRemoveIf(!rfm69) -->
|
|
<!-- endbuild -->
|
|
|
|
</html> |