Fork of the espurna firmware for `mhsw` switches
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

541 lines
31 KiB

8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
7 years ago
8 years ago
8 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>ESPurna 0.0.0</title>
  5. <meta charset="utf-8" />
  6. <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
  7. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8. <!-- build:css style.css -->
  9. <link rel="stylesheet" href="pure-min.css" />
  10. <link rel="stylesheet" href="side-menu.css" />
  11. <link rel="stylesheet" href="grids-responsive-min.css" />
  12. <link rel="stylesheet" href="checkboxes.css" />
  13. <link rel="stylesheet" href="custom.css" />
  14. <!-- endbuild -->
  15. </head>
  16. <body>
  17. <div id="layout">
  18. <a href="#menu" id="menuLink" class="menu-link">
  19. <span></span>
  20. </a>
  21. <div id="menu">
  22. <div class="pure-menu">
  23. <span class="pure-menu-heading">ESPurna 0.0.0</span>
  24. <ul class="pure-menu-list">
  25. <li class="pure-menu-item">
  26. <a href="#" class="pure-menu-link" data="panel-status">STATUS</a>
  27. </li>
  28. <li class="pure-menu-item">
  29. <a href="#" class="pure-menu-link" data="panel-general">GENERAL</a>
  30. </li>
  31. <li class="pure-menu-item">
  32. <a href="#" class="pure-menu-link" data="panel-security">SECURITY</a>
  33. </li>
  34. <li class="pure-menu-item">
  35. <a href="#" class="pure-menu-link" data="panel-wifi">WIFI</a>
  36. </li>
  37. <li class="pure-menu-item">
  38. <a href="#" class="pure-menu-link" data="panel-mqtt">MQTT</a>
  39. </li>
  40. <li class="pure-menu-item module module-dcz">
  41. <a href="#" class="pure-menu-link" data="panel-domoticz">DOMOTICZ</a>
  42. </li>
  43. <li class="pure-menu-item module module-pow">
  44. <a href="#" class="pure-menu-link" data="panel-power">POWER</a>
  45. </li>
  46. </ul>
  47. <div class="main-buttons">
  48. <button class="pure-button button-update">Update</button>
  49. <button class="pure-button button-reconnect">Reconnect</button>
  50. <button class="pure-button button-reset">Reset</button>
  51. </div>
  52. </div>
  53. </div>
  54. <div class="content">
  55. <div class="panel" id="panel-status" style="display: block;">
  56. <div class="header">
  57. <h1>STATUS</h1>
  58. <h2>Current configuration</h2>
  59. </div>
  60. <div class="page">
  61. <form class="pure-form pure-form-aligned">
  62. <fieldset>
  63. <div class="pure-g">
  64. <label class="pure-u-1 pure-u-sm-1-4" for="manufacturer">Manufacturer</label>
  65. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="manufacturer" readonly />
  66. </div>
  67. <div class="pure-g">
  68. <label class="pure-u-1 pure-u-sm-1-4" for="device">Device</label>
  69. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="device" readonly />
  70. </div>
  71. <div class="pure-g">
  72. <label class="pure-u-1 pure-u-sm-1-4" for="chipid">Chip ID</label>
  73. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="chipid" readonly />
  74. </div>
  75. <div class="pure-g">
  76. <label class="pure-u-1 pure-u-sm-1-4" for="mac">MAC</label>
  77. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="mac" readonly />
  78. </div>
  79. <div class="pure-g">
  80. <label class="pure-u-1 pure-u-sm-1-4" for="network">Network</label>
  81. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="network" readonly />
  82. </div>
  83. <div class="pure-g">
  84. <label class="pure-u-1 pure-u-sm-1-4" for="deviceip">IP</label>
  85. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="deviceip" readonly />
  86. </div>
  87. <div class="pure-g">
  88. <label class="pure-u-1 pure-u-sm-1-4" for="mqtt">MQTT Status</label>
  89. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="mqttStatus" readonly />
  90. </div>
  91. <div class="pure-g module module-ds">
  92. <label class="pure-u-1 pure-u-sm-1-4" for="dsTmp">Temperature (ºC)</label>
  93. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="dsTmp" readonly />
  94. </div>
  95. <div class="pure-g module module-dht">
  96. <label class="pure-u-1 pure-u-sm-1-4" for="dhtTmp">Temperature (ºC)</label>
  97. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="dhtTmp" readonly />
  98. </div>
  99. <div class="pure-g module module-dht">
  100. <label class="pure-u-1 pure-u-sm-1-4" for="dhtHum">Humidity (%)</label>
  101. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="dhtHum" readonly />
  102. </div>
  103. <div class="pure-g module module-pow">
  104. <label class="pure-u-1 pure-u-sm-1-4" for="powActivePower">Active Power (W)</label>
  105. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="powActivePower" readonly />
  106. </div>
  107. <div class="pure-g module module-pow">
  108. <label class="pure-u-1 pure-u-sm-1-4" for="powApparentPower">Apparent Power (W)</label>
  109. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="powApparentPower" readonly />
  110. </div>
  111. <div class="pure-g module module-pow">
  112. <label class="pure-u-1 pure-u-sm-1-4" for="powReactivePower">Reactive Power (W)</label>
  113. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="powReactivePower" readonly />
  114. </div>
  115. <div class="pure-g module module-pow">
  116. <label class="pure-u-1 pure-u-sm-1-4" for="powCurrent">Current (A)</label>
  117. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="powCurrent" readonly />
  118. </div>
  119. <div class="pure-g module module-pow">
  120. <label class="pure-u-1 pure-u-sm-1-4" for="powVoltage">Voltage (V)</label>
  121. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="powVoltage" readonly />
  122. </div>
  123. <div class="pure-g module module-pow">
  124. <label class="pure-u-1 pure-u-sm-1-4" for="powPowerFactor">Power Factor (%)</label>
  125. <input class="pure-u-1 pure-u-sm-3-4" type="text" name="powPowerFactor" readonly />
  126. </div>
  127. <div id="relays">
  128. </div>
  129. </fieldset>
  130. </form>
  131. </div>
  132. </div>
  133. <form id="formSave" class="pure-form" action="/" method="post">
  134. <div class="panel" id="panel-general">
  135. <div class="header">
  136. <h1>GENERAL</h1>
  137. <h2>General configuration values</h2>
  138. </div>
  139. <div class="page">
  140. <fieldset>
  141. <div class="pure-g">
  142. <label class="pure-u-1 pure-u-md-1-4" for="hostname">Hostname</label>
  143. <input name="hostname" class="pure-u-1 pure-u-md-3-4" type="text" tabindex="1" />
  144. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  145. <div class="pure-u-1 pure-u-md-3-4 hint">This name will identify this device in your network (http://&lt;hostname&gt;.local). For this setting to take effect you should restart the wifi interface clicking the "Reconnect" button.</div>
  146. </div>
  147. <div class="pure-g">
  148. <label class="pure-u-1 pure-u-md-1-4" for="relayMode">Relay boot mode</label>
  149. <div class="pure-u-1 pure-u-md-3-4">
  150. <select name="relayMode" class="pure-u-3-4" tabindex="2">
  151. <option value="0">Always OFF</a>
  152. <option value="1">Always ON</a>
  153. <option value="2">Same as before</a>
  154. </select>
  155. </div>
  156. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  157. <div class="pure-u-1 pure-u-md-3-4 hint">Here you can define what will be the status of the relay after a reboot.</div>
  158. </div>
  159. <div class="pure-g module module-multirelay">
  160. <label class="pure-u-1 pure-u-md-1-4" for="relaySync">Relay sync mode</label>
  161. <div class="pure-u-1 pure-u-md-3-4">
  162. <select name="relaySync" class="pure-u-3-4" tabindex="3">
  163. <option value="0">No synchonisation</a>
  164. <option value="1">Zero or one relays active</a>
  165. <option value="2">One and just one relay active</a>
  166. <option value="3">All synchonised</a>
  167. </select>
  168. </div>
  169. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  170. <div class="pure-u-1 pure-u-md-3-4 hint">Define how the different relays should be synchronized.</div>
  171. </div>
  172. <div class="pure-g">
  173. <label class="pure-u-1 pure-u-md-1-4" for="relayPulseMode">Relay pulse mode</label>
  174. <div class="pure-u-1 pure-u-md-3-4">
  175. <select name="relayPulseMode" class="pure-u-3-4" tabindex="4">
  176. <option value="0">Don't pulse</a>
  177. <option value="1">Normally OFF (stays on for a short time)</a>
  178. <option value="2">Normally ON (stays off for a short time)</a>
  179. </select>
  180. </div>
  181. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  182. <div class="pure-u-1 pure-u-md-3-4 hint">When pulse mode is enabled the relay will automatically switch back to its normal state after the pulse time (below).</div>
  183. </div>
  184. <div class="pure-g">
  185. <label class="pure-u-1 pure-u-md-1-4" for="relayPulseTime">Relay pulse time</label>
  186. <input name="relayPulseTime" class="pure-u-1 pure-u-md-3-4" type="number" min="1" tabindex="5" />
  187. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  188. <div class="pure-u-1 pure-u-md-3-4 hint">Pulse time in seconds.</div>
  189. </div>
  190. <div class="pure-g module module-fauxmo">
  191. <div class="pure-u-1 pure-u-sm-1-4"><label for="fauxmoEnabled">Alexa integration</label></div>
  192. <div class="pure-u-1 pure-u-sm-1-4"><input type="checkbox" name="fauxmoEnabled" tabindex="6" /></div>
  193. </div>
  194. </fieldset>
  195. </div>
  196. </div>
  197. <div class="panel" id="panel-security">
  198. <div class="header">
  199. <h1>SECURITY</h1>
  200. <h2>Device security settings</h2>
  201. </div>
  202. <div class="page">
  203. <fieldset>
  204. <div class="pure-g">
  205. <label class="pure-u-1 pure-u-md-1-4" for="adminPass1">Admin password</label>
  206. <input name="adminPass1" class="pure-u-1 pure-u-md-3-4" type="password" tabindex="11" />
  207. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  208. <div class="pure-u-1 pure-u-md-3-4 hint">
  209. 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 />
  210. It should have at least <strong>eight characters</strong> (letters, numbers or the underscore) and at least <strong>one number</strong>, <strong>one lowercase</strong> and <strong>one uppercase</strong> letter.</div>
  211. </div>
  212. <div class="pure-g">
  213. <label class="pure-u-1 pure-u-md-1-4" for="adminPass2">Admin password (repeat)</label>
  214. <input name="adminPass2" class="pure-u-1 pure-u-md-3-4" type="password" tabindex="12" />
  215. </div>
  216. <div class="pure-g">
  217. <div class="pure-u-1 pure-u-sm-1-4"><label for="apiEnabled">Enable HTTP API</label></div>
  218. <div class="pure-u-1 pure-u-sm-1-4"><input type="checkbox" name="apiEnabled" /></div>
  219. </div>
  220. <div class="pure-g">
  221. <label class="pure-u-1 pure-u-md-1-4" for="apiKey">HTTP API Key</label>
  222. <input name="apiKey" class="pure-u-3-4 pure-u-md-1-2" type="text" tabindex="13" />
  223. <div class=" pure-u-1-4 pure-u-md-1-4"><button class="pure-button button-apikey pure-u-23-24">Generate</button></div>
  224. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  225. <div class="pure-u-1 pure-u-md-3-4 hint">
  226. This is the key you will have to pass with every HTTP request to the API, either to get or write values.<br />
  227. All API calls must contain the <strong>apikey</strong> parameter with the value above.<br />
  228. To know what APIs are enabled do a call to <strong>/apis</strong>.
  229. </div>
  230. </div>
  231. </fieldset>
  232. </div>
  233. </div>
  234. <div class="panel" id="panel-wifi">
  235. <div class="header">
  236. <h1>WIFI</h1>
  237. <h2>You can configure up to 5 different WiFi networks. The device will try to connect in order of signal strength.</h2>
  238. </div>
  239. <div class="page">
  240. <fieldset>
  241. <div id="networks">
  242. </div>
  243. <button type="button" class="pure-button button-add-network">Add network</button>
  244. </fieldset>
  245. </div>
  246. </div>
  247. <div class="panel" id="panel-mqtt">
  248. <div class="header">
  249. <h1>MQTT</h1>
  250. <h2>Configure an <strong>MQTT broker</strong> in your network and you will be able to change the switch status via an MQTT message. Leave the server field empty to disable MQTT.</h2>
  251. </div>
  252. <div class="page">
  253. <fieldset>
  254. <div class="pure-g">
  255. <label class="pure-u-1 pure-u-md-1-4" for="mqttServer">MQTT Server</label>
  256. <input class="pure-u-1 pure-u-md-3-4" name="mqttServer" type="text" size="20" tabindex="21" placeholder="MQTT Server" />
  257. </div>
  258. <div class="pure-g">
  259. <label class="pure-u-1 pure-u-md-1-4" for="mqttPort">MQTT Port</label>
  260. <input class="pure-u-1 pure-u-md-3-4" name="mqttPort" type="text" size="6" tabindex="22" placeholder="1883" />
  261. </div>
  262. <div class="pure-g">
  263. <label class="pure-u-1 pure-u-md-1-4" for="mqttUser">MQTT User</label>
  264. <input class="pure-u-1 pure-u-md-3-4" name="mqttUser" type="text" size="20" tabindex="23" placeholder="Leave blank if no user/pass" />
  265. </div>
  266. <div class="pure-g">
  267. <label class="pure-u-1 pure-u-md-1-4" for="mqttPassword">MQTT Password</label>
  268. <input class="pure-u-1 pure-u-md-3-4" name="mqttPassword" type="text" size="20" tabindex="24" placeholder="Leave blank if no user/pass" />
  269. </div>
  270. <div class="pure-g">
  271. <label class="pure-u-1 pure-u-md-1-4" for="mqttTopic">MQTT Root Topic</label>
  272. <input class="pure-u-1 pure-u-md-3-4" name="mqttTopic" type="text" size="20" tabindex="25" />
  273. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  274. <div class="pure-u-1 pure-u-md-3-4 hint">
  275. This is the root topic for this device. The {identifier} placeholder will be replaces by the device hostname.<br />
  276. - <strong>&lt;root&gt;/relay/#</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 relay ID (starting from 0). If the board has only one relay it will be 0.<br />
  277. - <strong>&lt;root&gt;/led/#</strong> Send a 0 or a 1 as a payload to this topic to set the onboard LED to the given state, send a 3 to turn it back to WIFI indicator. Replace # with the LED ID (starting from 0). If the board has only one LED it will be 0.<br />
  278. - <strong>&lt;root&gt;/button/#</strong> For each button in the board subscribe to this topic to know when it is pressed (payload 1) or released (payload 0).<br />
  279. - <strong>&lt;root&gt;/ip</strong> The device will report to this topic its IP.<br />
  280. - <strong>&lt;root&gt;/version</strong> The device will report to this topic its firmware version on boot.<br />
  281. - <strong>&lt;root&gt;/status</strong> The device will report a 1 to this topic every few minutes. Upon MQTT disconnecting this will be set to 0.
  282. </div>
  283. </div>
  284. </fieldset>
  285. </div>
  286. </div>
  287. <div class="panel" id="panel-domoticz">
  288. <div class="header">
  289. <h1>DOMOTICZ</h1>
  290. <h2>
  291. Configure the connection to your Domoticz server.
  292. </h2>
  293. </div>
  294. <div class="page">
  295. <fieldset>
  296. <div class="pure-g">
  297. <label class="pure-u-1 pure-u-md-1-4" for="dczTopicIn">Domoticz IN Topic</label>
  298. <input class="pure-u-1 pure-u-md-3-4" name="dczTopicIn" type="text" tabindex="31" placeholder="domoticz/in" />
  299. </div>
  300. <div class="pure-g">
  301. <label class="pure-u-1 pure-u-md-1-4" for="dczTopicOut">Domoticz OUT Topic</label>
  302. <input class="pure-u-1 pure-u-md-3-4" name="dczTopicOut" type="text" tabindex="32" placeholder="domoticz/out" />
  303. </div>
  304. <div class="pure-g modude module-dht module-ds">
  305. <label class="pure-u-1 pure-u-sm-1-4" for="dczTmpIdx">Temperature IDX</label>
  306. <div class="pure-u-1 pure-u-sm-1-8"><input class="pure-u-sm-23-24" name="dczTmpIdx" type="number" min="0" tabindex="33" data="0" /></div>
  307. <div class="pure-u-1 pure-u-sm-5-8 hint center">Set to 0 to disable notifications.</div>
  308. </div>
  309. <div class="pure-g modude module-dht">
  310. <label class="pure-u-1 pure-u-sm-1-4" for="dczHumIdx">Humidity IDX</label>
  311. <div class="pure-u-1 pure-u-sm-1-8"><input class="pure-u-sm-23-24" name="dczHumIdx" type="number" min="0" tabindex="34" data="0" /></div>
  312. <div class="pure-u-1 pure-u-sm-5-8 hint center">Set to 0 to disable notifications.</div>
  313. </div>
  314. <div class="pure-g modude module-pow module-emon">
  315. <label class="pure-u-1 pure-u-sm-1-4" for="dczPowIdx">Power IDX</label>
  316. <div class="pure-u-1 pure-u-sm-1-8"><input class="pure-u-sm-23-24" name="dczPowIdx" type="number" min="0" tabindex="35" data="0" /></div>
  317. <div class="pure-u-1 pure-u-sm-5-8 hint center">Set to 0 to disable notifications.</div>
  318. </div>
  319. <div id="idxs">
  320. </div>
  321. </fieldset>
  322. </div>
  323. </div>
  324. <div class="panel" id="panel-power">
  325. <div class="header">
  326. <h1>POWER</h1>
  327. <h2>
  328. Calibrate your power monitor device. Use a pure resistive load and introduce the expected values for active power, current and voltage. Use the nominal values or a multimeter to get the proper numbers. Set any field to 0 to leave the calibration value untouched.
  329. </h2>
  330. </div>
  331. <div class="page">
  332. <fieldset>
  333. <div class="pure-g">
  334. <label class="pure-u-1 pure-u-md-1-4" for="powExpectedPower">AC RMS Active Power</label>
  335. <input class="pure-u-1 pure-u-md-3-4 powExpected" name="powExpectedPower" type="text" size="8" tabindex="51" placeholder="0" />
  336. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  337. <div class="pure-u-1 pure-u-md-3-4 hint">In Watts (W). If you are using a pure resistive load like a bulb this will be writen on it, otherwise use a socket multimeter to get this value.</div>
  338. </div>
  339. <div class="pure-g">
  340. <label class="pure-u-1 pure-u-md-1-4" for="powExpectedVoltage">AC RMS Voltage</label>
  341. <input class="pure-u-1 pure-u-md-3-4 powExpected" name="powExpectedVoltage" type="text" size="8" tabindex="52" placeholder="0" />
  342. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  343. <div class="pure-u-1 pure-u-md-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>
  344. </div>
  345. <div class="pure-g">
  346. <label class="pure-u-1 pure-u-md-1-4" for="powExpectedCurrent">AC RMS Current</label>
  347. <input class="pure-u-1 pure-u-md-3-4 powExpected" name="powExpectedCurrent" type="text" size="8" tabindex="55" placeholder="0" />
  348. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  349. <div class="pure-u-1 pure-u-md-3-4 hint">In Ampers (A). If you are using a pure resistive load like a bulb this will the ratio between the two previous values, i.e. power / voltage. You can also use a current clamp around one fo the power wires to get this value.</div>
  350. </div>
  351. <div class="pure-g">
  352. <div class="pure-u-1 pure-u-sm-1-4"><label for="powExpectedReset">Reset calibration</label></div>
  353. <div class="pure-u-1 pure-u-sm-1-4"><input type="checkbox" name="powExpectedReset" /></div>
  354. <div class="pure-u-0 pure-u-md-1-4">&nbsp;</div>
  355. <div class="pure-u-1 pure-u-md-3-4 hint">Move this switch to ON and press "Update" to revert to factory values.</div>
  356. </div>
  357. </fieldset>
  358. </div>
  359. </div>
  360. </form>
  361. </div> <!-- content -->
  362. </div> <!-- layout -->
  363. <!-- Templates -->
  364. <div id="networkTemplate" class="template">
  365. <div class="pure-g">
  366. <label class="pure-u-md-1-6 pure-u-1-4" for="ssid">Network SSID</label>
  367. <div class="pure-u-md-3-4 pure-u-5-8"><input name="ssid" type="text" class="pure-u-23-24" value="" size="8" tabindex="0" placeholder="Network SSID" required /></div>
  368. <div class="pure-u-md-1-12 pure-u-1-8"><button type="button" class="pure-button button-more-network pure-u-1">...</button></div>
  369. <div class="more">
  370. <div class="break"></div>
  371. <label class="pure-u-md-1-6 pure-u-1-4" for="pass">Password</label>
  372. <input class="pure-u-md-5-6 pure-u-3-4" name="pass" type="password" value="" tabindex="0" />
  373. <div class="break"></div>
  374. <label class="pure-u-md-1-6 pure-u-1-4" for="ip">Static IP</label>
  375. <input class="pure-u-md-5-6 pure-u-3-4" name="ip" type="text" value="" size="15" tabindex="0" />
  376. <div class="pure-u-md-1-6 pure-u-1-4"></div>
  377. <div class="pure-u-md-5-6 pure-u-3-4 hint">Leave empty for DNS negotiation</div>
  378. <label class="pure-u-md-1-6 pure-u-1-4" for="gw">Gateway IP</label>
  379. <input class="pure-u-md-5-6 pure-u-3-4" name="gw" type="text" value="" size="15" tabindex="0" />
  380. <div class="pure-u-md-1-6 pure-u-1-4"></div>
  381. <div class="pure-u-md-5-6 pure-u-3-4 hint">Set when using a static IP</div>
  382. <label class="pure-u-md-1-6 pure-u-1-4" for="mask">Network Mask</label>
  383. <input class="pure-u-md-5-6 pure-u-3-4" name="mask" type="text" value="" size="15" tabindex="0" placeholder="255.255.255.0" />
  384. <div class="pure-u-md-1-6 pure-u-1-4"></div>
  385. <div class="pure-u-md-5-6 pure-u-3-4 hint">Usually 255.255.255.0 for /24 networks</div>
  386. <label class="pure-u-md-1-6 pure-u-1-4" for="dns">DNS IP</label>
  387. <input class="pure-u-md-5-6 pure-u-3-4" name="dns" type="text" value="" size="15" tabindex="0" placeholder="8.8.8.8" />
  388. <div class="pure-u-md-1-6 pure-u-1-4"></div>
  389. <div class="pure-u-md-5-6 pure-u-3-4 hint">Set the Domain Name Server IP to use when using a static IP</div>
  390. <div class="pure-u-md-1-6 pure-u-1-4"></div>
  391. <div class="pure-u-md-1-6 pure-u-1-4"><button type="button" class="pure-button button-del-network pure-u-5-6 pure-u-md-5-6">Del</button></div>
  392. </div>
  393. </div>
  394. </div>
  395. <div id="relayTemplate" class="template">
  396. <div class="pure-g">
  397. <label class="pure-u-1 pure-u-sm-1-4">Relay<span class="relay_id"></span> Status</label>
  398. <div class="pure-u-1 pure-u-sm-1-4"><input type="checkbox" class="relayStatus" data="0" /></div>
  399. </div>
  400. </div>
  401. <div id="idxTemplate" class="template">
  402. <div class="pure-g">
  403. <label class="pure-u-1 pure-u-sm-1-4" for="dczRelayIdx">Relay<span class="id"></span> IDX</label>
  404. <div class="pure-u-1 pure-u-sm-1-8"><input class="pure-u-sm-23-24 dczRelayIdx" name="dczRelayIdx" type="number" min="0" tabindex="0" data="0" /></div>
  405. <div class="pure-u-1 pure-u-sm-5-8 hint center">Set to 0 to disable notifications.</div>
  406. </div>
  407. </div>
  408. </body>
  409. <!-- build:js script.js -->
  410. <script src="jquery-1.12.3.min.js"></script>
  411. <script src="checkboxes.js"></script>
  412. <script src="custom.js"></script>
  413. <!-- endbuild -->
  414. </html>