index.htm 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. <html><body>
  2. <h1>WiFi Thermostat</h1>
  3. <!--<form id='tempbtns'>
  4. <input type='text' id='tempbtn' name='tempbtn' value='xx'>
  5. </form>-->
  6. <span id='setTemp'>22.5</span> &#8451;
  7. <input type='button' onclick='return sendBtn("min")' value='-'/>
  8. <input type='button' onclick='return sendBtn("pls")' value='+'/>
  9. <br><br>
  10. Betriebsmodus: <span id='mode'></span><br>
  11. <br>
  12. Aktuell: <span id='temp'></span> &#8451;&nbsp;&nbsp;&nbsp;<span id='hum'></span> %<br>
  13. <br>
  14. WiFi verbunden mit: <span id='ssid'></span><br>
  15. <h6>Letztes Update vor
  16. <span id='ut'></span> Sekunden.
  17. <span id='status'></span>
  18. </h6>
  19. <br><a href='/wifi.htm'>WiFi-Einstellungen</a><br>
  20. <a href='/update'>Firmware Update</a>
  21. <script>
  22. function g(i) { return document.getElementById(i) };
  23. var xhttp, updateTime;
  24. function sendBtn(btn) {
  25. //var form = document.getElementById('tempbtns');
  26. //var act=document.getElementById('tempbtn')
  27. //act.value = btn;
  28. var fd = new FormData();
  29. fd.append('tempbtn', btn);
  30. return transmit(fd);
  31. }
  32. function transmit(f) {
  33. if (!xhttp) {
  34. g('status').innerHTML = 'lade...';
  35. xhttp = new XMLHttpRequest();
  36. xhttp.open('POST', 'api.php');
  37. xhttp.send(f ? (new FormData(f)) : '');
  38. xhttp.onreadystatechange = function () {
  39. if (xhttp.readyState === XMLHttpRequest.DONE && xhttp.status === 200) {
  40. var data = JSON.parse(xhttp.responseText);
  41. g('temp').innerHTML = data.temp;
  42. g('hum').innerHTML = data.hum;
  43. g('setTemp').innerHTML = data.setTemp;
  44. g('ssid').innerHTML = data.ssid;
  45. if(data.mode == '0') {
  46. g('mode').innerHTML = 'AUS';
  47. }
  48. else if(data.mode == '1') {
  49. g('mode').innerHTML = 'Normalbetrieb';
  50. }
  51. else if(data.mode == '2') {
  52. g('mode').innerHTML = 'Nachtabsenkung';
  53. }
  54. xhttp = null;
  55. g('status').innerHTML = '';
  56. updateTime = 0;
  57. }
  58. }
  59. }
  60. return false;
  61. }
  62. transmit();
  63. setInterval(function () { g('ut').innerHTML = ++updateTime; }, 1000);
  64. setInterval(transmit, 5000);
  65. </script>
  66. </body></html>