To show the flexibility of the provided network speed tester service we will build now a small app having some basic UI that will use the whole test suite.
<html> <head> <link rel="stylesheet" href="../bins/lib/bootstrap/css/bootstrap.min.css"/> <script type="text/javascript" src="../bins/lib/angular/angular.min.js"></script> <script type="text/javascript" src="../bins/wl-ng-network-speed-tester.js"></script> </head> <body> <div class="well well-sm" ng-app="demo-app" ng-controller="demoAppController"> <div><b>Ping time:</b> {{pingTime}} seconds</div> <div><b>Download info:</b> {{downloadData}}</div> <div><b>Upload info:</b> {{uploadData}}</div> <br/> <button class="btn btn-default" ng-click="refresh()"><span class="glyphicon glyphicon-refresh"></span> Refresh</button> </div> <script type="text/javascript"> //must set the bins url angular.module('wl-ng-network-speed-tester').value('bins', '../bins'); //create an AngularJS module with a dependency to our bandwidth tester var demoApp = angular.module('demo-app', ['wl-ng-network-speed-tester']); //declare a controller with a dependency on network speed services demoApp.controller('demoAppController', function($scope, wlNgNSTService, wlNgNSTDataGenerator) { //initialize the scope $scope.pingTime = 0; $scope.downloadData = {}; $scope.uploadData = {}; //generate 1Mb of data to upload var uploadData = wlNgNSTDataGenerator.generate(102400); //refresh will be called from UI $scope.refresh = function() { wlNgNSTService.ping() .then(function(pingTime) { $scope.pingTime = pingTime; }, function(error) { $scope.pingTime = 0; }); wlNgNSTService.download() .then(function(ret) { $scope.downloadData = ret; }, function(error) { $scope.downloadData = {}; }); wlNgNSTService.upload(uploadData) .then(function(ret) { $scope.uploadData = ret; }, function(error) { $scope.uploadData = {}; }); }; $scope.refresh(); }); </script> </body> </html>
The result:
WiseLoop JavaScript Network Speed Tester is an AngularJS module designed to offer a network bandwidth check against your internet server. Many server types are supported such as Apache HTTP, IIS, Node.js, nginx, Tomcat, Oracle HTTP, jetty and based on the download speed, it can also offer an estimation of internet cost that the user should pay for.