index.htm 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. <h3>Current Data</h3>
  2. Temp:
  3. <span id="temp"></span>
  4. <br/> set Temp:
  5. <span id="setTemp"></span>
  6. <br/> current WiFi SSID:
  7. <span id="ssid"></span>
  8. <h6>Last updated
  9. <span id="ut"></span> seconds ago.
  10. <span id="status"></span>
  11. </h6>
  12. <h3>Update Data</h3>
  13. <form id="yform" onsubmit="return transmit(this)">
  14. set temp:
  15. <input type="text" name="setTemp" />
  16. <input type="submit" />
  17. </form>
  18. <a href="wifi.htm">WiFi settings</a><br/>
  19. <a href="/update">Firmware Update</a>
  20. <script>
  21. function g(i) { return document.getElementById(i) };
  22. var xhttp, updateTime;
  23. function transmit(f) {
  24. if (!xhttp) { //prevent simultaneous requests
  25. g("status").innerHTML = "updating...";
  26. xhttp = new XMLHttpRequest();
  27. xhttp.open("POST", "/api");
  28. xhttp.send(f ? (new FormData(f)) : "");
  29. xhttp.onreadystatechange = function () {
  30. if (xhttp.readyState === XMLHttpRequest.DONE && xhttp.status === 200) {
  31. var data = JSON.parse(xhttp.responseText);
  32. g("x").innerHTML = data.x;
  33. g("y").innerHTML = data.y;
  34. g("z").innerHTML = data.z;
  35. g("ssid").innerHTML = data.ssid;
  36. g("temp").innerHTML = data.temp;
  37. g("setTemp").innerHTML = data.setTemp;
  38. xhttp = null;
  39. g("status").innerHTML = "";
  40. updateTime = 0;
  41. }
  42. }
  43. }
  44. return false; //prevent form redirect
  45. }
  46. transmit();
  47. setInterval(function () { g("ut").innerHTML = ++updateTime; }, 1000);
  48. setInterval(transmit, 5000); //autoupdate display every 5s
  49. </script>