<link rel=„stylesheet” type=„text/css” media=„all” href=„http://www.sloneczko.net/pomoc/speedtest.css” />

  <script src="http://www.sloneczko.net/pomoc/raphael-min.js"></script>
  <script src="http://www.sloneczko.net/pomoc/justgage.min.js"></script>
  <script type="text/javascript">
      var w = null
      var ggdl, ggul, ggping
      function runTest() {
          w = new Worker('http://www.sloneczko.net/pomoc/speedtest_worker.min.js')
          var interval = setInterval(function () { w.postMessage('status') }, 100)
          document.getElementById('abortBtn').style.display = ''
          document.getElementById('startBtn').style.display = 'none'
          w.onmessage = function (event) {
              var data = event.data.split(';')
              var status = Number(data[0])
              if (status >= 4) {
                  clearInterval(interval)
                  document.getElementById('abortBtn').style.display = 'none'
                  document.getElementById('startBtn').style.display = ''
                  w = null
              }
              updateGauge(ggdl, data[1])
              updateGauge(ggul, data[2])
              updateGauge(ggping, data[3])
              document.getElementById('ip').textContent = 'Your IP: ' + data[4]
              updateGauge(ggjitter, data[5])
          }
          w.postMessage('start {"time_ul": "10", "time_dl": "10", "count_ping": "50", "url_dl": "garbage.php", "url_ul": "empty.php", "url_ping": "empty.php", "url_getIp": "getIP.php"}')
      }
      function abortTest() {
          if (w) w.postMessage('abort')
      }

      document.addEventListener('DOMContentLoaded', function (event) {
          ggdl = new JustGage({
              id: 'ggdl',
              title: 'Download',
              label: 'Mbit/s',
              titleFontFamily: 'Open Sans',
              valueFontFamily: 'Open Sans',
              refreshAnimationTime: 300,
              value: 0,
              min: 0,
              max: 10,
              decimals: 2,
              formatNumber: true,
              humanFriendly: false,
              levelColors: [
                  '#999999',
                  '#339933'
              ]
          })

          ggul = new JustGage({
              id: 'ggul',
              title: 'Upload',
              label: 'Mbit/s',
              titleFontFamily: 'Open Sans',
              valueFontFamily: 'Open Sans',
              refreshAnimationTime: 300,
              value: 0,
              min: 0,
              max: 10,
              decimals: 2,
              formatNumber: true,
              humanFriendly: false,
              levelColors: [
                  '#999999',
                  '#333399'
              ]

          })

        
      })

      function updateGauge(gauge, value) {
          // Alway use next power of 2 as maximum
          var max = Math.max(Math.pow(2, Math.ceil(Math.log2(value))), gauge.config.max)
          // Refresh the gauge
          gauge.refresh(value, max)
      }
  </script>
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,700|Roboto:400,500,700" rel="stylesheet">

 <div id="testArea">
      <div class="meter" id="ggdl"></div>
      <div class="meter" id="ggul"></div>
  </div>
  <div id="ip"></div>
  <div>
      <a href="javascript:runTest()" id="startBtn" class="button" style="display: inline-block; margin: 10px 5px 0 2px; padding:16px 40px; border-radius: 5px; font-size: 18px; border: none;  background: #E60000; color: white; cursor: pointer; text-transform: uppercase; font-weight: 700; font-family: 'Roboto';">Start</a>
      <a href="javascript:abortTest()" id="abortBtn" class="button" style="display:none; margin: 10px 5px 0 2px; padding:16px 40px; border-radius: 5px; font-size: 18px; border: none;  background: #E60000; color: white; cursor: pointer; text-transform: uppercase; font-weight: 700; font-family: 'Roboto';"">Abort</a>
  </div>