Commit e56dd468 authored by Arne Øslebø's avatar Arne Øslebø

New version of yt

parent 04963758
......@@ -17,4 +17,4 @@
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
<script type="text/javascript" src="/js/jquery-ui-1.10.3/jquery-1.9.1.js"></script>
<script type="text/javascript" src="/mp-web/js/jquery-ui-1.10.3/jquery-1.9.1.js"></script>
......@@ -4,10 +4,10 @@
<meta http-equiv="Content-Language" content="no" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" media="all" href="/uninett-theme/css/bootstrap.css" />
<link rel="stylesheet" type="text/css" media="all" href="/uninett-theme/css/uninett.css" />
<link rel="stylesheet" type="text/css" media="all" href="/mp-web/uninett-theme/css/bootstrap.css" />
<link rel="stylesheet" type="text/css" media="all" href="/mp-web/uninett-theme/css/uninett.css" />
<!-- done in meny.html
<link rel="stylesheet" type="text/css" media="all" href="/style/mp-style.css" />
<link rel="stylesheet" type="text/css" media="all" href="/mp-web/style/mp-style.css" />
-->
<style type="text/css">
</style>
......@@ -87,7 +87,7 @@ Merk at noen av tjenestene er lukket og krever innlogging).</p>
-->
<td align=right>
<img class=pila align=right src=/images/pil_bla_t.png>
<img class=pila align=right src="/mp-web//images/pil_bla_t.png">
</table>
<!--
......@@ -132,7 +132,7 @@ Merk at noen av tjenestene er lukket og krever innlogging).</p>
<a href=https://www.uninett.no/malepale-detaljer>Tilbake</a> til detaljert informasjon om UNINETTs målepåler.
</p>
<td>
<img align=right src=/images/pil_gronn_t.png>
<img align=right src="/mp-web/images/pil_gronn_t.png">
</table>
</div>
<div id="footer">
......
......@@ -4,7 +4,7 @@
<p> <span id=tr_button></span>
<script>make_select( '#tr_button', mp_url );</script>
<div id=busy><img src=base/images/ajax-loader.gif> Testing - please wait for test to complete.<p></div>
<div id=busy><img src=/mp-web/images/ajax-loader.gif> Testing - please wait for test to complete.<p></div>
</div>
......
<!DOCTYPE html> <html lang="en">
<head>
<?php include 'base/head-bs.html'?>
<script type="text/javascript" src="base/js/jquery-ui-1.10.3/jquery-1.9.1.js"></script>
<script type="text/javascript" src="base/js/jquery-ui-1.10.3/ui/jquery-ui.js"></script>
<script type="text/javascript" src="base/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="base/js/Highcharts/js/highcharts.js"></script>
<link href="base/js/select2/select2.css" rel="stylesheet"/>
<script type="text/javascript" src="base/js/select2/select2.js"></script>
<?php include '../head-bs.html'?>
<script type="text/javascript" src="/mp-web/js/jquery-ui-1.10.3/jquery-1.9.1.js"></script>
<script type="text/javascript" src="/mp-web/js/jquery-ui-1.10.3/ui/jquery-ui.js"></script>
<script type="text/javascript" src="/mp-web/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/mp-web/js/Highcharts/js/highcharts.js"></script>
<link href="/mp-web/js/select2/select2.css" rel="stylesheet"/>
<script type="text/javascript" src="/mp-web/js/select2/select2.js"></script>
<!-- <script type="text/javascript" src=Highcharts/js/modules/exporting.js></script> -->
<!-- <script type="text/javascript" data-main="main" src="base/js/require.js"></script> -->
<!-- <link rel="stylesheet" type="text/css" media="all" href="base/style/mp-style.css" /> -->
<style type="text/css" title="currentStyle">
@import "base/js/jquery-ui-1.10.3/themes/base/jquery-ui.css";
@import "base/js/demo_page.css";
@import "base/js/jquery.dataTables_themeroller.css";
@import "/mp-web/js/jquery-ui-1.10.3/themes/base/jquery-ui.css";
@import "/mp-web/js/demo_page.css";
@import "/mp-web/js/jquery.dataTables_themeroller.css";
</style>
......@@ -22,10 +22,10 @@
</head>
<body>
<?php include 'base/body-bs.html'?>
<?php include '../body-bs.html'?>
<script>
$("#title-bs").html('<a href="https://www.uninett.no/malepale-detaljer">Mleple</a>'); // title
$('#top-menu-bs').load("base/top-menu-bs.html");
$('#top-menu-bs').load("/mp-web/top-menu-bs.html");
$('#body-bs').load("iperf-body.html", // main body content
function(responseText, textStatus, XMLHttpRequest){
$("#busy").hide();
......
......@@ -49,8 +49,6 @@ function iperf(direction, host, nobs, interval, parallel, port){
var title='Bandwidth report ' + direction + ' ' + host + ' at ' + new Date().toLocaleTimeString();
// var UWAP = require("/_/js/require.js");
document.getElementById("test-button").disabled = true;
var request = $.ajax( { url: url, dataType: 'json', timeout: (nobs+2)*1000, // in ms need +2 sec for iperf
headers: { "X-TOKEN": "virre-virre-vapp" } } );
request.fail( function( jqXHR, status, error){
......@@ -58,7 +56,6 @@ function iperf(direction, host, nobs, interval, parallel, port){
$('#traces').tabs( "enable", 1);
$('#traces').tabs({ active:1});
$("#busy").hide();
document.getElementById("test-button").disabled = false;
});
request.done( function( iperfr){
......@@ -66,7 +63,6 @@ function iperf(direction, host, nobs, interval, parallel, port){
$("#busy").hide();
$('#traces').tabs( "enable", 0);
$('#traces').tabs( "enable", 1);
document.getElementById("test-button").disabled = false;
if (iperfr.error){
$("#tracetablecontainer").prepend( '<h3>'+title + ': ' + iperfr["error"] +'</h3>'); // error message
......@@ -242,7 +238,7 @@ function make_select( elm, url){
var html='<form name="iperf_form" id="iperf_form"';
html+= 'action="javascript:iperf( $(\'#direction\').val(), $(\'#tr_host\').val(), $(\'#tr_times\').val(), $(\'#tr_interval\').val(), $(\'#tr_parallel\').val(), $(\'#tr_port\').val() )">';
html+='<table><tr><td>';
html+='<input id="test-button" class="btn btn-primary btn-lg" type="submit" value="Test" class=button/> ';
html+='<input class="btn btn-primary btn-lg" type="submit" value="Test" class=button/> ';
html+='<select id=direction style=width=6em><option value="to">to</option><option value="from">from</option></select>';
html+='<td><input id=tr_host value="" placeholder="my host" title="Automatic completion(try \'mp\')"></input>';
html+='<select id=tr_host_menu title="Choose host">host menu</select>';
......
......@@ -16,7 +16,7 @@ This implements a web front end to a json traceroute service.
<span id=tr_button></span>
<script>make_select( '#tr_button', mp_url );</script>
<div id=busy><img src=base/images/ajax-loader.gif> Traceing route - please wait at least 'times*(1+every)' seconds.<p></div>
<div id=busy><img src=/mp-web/images/ajax-loader.gif> Traceing route - please wait at least 'times*(1+every)' seconds.<p></div>
</div>
<div id=traces align=left class=datadiv>
......
<!DOCTYPE html> <html lang="en">
<head>
<?php include 'base/head-bs.html'?>
<script type="text/javascript" src="base/js/jquery-ui-1.10.3/jquery-1.9.1.js"></script>
<script type="text/javascript" src="base/js/jquery-ui-1.10.3/ui/jquery-ui.js"></script>
<script type="text/javascript" src="base/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="base/js/Highcharts/js/highcharts.js"></script>
<?php include '../head-bs.html'?>
<script type="text/javascript" src="/mp-web/js/jquery-ui-1.10.3/jquery-1.9.1.js"></script>
<script type="text/javascript" src="/mp-web/js/jquery-ui-1.10.3/ui/jquery-ui.js"></script>
<script type="text/javascript" src="/mp-web/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/mp-web/js/Highcharts/js/highcharts.js"></script>
<!-- <script type="text/javascript" src=base/Highcharts/js/modules/exporting.js></script> -->
<!-- <script type="text/javascript" data-main="main" src="base/js/require.js"></script> -->
<!-- <link rel="stylesheet" type="text/css" media="all" href="base/style/mp-style.css" /> -->
<link href="base/js/select2/select2.css" rel="stylesheet"/>
<script type="text/javascript" src="base/js/select2/select2.js"></script>
<link href="/mp-web/js/select2/select2.css" rel="stylesheet"/>
<script type="text/javascript" src="/mp-web/js/select2/select2.js"></script>
<!-- <script type="text/javascript" src="base/js/mp-select.js"></script> -->
<style type="text/css" title="currentStyle">
@import "base/js/jquery-ui-1.10.3/themes/base/jquery-ui.css";
@import "base/js/demo_page.css";
@import "base/js/jquery.dataTables_themeroller.css";
@import "/mp-web/js/jquery-ui-1.10.3/themes/base/jquery-ui.css";
@import "/mp-web/js/demo_page.css";
@import "/mp-web/js/jquery.dataTables_themeroller.css";
/* #tracetable, #tracetablecontainer, #tracetable_filter, #about, #traces, #graf, #graf1, h1, h2, h3, .ui-tabs, .highcharts-container { float: left } */
.ui-tabs { float: left }
......@@ -30,10 +30,10 @@
</head>
<body>
<?php include 'base/body-bs.html'?>
<?php include '../body-bs.html'?>
<script>
$("#title-bs").html('<a href="https://www.uninett.no/malepale-detaljer">Mleple</a>'); // title
$('#top-menu-bs').load("base/top-menu-bs.html");
$('#top-menu-bs').load("/mp-web/top-menu-bs.html");
$('#body-bs').load("traceroute-body.html", // main body content
function(responseText, textStatus, XMLHttpRequest){
$("#busy").hide();
......
<style>
th { background-color: #edebe0 }
td { text-align: right; }
.bar { text-align: left; }
</style>
<h3>Yt - Simple web throughput test</h3>
<div class="col-lg-12 gutter uninett-padded uninett-color-lightBlue">
<table><tr><td>
<!--
<form name="test_form" id="test_form" >
<input name="Submit" class="btn btn-primary btn-lg" type="submit" value="Test performance" action="JavaScript:test_performance()"/>
at about <td><form name="speedtest" id="speedform">
<select class="btn btn-basic btn-lg" name="speed_sel" id="speed_sel">
<option value="0">1-5 sec</option>
<option value="100k">100 Kbit/s</option>
<option value="1M">1 Mbit/s</option>
<option value="10M">10 Mbit/s</option>
<option value="100M" selected>100 Mbit/s</option>
<option value="1G">1 Gbit/s</option>
</select>
</form>
<button class="btn btn-primary btn-lg" id="test" onclick="test_performance()">Test throughput!</button>
-->
<b>Test</b>
<button class="btn btn-primary btn-lg" id="test"
onclick="test_performance('down')"
title="From remote host to you">Download!</button>
<button class="btn btn-primary btn-lg" id="test"
onclick="test_performance('up')"
title="From you to remote host">Upload!</button>
<button class="btn btn-primary btn-lg" id="test"
onclick="test_performance('both')"
title="Both directions">Both!</button>
<td> against <span id=host></span>
<td> with
<input name="parallels" id="parallels" size=2 value=3
title="Number of parallel transfers"> parallels
<td> for <input name="duration" id="duration" size=2 value=3
title="Approximate number of seconds to run the test - +-20%"> seconds
<td> against <span id=host
title="The host to which the test is performed"></span>
<script>$("#host").html(document.location.hostname);
</script>.
<!-- , and upload is
<select class="btn btn-primary btn-lg" name="uploadseq" id="uploadseq">
<option value="after">after</option>
<option value="simultaneous">simultaneous</option>
<!-- <option value="before">before</option>
<option value="only">no download</option>
<option value="none">no upload</option>
</select>
-->
</script>
<td><span id=loadingind></span>
</table>
<div id=resultainer>
<table id="result" class="uninett-color-white uninett-padded gutter" border=1 bgcolor=linen style=width:100%>
<tr><th id=what title="Direction of transfer and per run and average of all">What
<th title="Sum of parallels[Mbit/s]">Throughput
<th title="Average of parallels[Mbit/s]">Single
<th title="Transfer Time[seconds]">Duration
<th title="Sum data transferred in parallels[Mbyte]">Mbytes
<th title="Scale relative to the maximum seen">Throughput bar
<tr><th id=what>What<th>Mbit/s<th>Transfer Time<th>Throughput bar
<!--
<tr><td>Reference*<td><span id=reftxt><td><span id=webrtt></span>
<td><img id="refbar" src="bar-green.gif" width="1px" height="10">
-->
<tr><th title="From remote to you">Download
<td id=dlspeed><td id=dlsingle><td id=dldiff><td id=dlbytes>
<td class=bar><img id="dlbar" src="down.png" style="width: 1px; height: 10px;">
<tr><th title="Average of all runs"> -&nbsp;average
<td id=dlspeedavg><td id=dlsingleavg><td id=dldiffavg><td id=dlbytesavg>
<td class=bar><img id="dlbaravg" src="down.png" style="width: 1px; height: 10px;">
<tr><th title="From you to remote">Upload
<td id=ulspeed><td id=ulsingle><td id=uldiff><td id=ulbytes>
<td class=bar><img id="ulbar" src="up.png" style="width: 1px; height: 10px;">
<tr><th title="Average of all runs"> -&nbsp;average
<td id=ulspeedavg><td id=ulsingleavg><td id=uldiffavg><td id=ulbytesavg>
<td class=bar><img id="ulbaravg" src="up.png" style="width: 1px; height: 10px;">
<tr><td>Download<td id=dlspeed><td id=dldiff>
<td><img id="dlbar" src="down.png" style="width: 1px; height: 10px;">
<tr><td> - estimate<td id=dlspeedavg><td id=dldiffavg>
<td><img id="dlbaravg" src="down.png" style="width: 1px; height: 10px;">
<tr><td>Upload<td id=ulspeed><td id=uldiff>
<td><img id="ulbar" src="up.png" style="width: 1px; height: 10px;">
<tr><td> - estimate<td id=ulspeedavg><td id=uldiffavg>
<td><img id="ulbaravg" src="up.png" style="width: 1px; height: 10px;">
</table>
</div>
<script> // $("#resultainer").hide(); </script>
<script>$("#resultainer").hide(); </script>
<span id=response></span>
<div id=trend style=width:100%></div>
<div id=graf style=width:100%></div>
<!--
......@@ -113,30 +58,9 @@ at about <td><form name="speedtest" id="speedform">
-->
<div class="uninett-color-white uninett-padded gutter">
<h3>What</h3>
<p>This test transfers files to and from the server increasing from 25 Kbytes to 25 Mbytes by a factor of 10 until it lasts 0.5-5 seconds. <br>
<!-- It should take about 2 seconds if the chosen speed is right. -->
<p>
<ul>
<li><b>Transfer time</b> column show transfer time in seconds.<br>
<li><b>Mbit/s</b> column show the throughput i megabits per second computed as the web file transfer size by time.<br>
<li><b>Web Response Time</b> is the time for minimal sized image to be returned.
<li>The graph points show performance from the browsers progress reports per interval.
<li>The table and graph avg lines show the average speed for the whole transfer.
<li>Click on the curve names to hide/show.
<li>Select a square to zoom in
</ul>
<h3>About</h3>
<p>The measurements will show you ballpark figures and no analysis. If you want a
more indepth and accurate measurement go to the
<span id=advanced></span>
<script>$("#advanced").html('<a class="btn btn-primary btn-lg" href="http://' + document.location.hostname + '/iperf/">Advanced Iperf throughput test</a>');</script>.
<p> The results will depend on browser, operating system and direction as well as the network card setup and local TCP buffer configuration. These factors influence increase with speed and accuracy is lower for gigabit than megabit speeds.
<p>The performance testing sites like nettfart.no typically uses multiple parallel sessions. They essentially test the capacity of the network, whereas this method also give an indication of the performance you get on a single transfer and thus dependent on both the network delay, loss and the capacity.
<h4>Versjon 1.1</h4>
<ul><li>Added plot of progress reports</ul>
<p>
<p>Yt measures the maximum upload and download speed between your browser and the measurement probe. It does this by downloading and uploading a large number of files and measure the time it takes to do so. The results are presented in a graph. Consecutive measurements will be plotted in the same graph so that it is easy to compare the results.</p>
<p>If your computer is connected to a high speed network, the results from Yt will usually be limited by the browser performance and not the available network bandwidth. For more accurate measurements of the network performance try the <a href="/mp-web/iperf">Iperf measurement tool</a>.
</p>
</div>
<!DOCTYPE html> <html lang="en">
<head>
<?php include 'base/head-bs.html'?>
<?php include '../head-bs.html'?>
<style type="text/css" title="currentStyle">
@import "base/js/demo_page.css";
@import "base/js/jquery-ui-1.10.3/themes/base/jquery-ui.css";
@import "../js/demo_page.css";
@import "../js/jquery-ui-1.10.3/themes/base/jquery-ui.css";
</style>
<script type="text/javascript" src="base/js/jquery-ui-1.10.3/ui/jquery-ui.js"></script>
<script type="text/javascript" src="base/js/Highcharts/js/highcharts.js"></script>
<script type="text/javascript" src="/mp-web/js/jquery-ui-1.10.3/ui/jquery-ui.js"></script>
<script type="text/javascript" src="/mp-web/js/Highcharts/js/highcharts.js"></script>
<script type="text/javascript" src=jsbandwidth.js> </script>
</head>
<body>
<?php include 'base/body-bs.html'?>
<?php include '../body-bs.html'?>
<script>
$("#title-bs").html('<a href="https://www.uninett.no/malepale-detaljer">Mleple</a>'); // title
$('#top-menu-bs').load("base/top-menu-bs.html");
$('#top-menu-bs').load("/mp-web/top-menu-bs.html");
$('#body-bs').load("jsbandwidth-body.html", // main body content
function(responseText, textStatus, XMLHttpRequest){
});
......
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment