From a9adc15ce94635de1937157f0a5def992685dc31 Mon Sep 17 00:00:00 2001 From: Maddie Zhan Date: Fri, 17 Sep 2021 19:58:00 +0800 Subject: [PATCH] Sync frontend components with PHP version --- assets/example-multipleServers-full.html | 461 ---------- assets/example-multipleServers-pretty.html | 225 ----- assets/example-singleServer-basic.html | 38 - assets/example-singleServer-chart.html | 256 ------ .../example-singleServer-customSettings.html | 174 ---- assets/example-singleServer-full.html | 365 -------- assets/example-singleServer-gauges.html | 262 ------ assets/example-singleServer-pretty.html | 192 ---- assets/example-singleServer-progressBar.html | 212 ----- assets/index.html | 826 +++++++++++------- assets/linode.html | 508 +++++++++++ assets/speedtest.js | 30 +- assets/speedtest_worker.js | 29 +- 13 files changed, 1030 insertions(+), 2548 deletions(-) delete mode 100644 assets/example-multipleServers-full.html delete mode 100644 assets/example-multipleServers-pretty.html delete mode 100644 assets/example-singleServer-basic.html delete mode 100644 assets/example-singleServer-chart.html delete mode 100644 assets/example-singleServer-customSettings.html delete mode 100644 assets/example-singleServer-full.html delete mode 100644 assets/example-singleServer-gauges.html delete mode 100644 assets/example-singleServer-pretty.html delete mode 100644 assets/example-singleServer-progressBar.html create mode 100644 assets/linode.html mode change 100644 => 100755 assets/speedtest.js mode change 100644 => 100755 assets/speedtest_worker.js diff --git a/assets/example-multipleServers-full.html b/assets/example-multipleServers-full.html deleted file mode 100644 index a4c6b1a..0000000 --- a/assets/example-multipleServers-full.html +++ /dev/null @@ -1,461 +0,0 @@ - - - - - - - - - -LibreSpeed Example - - -

LibreSpeed Example

-
-

Selecting a server...

-
- - - - diff --git a/assets/example-multipleServers-pretty.html b/assets/example-multipleServers-pretty.html deleted file mode 100644 index 6ed98ab..0000000 --- a/assets/example-multipleServers-pretty.html +++ /dev/null @@ -1,225 +0,0 @@ - - - - - - -LibreSpeed Example - - - - - - -

LibreSpeed Example

-
-
Selecting server...
-
-
-
-
Download
-
-
Mbit/s
-
-
-
Upload
-
-
Mbit/s
-
-
-
-
-
Ping
-
-
ms
-
-
-
Jitter
-
-
ms
-
-
-
- IP Address: -
-
-Source code - - - diff --git a/assets/example-singleServer-basic.html b/assets/example-singleServer-basic.html deleted file mode 100644 index 810c548..0000000 --- a/assets/example-singleServer-basic.html +++ /dev/null @@ -1,38 +0,0 @@ - - - - - LibreSpeed Example - - - - -

LibreSpeed Example

- -

IP Address

-

- -

Download

-

- -

Upload

-

- -

Latency

-

- - - - Source code - - - diff --git a/assets/example-singleServer-chart.html b/assets/example-singleServer-chart.html deleted file mode 100644 index d0040e3..0000000 --- a/assets/example-singleServer-chart.html +++ /dev/null @@ -1,256 +0,0 @@ - - - - - LibreSpeed Example - - - - - - - - -

LibreSpeed - Chart.js example

- - Run speedtest -

Charts by Chart.js

Source code - - diff --git a/assets/example-singleServer-customSettings.html b/assets/example-singleServer-customSettings.html deleted file mode 100644 index 1a06f89..0000000 --- a/assets/example-singleServer-customSettings.html +++ /dev/null @@ -1,174 +0,0 @@ - - - - - -LibreSpeed Example - - - - - - - -

LibreSpeed Example

-
-
-
-
-
Download
-
-
Mbit/s
-
-
-
Upload
-
-
Mbit/s
-
-
-
-Source code - - - diff --git a/assets/example-singleServer-full.html b/assets/example-singleServer-full.html deleted file mode 100644 index 34a4bf4..0000000 --- a/assets/example-singleServer-full.html +++ /dev/null @@ -1,365 +0,0 @@ - - - - - - - - - -LibreSpeed Example - - -

LibreSpeed Example

-
-

- Privacy -
-
-
-
Ping
-
-
ms
-
-
-
Jitter
-
-
ms
-
-
-
-
-
Download
- -
-
Mbit/s
-
-
-
Upload
- -
-
Mbit/s
-
-
-
- -
- -
- Source code -
- - - - diff --git a/assets/example-singleServer-gauges.html b/assets/example-singleServer-gauges.html deleted file mode 100644 index 0b6c388..0000000 --- a/assets/example-singleServer-gauges.html +++ /dev/null @@ -1,262 +0,0 @@ - - - - - - - - - -LibreSpeed Example - - -

LibreSpeed Example

-
-
-
-
-
-
Ping
-
-
ms
-
-
-
Jitter
-
-
ms
-
-
-
-
-
Download
- -
-
Mbit/s
-
-
-
Upload
- -
-
Mbit/s
-
-
-
- -
-
- Source code -
- - - diff --git a/assets/example-singleServer-pretty.html b/assets/example-singleServer-pretty.html deleted file mode 100644 index eca431b..0000000 --- a/assets/example-singleServer-pretty.html +++ /dev/null @@ -1,192 +0,0 @@ - - - - - -LibreSpeed Example - - - - - - - -

LibreSpeed Example

-
-
-
-
-
Download
-
-
Mbit/s
-
-
-
Upload
-
-
Mbit/s
-
-
-
-
-
Ping
-
-
ms
-
-
-
Jitter
-
-
ms
-
-
-
- IP Address: -
-
-Source code - - - diff --git a/assets/example-singleServer-progressBar.html b/assets/example-singleServer-progressBar.html deleted file mode 100644 index ce037b6..0000000 --- a/assets/example-singleServer-progressBar.html +++ /dev/null @@ -1,212 +0,0 @@ - - - - - -LibreSpeed Example - - - - - - - -

LibreSpeed Example

-
-
-
-
-
-
Download
-
-
Mbit/s
-
-
-
Upload
-
-
Mbit/s
-
-
-
-
-
Ping
-
-
ms
-
-
-
Jitter
-
-
ms
-
-
-
- IP Address: -
-
-Source code - - - diff --git a/assets/index.html b/assets/index.html index 34a4bf4..673147b 100644 --- a/assets/index.html +++ b/assets/index.html @@ -1,326 +1,479 @@ - - - - - + + + -LibreSpeed Example + + div.testArea { + font-size: 1.5384615vw; /* 16 px */ + margin: 1rem; + width: calc(100% - 1rem - 1rem); /* subtract margins */ + } + } + + @media all and (max-width: 40em) { + /* 640 px */ + div.testArea { + font-size: 0.8em; /* 12.8 px */ + } + } + + + zzz.cat Speedtest -

LibreSpeed Example

-

- Privacy -
-
-
-
Ping
-
-
ms
-
-
-
Jitter
-
-
ms
-
-
-
-
-
Download
- -
-
Mbit/s
-
-
-
Upload
- -
-
Mbit/s
-
-
-
- -
- -
- Source code +

+
+
+
+
+
+
Download
+ +
+
Mbit/s
+
+
+
Upload
+ +
+
Mbit/s
+
+
+
Ping
+ +
+
ms
+
+ +
+
Jitter
+ +
+
ms
+
+
+
+ +
+
Privacy
+ +
- + + diff --git a/assets/linode.html b/assets/linode.html new file mode 100644 index 0000000..eed122d --- /dev/null +++ b/assets/linode.html @@ -0,0 +1,508 @@ + + + + + + + zzz.cat Speedtest + + + + + + + +
+

+
+
+
+
Download
+ +
+
Mbit/s
+
+
+
Upload
+ +
+
Mbit/s
+
+
+
Ping
+ +
+
ms
+
+ +
+
Jitter
+ +
+
ms
+
+
+
+ IP Address: +
+ +
+
+ +
Privacy
+
+ + + + diff --git a/assets/speedtest.js b/assets/speedtest.js old mode 100644 new mode 100755 index 41df073..61d0e77 --- a/assets/speedtest.js +++ b/assets/speedtest.js @@ -28,8 +28,8 @@ While in state 1, you can only add test points, you cannot change the test settings. When you're done, use selectServer(callback) to select the test point with the lowest ping. This is asynchronous, when it's done, it will call your callback function and move to state 2. Calling setSelectedServer(server) will manually select a server and move to state 2. - 2: test point selected, ready to start the test. Use start() to begin, this will move to state 3 - 3: test running. Here, your onupdate event calback will be called periodically, with data coming from the worker about speed and progress. A data object will be passed to your onupdate function, with the following items: - - dlStatus: download speed in Mbit/s - - ulStatus: upload speed in Mbit/s + - dlStatus: download speed in mbps + - ulStatus: upload speed in mbps - pingStatus: ping in ms - jitterStatus: jitter in ms - dlProgress: progress of the download test as a float 0-1 @@ -49,7 +49,7 @@ function Speedtest() { this._settings = {}; //settings for the speedtest worker this._state = 0; //0=adding settings, 1=adding servers, 2=server selection done, 3=test running, 4=done console.log( - "LibreSpeed by Federico Dossena v5.2 - https://github.com/librespeed/speedtest" + "LibreSpeed by Federico Dossena v5.2.4 - https://github.com/librespeed/speedtest" ); } @@ -69,10 +69,10 @@ Speedtest.prototype = { * Invalid values or nonexistant parameters will be ignored by the speedtest worker. */ setParameter: function(parameter, value) { - if (this._state != 0) - throw "You cannot change the test settings after adding server or starting the test"; + if (this._state == 3) + throw "You cannot change the test settings while running the test"; this._settings[parameter] = value; - if(parameter === "temeletry_extra"){ + if(parameter === "telemetry_extra"){ this._originalExtra=this._settings.telemetry_extra; } }, @@ -191,9 +191,9 @@ Speedtest.prototype = { throw "You can't select a server while the test is running"; } if (this._selectServerCalled) throw "selectServer already called"; else this._selectServerCalled=true; - /*this function goes through a list of servers. For each server, the ping is measured, then the server with the function result is called with the best server, or null if all the servers were down. + /*this function goes through a list of servers. For each server, the ping is measured, then the server with the function selected is called with the best server, or null if all the servers were down. */ - var select = function(serverList, result) { + var select = function(serverList, selected) { //pings the specified URL, then calls the function result. Result will receive a parameter which is either the time it took to ping the URL, or -1 if something went wrong. var PING_TIMEOUT = 2000; var USE_PING_TIMEOUT = true; //will be disabled on unsupported browsers @@ -201,7 +201,7 @@ Speedtest.prototype = { //IE11 doesn't support XHR timeout USE_PING_TIMEOUT = false; } - var ping = function(url, result) { + var ping = function(url, rtt) { url += (url.match(/\?/) ? "&" : "?") + "cors=true"; var xhr = new XMLHttpRequest(); var t = new Date().getTime(); @@ -217,11 +217,11 @@ Speedtest.prototype = { if (d <= 0) d = p.duration; if (d > 0 && d < instspd) instspd = d; } catch (e) {} - result(instspd); - } else result(-1); + rtt(instspd); + } else rtt(-1); }.bind(this); xhr.onerror = function() { - result(-1); + rtt(-1); }.bind(this); xhr.open("GET", url); if (USE_PING_TIMEOUT) { @@ -271,7 +271,7 @@ Speedtest.prototype = { ) bestServer = serverList[i]; } - result(bestServer); + selected(bestServer); }.bind(this); var nextServer = function() { if (i == serverList.length) { @@ -330,13 +330,13 @@ Speedtest.prototype = { console.error("Speedtest onupdate event threw exception: " + e); } if (data.testState >= 4) { + clearInterval(this.updater); + this._state = 4; try { if (this.onend) this.onend(data.testState == 5); } catch (e) { console.error("Speedtest onend event threw exception: " + e); } - clearInterval(this.updater); - this._state = 4; } }.bind(this); this.updater = setInterval( diff --git a/assets/speedtest_worker.js b/assets/speedtest_worker.js old mode 100644 new mode 100755 index 16164aa..2899e70 --- a/assets/speedtest_worker.js +++ b/assets/speedtest_worker.js @@ -7,11 +7,11 @@ // data reported to main thread var testState = -1; // -1=not started, 0=starting, 1=download test, 2=ping+jitter test, 3=upload test, 4=finished, 5=abort -var dlStatus = ""; // download speed in Mbit/s with 2 decimal digits -var ulStatus = ""; // upload speed in Mbit/s with 2 decimal digits +var dlStatus = ""; // download speed in megabit/s with 2 decimal digits +var ulStatus = ""; // upload speed in megabit/s with 2 decimal digits var pingStatus = ""; // ping in milliseconds with 2 decimal digits var jitterStatus = ""; // jitter in milliseconds with 2 decimal digits -var clientIp = ""; // client's IP address as reported by getIP +var clientIp = ""; // client's IP address as reported by getIP.php var dlProgress = 0; //progress of download test 0-1 var ulProgress = 0; //progress of upload test 0-1 var pingProgress = 0; //progress of ping+jitter test 0-1 @@ -45,10 +45,10 @@ var settings = { time_ulGraceTime: 3, //time to wait in seconds before actually measuring ul speed (wait for buffers to fill) time_dlGraceTime: 1.5, //time to wait in seconds before actually measuring dl speed (wait for TCP window to increase) count_ping: 10, // number of pings to perform in ping test - url_dl: "backend/garbage", // path to a large file or garbage.php, used for download test. must be relative to this js file - url_ul: "backend/empty", // path to an empty file, used for upload test. must be relative to this js file - url_ping: "backend/empty", // path to an empty file, used for ping test. must be relative to this js file - url_getIp: "backend/getIP", // path to getIP.php relative to this js file, or a similar thing that outputs the client's ip + url_dl: "backend/garbage.php", // path to a large file or garbage.php, used for download test. must be relative to this js file + url_ul: "backend/empty.php", // path to an empty file, used for upload test. must be relative to this js file + url_ping: "backend/empty.php", // path to an empty file, used for ping test. must be relative to this js file + url_getIp: "backend/getIP.php", // path to getIP.php relative to this js file, or a similar thing that outputs the client's ip getIp_ispInfo: true, //if set to true, the server will include ISP info with the IP address getIp_ispInfo_distance: "km", //km or mi=estimate distance from server in km/mi; set to false to disable distance estimation. getIp_ispInfo must be enabled in order for this to work xhr_dlMultistream: 6, // number of download streams to use (can be different if enable_quirks is active) @@ -61,10 +61,11 @@ var settings = { enable_quirks: true, // enable quirks for specific browsers. currently it overrides settings to optimize for specific browsers, unless they are already being overridden with the start command ping_allowPerformanceApi: true, // if enabled, the ping test will attempt to calculate the ping more precisely using the Performance API. Currently works perfectly in Chrome, badly in Edge, and not at all in Firefox. If Performance API is not supported or the result is obviously wrong, a fallback is provided. overheadCompensationFactor: 1.06, //can be changed to compensatie for transport overhead. (see doc.md for some other values) - useMebibits: false, //if set to true, speed will be reported in Mibit/s instead of Mbit/s + useMebibits: false, //if set to true, speed will be reported in mebibits/s instead of megabits/s telemetry_level: 0, // 0=disabled, 1=basic (results only), 2=full (results and timing) 3=debug (results+log) - url_telemetry: "results/telemetry", // path to the script that adds telemetry data to the database - telemetry_extra: "" //extra data that can be passed to the telemetry through the settings + url_telemetry: "results/telemetry.php", // path to the script that adds telemetry data to the database + telemetry_extra: "", //extra data that can be passed to the telemetry through the settings + forceIE11Workaround: false //when set to true, it will foce the IE11 upload test on all browsers. Debug only }; var xhr = null; // array of currently active xhr requests @@ -403,8 +404,8 @@ function dlTest(done) { var speed = totLoaded / (t / 1000.0); if (settings.time_auto) { //decide how much to shorten the test. Every 200ms, the test is shortened by the bonusT calculated here - var bonus = (6.4 * speed) / 100000; - bonusT += bonus > 800 ? 800 : bonus; + var bonus = (5.0 * speed) / 100000; + bonusT += bonus > 400 ? 400 : bonus; } //update status dlStatus = ((speed * 8 * settings.overheadCompensationFactor) / (settings.useMebibits ? 1048576 : 1000000)).toFixed(2); // speed is multiplied by 8 to go from bytes to bits, overhead compensation is applied, then everything is divided by 1048576 or 1000000 to go to megabits/mebibits @@ -551,8 +552,8 @@ function ulTest(done) { var speed = totLoaded / (t / 1000.0); if (settings.time_auto) { //decide how much to shorten the test. Every 200ms, the test is shortened by the bonusT calculated here - var bonus = (6.4 * speed) / 100000; - bonusT += bonus > 800 ? 800 : bonus; + var bonus = (5.0 * speed) / 100000; + bonusT += bonus > 400 ? 400 : bonus; } //update status ulStatus = ((speed * 8 * settings.overheadCompensationFactor) / (settings.useMebibits ? 1048576 : 1000000)).toFixed(2); // speed is multiplied by 8 to go from bytes to bits, overhead compensation is applied, then everything is divided by 1048576 or 1000000 to go to megabits/mebibits