ping.html 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <link rel="stylesheet" href="../../script/semantic/semantic.min.css">
  6. <script type="text/javascript" src="../../script/jquery.min.js"></script>
  7. <script type="text/javascript" src="../../script/semantic/semantic.min.js"></script>
  8. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  9. <style>
  10. .ts.items>.item>.image:not(.ts):not(.flexible) {
  11. width: 60px;
  12. !important
  13. }
  14. </style>
  15. </head>
  16. <body>
  17. <br> NOT YET IMPLEMTENTED
  18. <div class="ui container">
  19. <p id="jitter">Jitter: testing.</p>
  20. <p id="ping">Ping: testing.</p>
  21. </div>
  22. <script>
  23. var timeDiffArr = [];
  24. $(document).ready(function() {
  25. for (i = 1000; i <= 10000; i += 1000) {
  26. setTimeout(function() {
  27. measurePing();
  28. }, i);
  29. //
  30. }
  31. setTimeout(function() {
  32. $("#ping").text("Ping: " + formatTime(average(timeDiffArr)));
  33. $("#jitter").text("Jitter: " + formatTime(jitter(timeDiffArr)));
  34. }, 11000);
  35. });
  36. function measurePing() {
  37. setTimeout(function() {
  38. var timeDiff = 0;
  39. var startTime = new Date();
  40. $.get("/system/network/getPing",
  41. function() {
  42. timeDiff = (new Date() - startTime);
  43. timeDiffArr.push(timeDiff);
  44. });
  45. }, 1000);
  46. }
  47. function average(Arr) {
  48. var sum = 0;
  49. for (i = 0; i <= Arr.length - 1; i++) {
  50. sum += Arr[i];
  51. }
  52. return Math.round(sum / Arr.length);
  53. }
  54. function jitter(Arr) {
  55. var jitterArr = [];
  56. for (i = 1; i <= Arr.length - 1; i++) {
  57. jitterArr.push(Math.abs(Arr[i] - Arr[i - 1]));
  58. }
  59. return Math.round(average(jitterArr));
  60. }
  61. function formatTime(time) {
  62. if (time < 1000) {
  63. return time + "ms";
  64. } else if (time < 60000) {
  65. return Math.floor(time / 1000) + "s " + convert(time - Math.floor(time / 1000) * 1000);
  66. } else if (time < 3600000) {
  67. return Math.floor(time / 60000) + "m " + convert(time - Math.floor(time / 60000) * 60000);
  68. } else if (time < 216000000) { //original was 216000000
  69. return Math.floor(time / 3600000) + "h " + convert(time - Math.floor(time / 3600000) * 3600000);
  70. }
  71. }
  72. </script>
  73. </body>
  74. </html>