Apq
/
speedtest
mirror of https://github.com/librespeed/speedtest.git


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
							<!DOCTYPE html>
<html>
<head>
    <title>Speedtest</title>
    <style type="text/css">
        html,
        body {
            margin: 0;
            padding: 0;
            border: none;
            text-align: center;
        }

        div.test {
            display: inline-block;
            margin: 1em;
            text-align: center;
        }

        div.testName,
        div.meterUnit {
            font-size: 3vw;
        }

        div.meter {
            font-size: 6vw;
            line-height: 1.5em;
            height: 1.5em !important;
        }

        .flash {
            animation: flash 0.6s linear infinite;
        }

        @keyframes flash {
            0% { opacity: 0.6; }
            50% { opacity: 1; }
        }
    </style>
</head>

<body>
    <h1>Speedtest</h1>
    <div class="test">
        <div class="testName">Download</div>
        <div class="meter">&nbsp;<span id="download"></span>&nbsp;</div>
        <div class="meterUnit">Mbit/s</div>
    </div>
    <div class="test">
        <div class="testName">Upload</div>
        <div class="meter">&nbsp;<span id="upload"></span>&nbsp;</div>
        <div class="meterUnit">Mbit/s</div>
    </div>
    <div class="test">
        <div class="testName">Latency</div>
        <div class="meter">&nbsp;<span id="ping"></span>&nbsp;</div>
        <div class="meterUnit">ms</div>
    </div>
    <div class="test">
        <div class="testName">Jitter</div>
        <div class="meter">&nbsp;<span id="jitter"></span>&nbsp;</div>
        <div class="meterUnit">ms</div>
    </div>
    <div id="ip"></div>
    <script type="text/javascript">
        var w = new Worker('speedtest_worker.min.js')
        var interval = setInterval(function () { w.postMessage('status') }, 100)
        w.onmessage = function (event) {
            var data = event.data.split(';')
            var status = Number(data[0])
            var dl = document.getElementById('download')
            var ul = document.getElementById('upload')
            var ping = document.getElementById('ping')
            var ip = document.getElementById('ip')
            var jitter = document.getElementById('jitter')
            dl.className = status === 1 ? 'flash' : ''
            ping.className = status === 2 ? 'flash' : ''
            jitter.className = ul.className = status === 3 ? 'flash' : ''
            if (status >= 4) {
                clearInterval(interval)
            }
            dl.textContent = data[1]
            ul.textContent = data[2]
            ping.textContent = data[3]
            jitter.textContent = data[5]
            ip.textContent = 'Your IP: ' + data[4]
        }
        w.postMessage('start {"url_dl": "garbage.php", "url_ul": "empty.php", "url_ping": "empty.php", "time_dl": "10", "time_ul": "15", "count_ping": "30"}') // start with custom parameters. paths are relative to js file. you can omit parameters that you don't want to change
    </script>
</body>
</html>