index.aspx 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <link rel="stylesheet" href="themes/base/ui.all.css"/>
  5. <script type="text/javascript" src="jquery-1.3.1.min.js"></script>
  6. <script type="text/javascript" src="jquery.query-2.0.1.js"></script>
  7. <script type="text/javascript" src="ui.core.min.js"></script>
  8. <script type="text/javascript" src="ui.progressbar.min.js"></script>
  9. <script type="text/javascript" src="config.js"></script>
  10. <script type="text/javascript">
  11. <!--
  12. var start_time = 0;
  13. function Timer()
  14. {
  15. this.startTime = 0;
  16. this.endTime = 0;
  17. Timer.prototype.Reset = function()
  18. {
  19. this.startTime = new Date().getTime();
  20. this.endTime = 0;
  21. }
  22. Timer.prototype.Stop = function()
  23. {
  24. this.endTime = new Date().getTime();
  25. return this.endTime - this.startTime;
  26. }
  27. Timer.prototype.Value = function()
  28. {
  29. var end = this.endTime;
  30. if( end == 0 && this.startTime != 0 )
  31. end = new Date().getTime();
  32. return end - this.startTime;
  33. }
  34. this.Reset();
  35. }
  36. Number.prototype.timeString = function()
  37. {
  38. if( this >= 1000 )
  39. return roundNumber( this / 1000, 2 ).toString() + " s";
  40. return this.toString() + " ms";
  41. }
  42. Number.prototype.speedString = function()
  43. {
  44. if( this >= 1000 )
  45. return roundNumber( this / 1000, 1 ).toString() + " Mbit/s";
  46. return this.toString() + " kbit/s";
  47. }
  48. function WebClientRequest( method, url )
  49. {
  50. this.timer = new Timer;
  51. this.url = url;
  52. this.data = "";
  53. this.method = method;
  54. this.GetResponse = function(readData) {
  55. var response = new WebClientResponse(this, readData);
  56. this.timer.Reset();
  57. $.ajax({
  58. url: this.url,
  59. cache: false,
  60. async: false,
  61. processData: false,
  62. data: this.data,
  63. type: this.method,
  64. dataType: "text",
  65. contentType: "text/plain; charset=x-user-defined",
  66. complete: response.InternalRequestCompleted(),
  67. beforeSend: function(xhr) {
  68. xhr.setRequestHeader("Accept-Encoding", "identity;q=1,gzip;q=0");
  69. },
  70. error: function(e) {
  71. if (e.status == 200)
  72. return; // We do get here in IE7 on Vista, even though the request performed well..
  73. if (e.status == 405)
  74. alert("Your web server does not allow HTTP POST to this HTML file.\nPlease review your configuration.");
  75. }
  76. });
  77. return response;
  78. };
  79. }
  80. function WebClientResponse( request, readData )
  81. {
  82. this.request = request;
  83. this.readData = readData;
  84. this.data = "";
  85. this.status = "";
  86. this.statusText = "";
  87. this.contentLength = 0;
  88. this.bytesTransferred = 0;
  89. this.GetTime = function() { return this.request.timer.Value(); }
  90. this.GetSpeed = function() { return roundNumber( ( this.bytesTransferred * 0.008 ) / ( this.GetTime() / 1000 ), 0 ); }
  91. this.InternalRequestCompleted = function() {
  92. var response = this;
  93. return function(xhr) {
  94. response.status = xhr.status;
  95. response.statusText = xhr.statusText;
  96. var contentLengthHeader = xhr.getResponseHeader("Content-Length");
  97. if (null != contentLengthHeader && contentLengthHeader.length > 0)
  98. response.contentLength = parseInt(contentLengthHeader);
  99. else if (null != xhr.responseText)
  100. response.contentLength = xhr.responseText.length;
  101. else
  102. response.contentLength = 0;
  103. if (response.request.method == "POST")
  104. response.contentLength = request.data.length;
  105. if (response.request.method != "HEAD")
  106. response.bytesTransferred = response.contentLength;
  107. if (response.readData)
  108. response.data = xhr.responseText;
  109. response.request.timer.Stop();
  110. }
  111. };
  112. }
  113. function WebClient()
  114. {
  115. WebClient.prototype.Download = function( url, readData )
  116. {
  117. if (url.indexOf("?") == -1)
  118. qs = '?sid=' + Math.random();
  119. else
  120. qs = '&sid=' + Math.random();
  121. return new WebClientRequest("GET", url + qs).GetResponse(readData);
  122. };
  123. WebClient.prototype.Upload = function(url, data) {
  124. if (url.indexOf("?") == -1)
  125. qs = '?sid=' + Math.random();
  126. else
  127. qs = '&sid=' + Math.random();
  128. var request = new WebClientRequest("POST", url + qs);
  129. request.data = data;
  130. return request.GetResponse();
  131. };
  132. WebClient.prototype.Ping = function( url )
  133. {
  134. return new WebClientRequest( "HEAD", url ).GetResponse();
  135. };
  136. }
  137. Test.SmallFilePath = "data_100k.txt";
  138. Test.LargeFilePath = "data_1600k.txt";
  139. Test.Download = "DOWNLOAD";
  140. Test.Upload = "UPLOAD";
  141. function Test()
  142. {
  143. this.timer = new Timer;
  144. this.webClient = new WebClient;
  145. this.progressCallback = function() {};
  146. this.completionCallback = function() {};
  147. this.progressValue = 0;
  148. this.maxProgressValue = 0;
  149. this.path = "";
  150. this.last = null;
  151. this.ping = null;
  152. Test.prototype.Start = function()
  153. {
  154. var test = this;
  155. setTimeout( function()
  156. {
  157. test.timer.Reset();
  158. test.Run( function()
  159. {
  160. test.progressValue++;
  161. if( null != test.progressCallback )
  162. {
  163. test.progressCallback();
  164. }
  165. },
  166. function()
  167. {
  168. test.timer.Stop();
  169. if( null != test.completionCallback )
  170. test.completionCallback();
  171. } );
  172. }, 10 );
  173. }
  174. Test.prototype.Run = function( updateProgress, completed ) {}
  175. Test.prototype.MakeRequest = function() {
  176. if (this.path == null || this.path.length == 0)
  177. return;
  178. if (this.method == Test.Upload) {
  179. if (this.payload == null) {
  180. //var dl = this.webClient.Ping(this.path);
  181. //this.payload = this.GenerateData(dl.contentLength);
  182. this.payload = this.GenerateData(100000);
  183. }
  184. this.last = this.webClient.Upload(location.search, this.payload);
  185. }
  186. else if (this.method == Test.Download) {
  187. this.last = this.webClient.Download(this.path);
  188. }
  189. this.ping = this.webClient.Ping("?");
  190. }
  191. Test.prototype.GenerateData = function(length) {
  192. var data = "";
  193. while (data.length < length) {
  194. data = data + Math.random();
  195. }
  196. return data;
  197. }
  198. Test.prototype.OnProgress = function( progressCallback )
  199. {
  200. this.progressCallback = progressCallback;
  201. return this;
  202. }
  203. Test.prototype.OnComplete = function( completionCallback )
  204. {
  205. this.completionCallback = completionCallback;
  206. return this;
  207. }
  208. Test.prototype.Path = function( path )
  209. {
  210. this.path = path;
  211. return this;
  212. }
  213. Test.prototype.Method = function( method )
  214. {
  215. this.method = method;
  216. return this;
  217. }
  218. }
  219. AverageTest.prototype = new Test;
  220. function AverageTest()
  221. {
  222. this.iterations = 0;
  223. this.iteration = 0;
  224. this.totalBytes = 0;
  225. this.totalSpeed = 0;
  226. this.totalTime = 0;
  227. this.totalPing = 0;
  228. this.iterationCallback = function() {};
  229. Test.apply( this, arguments );
  230. AverageTest.prototype.Run = function( incrementProgress, completed )
  231. {
  232. this.maxProgressValue = this.iterations;
  233. if( !this.IsCompleted() )
  234. {
  235. this.Iterate();
  236. if( this.last == null )
  237. return;
  238. this.iteration++;
  239. incrementProgress();
  240. var test = this;
  241. setTimeout( function() { test.Run( incrementProgress, completed ); }, 1 );
  242. }
  243. else
  244. completed();
  245. }
  246. AverageTest.prototype.IsCompleted = function()
  247. {
  248. return this.iterations == this.iteration;
  249. }
  250. AverageTest.prototype.GetAverageTime = function()
  251. {
  252. return roundNumber( this.totalTime / this.iteration, 2 );
  253. }
  254. AverageTest.prototype.GetAveragePing = function()
  255. {
  256. return roundNumber( this.totalPing / this.iteration, 2 );
  257. }
  258. AverageTest.prototype.GetAverageSpeed = function()
  259. {
  260. return roundNumber( this.totalSpeed / this.iteration, 1 );
  261. }
  262. AverageTest.prototype.GetTotalTime = function()
  263. {
  264. return this.totalTime;
  265. }
  266. AverageTest.prototype.Iterate = function()
  267. {
  268. this.MakeRequest();
  269. if( this.last != null )
  270. {
  271. this.totalBytes += this.last.contentLength;
  272. this.totalSpeed += this.last.GetSpeed();
  273. this.totalTime += this.last.GetTime();
  274. this.totalPing += this.ping.GetTime();
  275. }
  276. }
  277. AverageTest.prototype.Iterations = function( number )
  278. {
  279. this.iterations = number;
  280. return this;
  281. }
  282. AverageTest.prototype.AfterIteration = function( iterationCallback )
  283. {
  284. this.iterationCallback = iterationCallback;
  285. return this;
  286. }
  287. }
  288. function roundNumber(num, dec)
  289. {
  290. var result = Math.round(num*Math.pow(10,dec))/Math.pow(10,dec);
  291. return result;
  292. }
  293. function EndTest( upload, download )
  294. {
  295. var totalTime = upload.GetTotalTime() + download.GetTotalTime();
  296. var avgTime = roundNumber( ( upload.GetAveragePing() + download.GetAveragePing() ) / 2, 2 );
  297. var tbl = $( "#tblSample" );
  298. var rows = $( "tr", tbl );
  299. row = $( "<tr/>" ).appendTo( tbl ).css( "background-color", "#cfcfcf" );
  300. $( row ).append( "<td colspan=8>Total time " + totalTime.timeString() + ", average response time " + avgTime.timeString() + "</td>" );
  301. $( "#startTestButton" ).removeAttr( "disabled" ).val( Strings.StartTest );
  302. $( "#testInProgress" ).hide( "normal" );
  303. var avgUlSpeed = upload.GetAverageSpeed();
  304. var avgDlSpeed = download.GetAverageSpeed();
  305. SetInfo( avgUlSpeed.speedString(), avgTime.timeString(), upload.method );
  306. SetInfo( avgDlSpeed.speedString(), avgTime.timeString(), download.method );
  307. var title = "";
  308. var message = "";
  309. if( avgUlSpeed < Settings.MinimumUlSpeed || isNaN( avgUlSpeed ) ||
  310. avgDlSpeed < Settings.MinimumDlSpeed || isNaN( avgDlSpeed ) ||
  311. avgTime > Settings.MaximumTime || isNaN( avgTime ) )
  312. {
  313. title = Strings.TestFailed.Title;
  314. message = Strings.TestFailed.Message;
  315. }
  316. else
  317. {
  318. title = Strings.TestPassed.Title;
  319. message = Strings.TestPassed.Message;
  320. }
  321. var res = $( "#resultMessage" );
  322. res.children( ".result-title" ).text( title );
  323. res.children( ".result-message" ).text( message );
  324. res.show( "fast" );
  325. }
  326. function StartTest( count )
  327. {
  328. $( "#resultMessage" ).hide( "fast" );
  329. $( "#startTestButton" ).attr( "disabled", "disabled" );
  330. UpdateProgress( 0 );
  331. $( "#testInProgress" ).show( "normal", function() { TestStarted( count ); } );
  332. }
  333. function TestStarted( count )
  334. {
  335. if( "" != $.query.get("details" ))
  336. Settings.Debug = true;
  337. if( Settings.Debug )
  338. $( "#technicalDetails" ).show( "fast" );
  339. var tbl = $( "#tblSample" );
  340. $( "tr", tbl ).remove();
  341. var upload = new AverageTest()
  342. .Iterations( count / 2 )
  343. .Path( Test.SmallFilePath )
  344. .Method( Test.Upload )
  345. .OnProgress( function()
  346. {
  347. var progressPercentage = this.progressValue / ( this.maxProgressValue / 100 ) / 2;
  348. UpdateProgress( progressPercentage );
  349. AppendDetailsRow( this );
  350. } );
  351. var download = new AverageTest()
  352. .Iterations( count / 2 )
  353. .Path( Test.SmallFilePath )
  354. .Method( Test.Download )
  355. .OnProgress( function()
  356. {
  357. var progressPercentage = this.progressValue / (this.maxProgressValue / 100 ) / 2 + 50;
  358. UpdateProgress( progressPercentage );
  359. AppendDetailsRow( this );
  360. } );
  361. download.OnComplete( function() { EndTest( upload, download ); } );
  362. upload.OnComplete( function() { download.Start(); } ).Start();
  363. }
  364. function UpdateProgress( value )
  365. {
  366. $( "#progressbar" ).children( ".ui-progressbar-value" ).css( "width", value + "%" );
  367. }
  368. function AppendDetailsRow( test )
  369. {
  370. var tbl = $( "#tblSample" );
  371. var rows = $( "tr", tbl );
  372. row = $( "<tr/>" ).appendTo( tbl ).css( "background-color", ( test.iteration % 2 ) ? "#eeeeee" : "#ffffff" );
  373. var speed = test.last.GetSpeed().speedString();
  374. var time = test.last.GetTime().timeString();
  375. var addCol = function( text ) { $("<td/>" ).append( text ).appendTo( row ); };
  376. addCol( test.method + " " + test.iteration )
  377. addCol( time );
  378. addCol( test.ping.GetTime().timeString() );
  379. addCol( window.location.host );
  380. addCol( test.last.request.url );
  381. addCol( test.last.contentLength );
  382. addCol( test.last.status );
  383. addCol( speed );
  384. SetInfo( speed, test.ping.GetTime(), test.method );
  385. }
  386. var ulSpeed = $.query.get( "ul" );
  387. if( "" != ulSpeed )
  388. {
  389. Settings.MinimumUlSpeed = parseInt( ulSpeed );
  390. }
  391. var dlSpeed = $.query.get( "dl" );
  392. if( "" != dlSpeed )
  393. {
  394. Settings.MinimumDlSpeed = parseInt( dlSpeed );
  395. }
  396. var qsTime = $.query.get( "time" );
  397. if( "" != qsTime )
  398. {
  399. Settings.MaximumTime = parseInt( qsTime );
  400. }
  401. function SetInfo( speedtext, timetext, testMethod )
  402. {
  403. $( ( testMethod == Test.Download ) ? "#currentdlspeed" : "#currentulspeed" ).text( speedtext );
  404. $( "#currenttime" ).text( timetext );
  405. }
  406. var count = $.query.get( "count" );
  407. if( count == "" || count > 100 )
  408. count = Settings.RequestCount;
  409. $( function()
  410. {
  411. $( "#startTestButton" ).removeAttr( "disabled" ).val( Strings.StartTest ).click( function() { StartTest( count ) } );
  412. $( "#requiredulspeed" ).text( Settings.MinimumUlSpeed.speedString() );
  413. $( "#requireddlspeed" ).text( Settings.MinimumDlSpeed.speedString() );
  414. $( "#requiredtime" ).text( Settings.MaximumTime.timeString() );
  415. $( "#progressbar" ).progressbar();
  416. document.title = Strings.Title;
  417. $( "#title" ).text( Strings.Title );
  418. $( "#subtitle" ).text( Strings.SubTitle );
  419. $( "#testInProgressLabel" ).text( Strings.TestInProgress );
  420. $( "#logo" ).attr( "src", Settings.Logo );
  421. });
  422. -->
  423. </script>
  424. <style type="text/css">
  425. body,html,form, table, input, div, select
  426. {
  427. font-size:8pt;
  428. font-family:verdana, arial, helvetica, sans-serif;
  429. }
  430. H3
  431. {
  432. font-family: Times New Roman;
  433. font-size: large;
  434. }
  435. H4
  436. {
  437. font-family: Times New Roman;
  438. font-size: 12pt;
  439. }
  440. THEAD
  441. {
  442. background-color: #D7E1F5;
  443. }
  444. #resultMessage H4
  445. {
  446. font-family: Arial, Helvetica, Sans Serif;
  447. font-size: 9pt;
  448. font-weight: bold;
  449. }
  450. #progressbar
  451. {
  452. margin-bottom: 30px;
  453. margin-top: 30px;
  454. }
  455. #testInProgress
  456. {
  457. display: none;
  458. margin-top: 30px;
  459. }
  460. #buttonPanel
  461. {
  462. float: right;
  463. }
  464. #resultMessage
  465. {
  466. display: none;
  467. margin-left: auto;
  468. margin-right: auto;
  469. width: 400px;
  470. }
  471. #statusContainer
  472. {
  473. margin-top: 10px;
  474. margin-bottom: 10px;
  475. min-height: 50px;
  476. position: relative;
  477. }
  478. #technicalDetails
  479. {
  480. display: none;
  481. margin-top: 40px;
  482. margin-left: 50px;
  483. margin-right: 50px;
  484. }
  485. #mainContentFrame
  486. {
  487. width: 480px;
  488. margin-left: auto;
  489. margin-right: auto
  490. }
  491. #mainContentFrame .border
  492. {
  493. border: 20px solid #dedede;
  494. padding: 30px
  495. }
  496. </style>
  497. <title></title>
  498. </head>
  499. <body>
  500. <div id="mainContentFrame">
  501. <img id="logo"/>
  502. <div class="border">
  503. <div>
  504. <h3 id="title"></h3>
  505. <span id="subtitle"></span>
  506. </div>
  507. <div id="statusContainer">
  508. <div id="resultMessage">
  509. <h4 class="result-title"></h4>
  510. <div class="result-message"></div>
  511. </div>
  512. <div id="testInProgress">
  513. <img src="loading.gif" width="16" height="16" align="absmiddle"/> <span id="testInProgressLabel"></span>
  514. </div>
  515. </div>
  516. <div id="progressPanel">
  517. <div id="progressbar"></div>
  518. </div>
  519. <div id="buttonPanel">
  520. <form>
  521. <input type="button" id="startTestButton"/>
  522. </form>
  523. </div>
  524. </div>
  525. </div>
  526. <div id="technicalDetails">
  527. Download speed: <span id="currentdlspeed"></span>
  528. &nbsp;(required minimum: <span id="requireddlspeed"></span>)
  529. <br/>
  530. Upload speed: <span id="currentulspeed"></span>
  531. &nbsp;(required minimum: <span id="requiredulspeed"></span>)
  532. <br/>
  533. Response time: <span id="currenttime"></span>
  534. &nbsp;(required maximum: <span id="requiredtime"></span>)
  535. <br/>
  536. <table width="100%" border="0">
  537. <thead>
  538. <tr>
  539. <td>Test</td>
  540. <td>Transfer Time</td>
  541. <td>Ping</td>
  542. <td>Host</td>
  543. <td>Path</td>
  544. <td>Bytes</td>
  545. <td>Status</td>
  546. <td>Speed</td>
  547. </tr>
  548. </thead>
  549. <tbody id="tblSample">
  550. </tbody>
  551. </table>
  552. </div>
  553. </body>
  554. </html>