config.html 2.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <link rel="stylesheet" href="max80.css" />
  5. <title class="config">MAX80: Configuration</title>
  6. <script src="max80.js"></script>
  7. </head>
  8. <body>
  9. <x-inc src="head.html"></x-inc>
  10. <h1 class="config">Configuration</h1>
  11. <form id="setconfig" action="sys/setconfig" method="post"
  12. onsubmit="uploadform()" data-ref="10" data-ref-url="status.html">
  13. <fieldset class="network">
  14. <legend>Network</legend>
  15. <label class="wifi-ssid">
  16. <span>Network name (SSID):</span>
  17. <input type="text" name="wifi.ssid" />
  18. </label>
  19. <label class="wifi-psk">
  20. <span>Network password (PSK):</span>
  21. <input class="mono" type="password" name="wifi.psk" />
  22. <button type="button" class="show" onclick="showpwd()"><span class="show">Show</span><span class="hide">Hide</span></button>
  23. </label>
  24. </fieldset>
  25. <fieldset class="datetime">
  26. <legend>Date and Time</legend>
  27. <label class="tz">
  28. <span>Time zone:</span>
  29. <select name="tzname" id="tzname" onchange="tzn()">
  30. </select>
  31. <input type="text" name="TZ" oninput="tzt()" />
  32. </label>
  33. <label class="sntp-enabled">
  34. <span>Synchronize time from network:</span>
  35. <input type="checkbox" name="sntp.enabled" />
  36. </label>
  37. <label class="sntp-server">
  38. <span>NTP server:</span>
  39. <input type="text" name="sntp.server" />
  40. </label>
  41. <label class="ip4-dhcp-sntp">
  42. <span>Use DHCP-provided NTP server:</span>
  43. <input type="checkbox" name="ip4.dhcp.nosntp" value="0" />
  44. </label>
  45. </fieldset>
  46. <button class="submit" type="submit" disabled>Update configuration</button>
  47. <br />
  48. <output></output>
  49. </form>
  50. <script>
  51. function tzn() {
  52. const tz = event.target.selectedOptions[0].dataset.tz;
  53. if (tz) sib(event.target,'input').value = tz;
  54. }
  55. function tzt() { sib(event.target,'select').value = ''; }
  56. fetchconfig('tz.txt')
  57. .then(map => {
  58. function cln(z) {
  59. return ('tz/'+z).replaceAll('/','_ ')
  60. .replaceAll(/[^\w ]+/g,'-');
  61. }
  62. var elem = getelem('tzname');
  63. var grp = elem;
  64. map.set('',''); map.set('UTC','UTC0');
  65. var zones = Array.from(map.keys());
  66. zones = zones.filter(v => v && v != 'UTC').sort();
  67. zones.unshift('','UTC');
  68. for (const z of zones) {
  69. const zz = z.match(/^(?:(\S+?)\/)?(\S*)$/,z);
  70. if (!zz) { continue; }
  71. if (zz[1] && zz[1] != grp.label) {
  72. grp = document.createElement('OPTGROUP');
  73. grp.label = zz[1];
  74. grp.className = cln(zz[1]);
  75. elem.append(grp);
  76. } else if (!zz[1]) {
  77. grp = elem;
  78. }
  79. const pz = zz[2].replaceAll('_',' ').replaceAll('/',': ');
  80. var opt = new Option(pz, z);
  81. opt.className = cln(z);
  82. opt.dataset.tz = map.get(z);
  83. grp.append(opt);
  84. }
  85. translate(elem);
  86. })
  87. .finally(() => {loadform('setconfig','sys/getconfig');} );
  88. </script>
  89. </body>
  90. </html>