data.html 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. <html>
  2. <head>
  3. <style>
  4. html,
  5. body {
  6. height: 100%;
  7. margin: 2px;
  8. }
  9. .box {
  10. display: flex;
  11. flex-flow: column;
  12. height: 100%;
  13. }
  14. .box .row.header {
  15. flex: 0 1 auto;
  16. }
  17. .box .row.content {
  18. flex: 1 1 auto;
  19. }
  20. .box .row.footer {
  21. flex: 0 1 auto;
  22. }
  23. #log {
  24. font-family: 'Courier New', Courier, monospace;
  25. font-size: small;
  26. }
  27. </style>
  28. </head>
  29. <body>
  30. <div class="box">
  31. <div class="row header">
  32. <button onClick="reload();">Reload</button>
  33. <button onClick="window.open('datafileact');">Show full data</button>
  34. <button onClick="window.location.href = 'fileserver/log/data/'">Show older data files</button>
  35. </div>
  36. <div class="row content" id="log"><br><br><br><b>Loading Logfile, please wait...</b></div>
  37. <div class="row footer">
  38. <button onClick="reload();">Reload</button>
  39. <button onClick="window.open('datafileact');">Show full data</button>
  40. <button onClick="window.location.href = 'fileserver/log/data/'">Show older data files</button>
  41. </div>
  42. </div>
  43. </body>
  44. <script>
  45. function reload() {
  46. // document.getElementById('log').innerHTML += "<br><b>Reloading...<b><br><br>";
  47. document.getElementById('log').innerHTML += "<b>Reloading...</b>";
  48. window.scrollBy(0,document.body.scrollHeight);
  49. funcRequest('log');
  50. }
  51. function processLogLine(line, index, arr) {
  52. if (line.includes("&lt;WRN&gt;")) {
  53. arr[index] = "<span style=\"color:#e83c00\">" + line + "</span>";
  54. }
  55. else if (line.includes("&lt;ERR&gt;")) {
  56. arr[index] = "<span style=\"color:red\"><b>" + line + "</b></span>";
  57. }
  58. else if (line.includes("&lt;DBG&gt;")) {
  59. arr[index] = "<span style=\"color:gray\">" + line + "</span>";
  60. }
  61. arr[index] += "<br>";
  62. }
  63. async function funcRequest(url){
  64. await fetch(url)
  65. .then((res) => {
  66. if (!res.ok) {
  67. document.getElementById("log").innerHTML = "HTTP error " + res.status;
  68. }
  69. return res.text();
  70. })
  71. .then((log) => {
  72. log = log.replace(/</g, "&lt;").replace(/>/g, "&gt;");
  73. logArr = log.split("\n");
  74. logArr.forEach(processLogLine);
  75. document.getElementById('log').innerHTML = "<br>" + logArr.join("\n") + "&nbsp;";
  76. window.scrollBy(0,document.body.scrollHeight);
  77. })
  78. .catch((err) => {
  79. document.getElementById("data").innerHTML = err;
  80. });
  81. }
  82. funcRequest('data');
  83. </script>
  84. </html>