html_confBas.h 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132
  1. /* clang-format off */
  2. static const char html_confbas_script[] PROGMEM = R"=====(
  3. <script>
  4. function g(i) { return document.getElementById(i) };
  5. function sp(i){g(i).type=(g(i).type==='text'?'password':'text');}
  6. var xhttp, reqTime, reqFin;
  7. function setCbx(el, da) {
  8. if(da == '1') {
  9. el.checked = true;
  10. el.style.visibility = 'visible';
  11. }
  12. else {
  13. el.checked = false;
  14. el.style.visibility = 'visible';
  15. }
  16. }
  17. function updCbxVal(el) {
  18. if (el.checked) el.value = '1';
  19. else {
  20. el.checked = true;
  21. el.value = '0';
  22. el.style.visibility = 'hidden';
  23. }
  24. }
  25. function transmit(f) {
  26. if (!xhttp) {
  27. reqTime = 0;
  28. reqFin = false;
  29. updCbxVal(g('autoSaveTemp'));
  30. updCbxVal(g('autoSaveMode'));
  31. updCbxVal(g('saveToMqttRet'));
  32. updCbxVal(g('PIRenDisp'));
  33. updCbxVal(g('PIRenDispPs0'));
  34. updCbxVal(g('togTHdisp'));
  35. xhttp = new XMLHttpRequest();
  36. xhttp.timeout = 1000;
  37. xhttp.overrideMimeType('application/json');
  38. xhttp.open('POST', 'confDataBas');
  39. xhttp.send(f ? (new FormData(f)) : '');
  40. xhttp.onreadystatechange = function () {
  41. if (xhttp.readyState === XMLHttpRequest.DONE && xhttp.status === 200) {
  42. var data = JSON.parse(xhttp.responseText);
  43. g('tempMin').value = data.tempMin;
  44. g('tempMax').value = data.tempMax;
  45. g('measInt').value = data.measInt;
  46. g('dispInt').value = data.dispInt;
  47. g('dispTout').value = data.dispTout;
  48. setCbx(g('autoSaveTemp'), data.autoSaveTemp);
  49. setCbx(g('autoSaveMode'), data.autoSaveMode);
  50. setCbx(g('saveToMqttRet'), data.saveToMqttRet);
  51. setCbx(g('PIRenDisp'), data.PIRenDisp);
  52. setCbx(g('PIRenDispPs0'), data.PIRenDispPs0);
  53. setCbx(g('togTHdisp'), data.togTHdisp);
  54. xhttp = null;
  55. reqFin = true;
  56. }
  57. else {
  58. if(!reqFin && reqTime > 10) {
  59. xhttp = null;
  60. reqFin = true;
  61. }
  62. }
  63. }
  64. }
  65. return false;
  66. }
  67. //transmit();
  68. function saveConf() {
  69. updCbxVal(g('autoSaveTemp'));
  70. updCbxVal(g('autoSaveMode'));
  71. updCbxVal(g('saveToMqttRet'));
  72. updCbxVal(g('PIRenDisp'));
  73. updCbxVal(g('PIRenDispPs0'));
  74. updCbxVal(g('togTHdisp'));
  75. g('frmConf').submit();
  76. }
  77. function init() {
  78. transmit();
  79. }
  80. setInterval(function () { ++reqTime; }, 1000);
  81. </script>
  82. )====="; // html_confbas_script
  83. static const char html_confbas_body[] PROGMEM = R"=====(
  84. <b>Configuration - Thermostat Basic</b>
  85. <div class='config'>
  86. <form id='frmConf' action='setConfBas' method='POST'>
  87. <br>
  88. <fieldset>
  89. <legend>Thermostat</legend>
  90. <p><b>Minimum Set Temperature [°C]</b><br><input type='text' name='tempMin' id='tempMin'></p>
  91. <p><b>Maximum Set Temperature [°C]</b><br><input type='text' name='tempMax' id='tempMax'></p>
  92. </fieldset>
  93. <div></div><br>
  94. <fieldset>
  95. <legend>Auto Save</legend>
  96. <p><b>Temperature *</b>&nbsp;<input type='checkbox' name='autoSaveTemp' id='autoSaveTemp'/></p>
  97. <p><b>Mode/Preset *</b>&nbsp;<input type='checkbox' name='autoSaveMode' id='autoSaveMode'/></p>
  98. <p class='n'>To minimize flash writes, this can also be <br>
  99. achieved by using MQTT with retain flag, when using <br>
  100. an external controller, especially for Mode/Preset, <br>
  101. as these will change frequently in most cases. <br>
  102. WiFiThermostat will receive the last value from retained MQTT <br>
  103. message automatically on startup/reconnect.</p>
  104. <p><b>Preserve States MQTT retained</b>&nbsp;<input type='checkbox' name='saveToMqttRet' id='saveToMqttRet'/></p>
  105. </fieldset>
  106. <div></div><br>
  107. <fieldset>
  108. <legend>Intervals / Timeouts</legend>
  109. <p><b>Measurement Interval [s]</b><br><input type='number' name='measInt' id='measInt'></p>
  110. <p><b>Display Update Interval [s]</b><br><input type='number' name='dispInt' id='dispInt'></p>
  111. <p><b>Display Timeout [s]</b><br><input type='number' name='dispTout' id='dispTout'></p>
  112. </fieldset>
  113. <div></div><br>
  114. <fieldset>
  115. <legend>Misc</legend>
  116. <p><b>PIR enables LCD backlight</b>&nbsp;<input type='checkbox' name='PIRenDisp' id='PIRenDisp'/></p>
  117. <p><b>&nbsp;&nbsp;only in normal heating mode</b>&nbsp;<input type='checkbox' name='PIRenDispPs0' id='PIRenDispPs0'/></p>
  118. <br>
  119. <p><b>Toggling I/O-Temp/Hum on LCD</b>&nbsp;<input type='checkbox' name='togTHdisp' id='togTHdisp'/></p>
  120. </fieldset>
  121. <br>
  122. </form>
  123. <div></div>
  124. <table style='width:100%'>
  125. <td style='width:50%'><button onclick='location="conf";' class='bgrey'>Cancel</button></td>
  126. <td style='width:50%'><button onclick='return saveConf()' class='bred'>Save</button></td>
  127. </tr></table>
  128. </div>
  129. )====="; // html_confbas_body