2015-10-23 23:06:02 +00:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
|
|
|
|
|
<html lang="en" ng-app="syncthing" ng-controller="relayDataController">
|
|
|
|
|
<head>
|
2017-07-15 09:54:37 +00:00
|
|
|
<meta charset="utf-8"/>
|
|
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
|
|
|
|
<meta name="description" content=""/>
|
|
|
|
|
<meta name="author" content=""/>
|
2015-10-23 23:06:02 +00:00
|
|
|
|
|
|
|
|
<title>Relay stats</title>
|
2017-07-15 09:54:37 +00:00
|
|
|
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
|
|
|
|
|
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css"/>
|
2015-10-23 23:06:02 +00:00
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
#map {
|
|
|
|
|
height: 600px;
|
|
|
|
|
}
|
|
|
|
|
.ng-cloak {
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
2015-11-22 15:33:56 +00:00
|
|
|
table {
|
2016-04-14 21:01:25 +00:00
|
|
|
font-size: 11px !important;
|
2015-11-22 15:33:56 +00:00
|
|
|
width: 100%;
|
|
|
|
|
border: 1px;
|
2016-04-14 21:01:25 +00:00
|
|
|
|
|
|
|
|
}
|
|
|
|
|
td {
|
|
|
|
|
padding: 0px !important;
|
2015-11-22 15:33:56 +00:00
|
|
|
}
|
|
|
|
|
tfoot td {
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
2015-10-23 23:06:02 +00:00
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body class="ng-cloak">
|
|
|
|
|
<div class="container">
|
2017-07-15 09:54:37 +00:00
|
|
|
<h1>Relay Pool Data</h1>
|
2016-04-14 21:01:25 +00:00
|
|
|
<div ng-if="relays === undefined" class="text-center">
|
2017-07-15 09:54:37 +00:00
|
|
|
<img src="//cdnjs.cloudflare.com/ajax/libs/galleriffic/2.0.1/css/loader.gif" alt=""/>
|
2015-10-23 23:06:02 +00:00
|
|
|
<p>Please wait while we gather data</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
2016-04-14 21:01:25 +00:00
|
|
|
<div ng-show="relays !== undefined" class="ng-hide">
|
2015-10-23 23:06:02 +00:00
|
|
|
<p>
|
|
|
|
|
Currently {{ relays.length }} relays online ({{ totals.goMaxProcs }} cores in total).
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="map"></div> <!-- Can't hide the map, otherwise it freaks out -->
|
2017-02-25 08:12:13 +00:00
|
|
|
<p>The circle size represents how much bytes the relay transferred relative to other relays</p>
|
2015-10-23 23:06:02 +00:00
|
|
|
</div>
|
2016-04-14 21:01:25 +00:00
|
|
|
<div>
|
|
|
|
|
<table class="table table-striped table-condensed table">
|
2015-11-22 15:33:56 +00:00
|
|
|
<thead>
|
|
|
|
|
<tr>
|
2016-04-14 21:01:25 +00:00
|
|
|
<th rowspan="2">Address</td>
|
|
|
|
|
<th rowspan="2">
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.numActiveSessions'; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
Sessions
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.numActiveSessions' && !sortReverse" class="fa fa-caret-down"></span>
|
|
|
|
|
<span ng-show="sortType == 'stats.numActiveSessions' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
<th rowspan="2">
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.numConnections'; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
Connections
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.numConnections' && !sortReverse" class="fa fa-caret-down"></span>
|
|
|
|
|
<span ng-show="sortType == 'stats.numConnections' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
<th rowspan="2">
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.bytesProxied'; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
Data relayed
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.bytesProxied' && !sortReverse" class="fa fa-caret-down"></span>
|
|
|
|
|
<span ng-show="sortType == 'stats.bytesProxied' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
<th colspan="6" class="text-center">Transfer rate in the last period</th>
|
|
|
|
|
<th rowspan="2">
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.uptimeSeconds'; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
Uptime hours
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.uptimeSeconds' && !sortReverse" class="fa fa-caret-down"></span>
|
2016-10-07 20:23:57 +00:00
|
|
|
<span ng-show="sortType == 'status.uptimeSeconds' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
<th rowspan="2">
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.options[\'provided-by\'] || \'\''; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
Provided by
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.options[\'provided-by\'] || \'\'' && !sortReverse" class="fa fa-caret-down"></span>
|
|
|
|
|
<span ng-show="sortType == 'stats.options[\'provided-by\'] || \'\'' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
</tr>
|
2015-11-22 15:33:56 +00:00
|
|
|
<tr>
|
2016-04-14 21:01:25 +00:00
|
|
|
<th>
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.kbps10s1m5m15m30m60m[0]'; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
10s
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[0]' && !sortReverse" class="fa fa-caret-down"></span>
|
|
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[0]' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
<th>
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.kbps10s1m5m15m30m60m[1]'; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
1m
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[1]' && !sortReverse" class="fa fa-caret-down"></span>
|
|
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[1]' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
<th>
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.kbps10s1m5m15m30m60m[2]'; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
5m
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[2]' && !sortReverse" class="fa fa-caret-down"></span>
|
|
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[2]' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
<th>
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.kbps10s1m5m15m30m60m[3]'; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
15m
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[3]' && !sortReverse" class="fa fa-caret-down"></span>
|
|
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[3]' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
<th>
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.kbps10s1m5m15m30m60m[4]'; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
30m
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[4]' && !sortReverse" class="fa fa-caret-down"></span>
|
|
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[4]' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
<th>
|
2018-04-08 19:13:55 +00:00
|
|
|
<a ng-click="sortType = 'stats.kbps10s1m5m15m30m60m[5]'; sortReverse = !sortReverse">
|
2016-04-14 21:01:25 +00:00
|
|
|
60m
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[5]' && !sortReverse" class="fa fa-caret-down"></span>
|
|
|
|
|
<span ng-show="sortType == 'stats.kbps10s1m5m15m30m60m[5]' && sortReverse" class="fa fa-caret-up"></span>
|
2016-04-14 21:01:25 +00:00
|
|
|
</a>
|
|
|
|
|
</th>
|
|
|
|
|
</tr>
|
2015-11-22 15:33:56 +00:00
|
|
|
</thead>
|
|
|
|
|
<tbody>
|
2017-06-07 22:06:00 +00:00
|
|
|
<tr ng-repeat="relay in relays | orderBy:sortType:sortReverse:sortCompare" ng-mouseover="relay.showMarker()" ng-mouseleave="relay.hideMarker()">
|
2016-04-14 21:01:25 +00:00
|
|
|
<td>{{ relay.address }}</td>
|
2018-04-08 19:13:55 +00:00
|
|
|
<td ng-if="!relay.stats" colspan="11"></td>
|
|
|
|
|
<td ng-if-start="relay.stats">{{ relay.stats.numActiveSessions }}</td>
|
|
|
|
|
<td>{{ relay.stats.numConnections }}</td>
|
|
|
|
|
<td>{{ relay.stats.bytesProxied | bytes }}</td>
|
|
|
|
|
<td>{{ relay.stats.kbps10s1m5m15m30m60m[0] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ relay.stats.kbps10s1m5m15m30m60m[1] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ relay.stats.kbps10s1m5m15m30m60m[2] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ relay.stats.kbps10s1m5m15m30m60m[3] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ relay.stats.kbps10s1m5m15m30m60m[4] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ relay.stats.kbps10s1m5m15m30m60m[5] * 128 | bytes }}/s</td>
|
|
|
|
|
<td ng-if="relay.stats.uptimeSeconds != undefined">{{ relay.stats.uptimeSeconds/60/60 | number:0 }}</td>
|
|
|
|
|
<td ng-if="relay.stats.uptimeSeconds == undefined"></td>
|
|
|
|
|
<td title="{{ relay.stats.options['provided-by'] || '' }}" ng-if-end>
|
|
|
|
|
{{ relay.stats.options['provided-by'] || '' | limitTo:50 }}
|
|
|
|
|
<span ng-if="(relay.stats.options['provided-by'] || '').length > 50">…
|
2016-04-14 21:01:25 +00:00
|
|
|
</td>
|
2015-11-22 15:33:56 +00:00
|
|
|
</tr>
|
|
|
|
|
</tbody>
|
|
|
|
|
<tfoot>
|
|
|
|
|
<tr>
|
|
|
|
|
<td>Totals</td>
|
|
|
|
|
<td>{{ totals.numActiveSessions }}</td>
|
|
|
|
|
<td>{{ totals.numConnections }}</td>
|
|
|
|
|
<td>{{ totals.bytesProxied | bytes }}</td>
|
|
|
|
|
<td>{{ totals.kbps10s1m5m15m30m60m[0] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ totals.kbps10s1m5m15m30m60m[1] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ totals.kbps10s1m5m15m30m60m[2] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ totals.kbps10s1m5m15m30m60m[3] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ totals.kbps10s1m5m15m30m60m[4] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ totals.kbps10s1m5m15m30m60m[5] * 128 | bytes }}/s</td>
|
|
|
|
|
<td>{{ totals.uptimeSeconds/60/60 | number:0 }} hours</td>
|
2016-04-14 21:01:25 +00:00
|
|
|
<td>{{ relays.length }} relays</td>
|
2015-11-22 15:33:56 +00:00
|
|
|
</tr>
|
|
|
|
|
</tfoor>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
2016-04-13 20:34:11 +00:00
|
|
|
<hr>
|
|
|
|
|
<p>
|
|
|
|
|
This product includes GeoLite2 data created by MaxMind, available from
|
|
|
|
|
<a href="http://www.maxmind.com">http://www.maxmind.com</a>.
|
|
|
|
|
</p>
|
2015-10-23 23:06:02 +00:00
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
2017-07-15 09:54:37 +00:00
|
|
|
<script type="text/javascript" src="//code.jquery.com/jquery-2.1.4.min.js"></script>
|
|
|
|
|
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
|
|
|
|
|
<script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
|
|
|
|
|
<script type="text/javascript" src="//maps.googleapis.com/maps/api/js"></script>
|
2015-10-23 23:06:02 +00:00
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
angular.module('syncthing', [
|
|
|
|
|
])
|
2015-11-22 15:33:56 +00:00
|
|
|
.config(function($httpProvider) {
|
|
|
|
|
$httpProvider.defaults.timeout = 5000;
|
|
|
|
|
})
|
2015-10-23 23:06:02 +00:00
|
|
|
.filter('bytes', function() {
|
|
|
|
|
return function(bytes, precision) {
|
|
|
|
|
if (isNaN(parseFloat(bytes)) || !isFinite(bytes)) return '-';
|
|
|
|
|
if (typeof precision === 'undefined') precision = 1;
|
|
|
|
|
|
|
|
|
|
var units = ['bytes', 'kB', 'MB', 'GB', 'TB', 'PB'],
|
|
|
|
|
number = Math.floor(Math.log(bytes) / Math.log(1024));
|
|
|
|
|
|
|
|
|
|
var value = (bytes / Math.pow(1000, Math.floor(number)));
|
|
|
|
|
if (!isFinite(value)) {
|
|
|
|
|
value = 0;
|
|
|
|
|
precision = 0;
|
|
|
|
|
}
|
|
|
|
|
if (!isFinite(number)) {
|
|
|
|
|
units = 'bytes';
|
|
|
|
|
} else {
|
|
|
|
|
units = units[number];
|
|
|
|
|
}
|
|
|
|
|
return value.toFixed(precision) + ' ' + units;
|
|
|
|
|
}
|
|
|
|
|
})
|
2015-11-22 15:33:56 +00:00
|
|
|
.controller('relayDataController', ['$scope', '$rootScope', '$http', '$q', '$compile', '$timeout', function($scope, $rootScope, $http, $q, $compile, $timeout) {
|
2015-10-23 23:06:02 +00:00
|
|
|
$scope.totals = {
|
|
|
|
|
bytesProxied: 0,
|
|
|
|
|
goMaxProcs: 0,
|
|
|
|
|
kbps10s1m5m15m30m60m: [0, 0, 0, 0, 0, 0],
|
|
|
|
|
numActiveSessions: 0,
|
|
|
|
|
numConnections: 0,
|
|
|
|
|
numPendingSessionKeys: 0,
|
|
|
|
|
numProxies: 0,
|
2015-11-22 15:33:56 +00:00
|
|
|
uptimeSeconds: 0,
|
2015-10-23 23:06:02 +00:00
|
|
|
};
|
2016-04-14 21:01:25 +00:00
|
|
|
$scope.map = new google.maps.Map(document.getElementById('map'), {
|
|
|
|
|
zoom: 1,
|
|
|
|
|
mapTypeId: google.maps.MapTypeId.ROADMAP
|
|
|
|
|
});
|
|
|
|
|
$scope.mapBounds = new google.maps.LatLngBounds();
|
|
|
|
|
$scope.tooltipTemplate = $('#infoTemplate').html();
|
|
|
|
|
$scope.usedLocations = {};
|
2018-04-08 19:13:55 +00:00
|
|
|
$scope.sortType = 'stats.numActiveSessions';
|
2016-04-14 21:01:25 +00:00
|
|
|
$scope.sortReverse = true;
|
2016-10-07 20:23:57 +00:00
|
|
|
$scope.sortCompare = function(a, b) {
|
|
|
|
|
if (a.value == b.value) {
|
|
|
|
|
return 0;
|
|
|
|
|
}
|
2018-04-08 19:13:55 +00:00
|
|
|
if (a.type == "undefined" || a.type == "null") {
|
2016-10-07 20:23:57 +00:00
|
|
|
return -1;
|
|
|
|
|
}
|
2018-04-08 19:13:55 +00:00
|
|
|
if (b.type == "undefined" || b.type == "null") {
|
2016-10-07 20:23:57 +00:00
|
|
|
return 1;
|
|
|
|
|
}
|
|
|
|
|
return a.value > b.value ? 1 : -1;
|
|
|
|
|
}
|
2015-10-23 23:06:02 +00:00
|
|
|
|
2016-10-08 09:03:53 +00:00
|
|
|
$http.get("/endpoint").then(function(response) {
|
2016-04-14 21:01:25 +00:00
|
|
|
$scope.relays = response.data.relays;
|
2015-11-22 15:33:56 +00:00
|
|
|
|
2018-04-08 19:13:55 +00:00
|
|
|
angular.forEach($scope.relays, function(relay) {
|
2016-04-14 21:01:25 +00:00
|
|
|
relay.uri = constructURI(relay.url);
|
|
|
|
|
relay.address = relay.url.split('/')[2];
|
|
|
|
|
|
|
|
|
|
addMarkerToMap(relay);
|
2015-10-23 23:06:02 +00:00
|
|
|
|
2018-04-08 19:13:55 +00:00
|
|
|
if (relay.stats) {
|
|
|
|
|
angular.forEach($scope.totals, function(value, key) {
|
|
|
|
|
if (typeof $scope.totals[key] == 'number') {
|
|
|
|
|
$scope.totals[key] += relay.stats[key];
|
|
|
|
|
} else if (typeof $scope.totals[key] == 'object' && $scope.totals[key] instanceof Array) {
|
|
|
|
|
angular.forEach($scope.totals[key], function(value, index) {
|
|
|
|
|
$scope.totals[key][index] += relay.stats[key][index];
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
2016-04-14 21:01:25 +00:00
|
|
|
});
|
|
|
|
|
|
2018-04-08 19:13:55 +00:00
|
|
|
// After the totals were calculated, add circles.
|
|
|
|
|
angular.forEach($scope.relays, function(relay) {
|
|
|
|
|
if (relay.stats) {
|
|
|
|
|
addCircleToMap(relay);
|
|
|
|
|
}
|
2015-10-23 23:06:02 +00:00
|
|
|
});
|
|
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
$scope.map.fitBounds($scope.mapBounds);
|
|
|
|
|
if ($scope.relays.length == 1) {
|
|
|
|
|
$scope.map.setZoom(13);
|
|
|
|
|
}
|
|
|
|
|
});
|
2015-10-23 23:06:02 +00:00
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
function addMarkerToMap(relay) {
|
|
|
|
|
var loc = relay.location.latitude + "," + relay.location.longitude;
|
2015-10-23 23:06:02 +00:00
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
// Deal with overlapping markers
|
|
|
|
|
while (loc in $scope.usedLocations) {
|
|
|
|
|
var locParts = loc.split(',');
|
|
|
|
|
locParts = [parseFloat(locParts[0]), parseFloat(locParts[1])];
|
|
|
|
|
locParts[Math.round(Math.random())] += 0.5 * (Math.random() >= 0.5 ? 1 : -1);
|
|
|
|
|
loc = locParts.join(',');
|
|
|
|
|
}
|
2015-10-23 23:06:02 +00:00
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
$scope.usedLocations[loc] = true;
|
2015-10-23 23:06:02 +00:00
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
var locParts = loc.split(',');
|
|
|
|
|
|
|
|
|
|
relay.marker = new google.maps.Marker({
|
|
|
|
|
map: $scope.map,
|
|
|
|
|
position: new google.maps.LatLng(locParts[0], locParts[1]),
|
|
|
|
|
title: relay.url,
|
2015-10-23 23:06:02 +00:00
|
|
|
});
|
|
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
var scope = $rootScope.$new(true);
|
|
|
|
|
scope.relay = relay;
|
2015-11-22 15:33:56 +00:00
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
relay.marker.info = new google.maps.InfoWindow({
|
|
|
|
|
content: $compile($scope.tooltipTemplate)(scope)[0],
|
|
|
|
|
});
|
2015-10-23 23:06:02 +00:00
|
|
|
|
2017-06-07 22:06:00 +00:00
|
|
|
relay.showMarker = function() {
|
2016-04-14 21:01:25 +00:00
|
|
|
relay.marker.info.open($scope.map, relay.marker);
|
2017-06-07 22:06:00 +00:00
|
|
|
}
|
2015-10-23 23:06:02 +00:00
|
|
|
|
2017-06-07 22:06:00 +00:00
|
|
|
relay.hideMarker = function() {
|
2016-04-14 21:01:25 +00:00
|
|
|
relay.marker.info.close();
|
2017-06-07 22:06:00 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
relay.marker.addListener('mouseover', relay.showMarker);
|
|
|
|
|
relay.marker.addListener('mouseout', relay.hideMarker);
|
2015-11-22 15:33:56 +00:00
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
$scope.mapBounds.extend(relay.marker.position);
|
|
|
|
|
}
|
2015-11-22 15:33:56 +00:00
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
function addCircleToMap(relay) {
|
|
|
|
|
relay.marker.circle = new google.maps.Circle({
|
|
|
|
|
strokeColor: '#FF0000',
|
|
|
|
|
strokeOpacity: 0.8,
|
|
|
|
|
strokeWeight: 2,
|
|
|
|
|
fillColor: '#FF0000',
|
|
|
|
|
fillOpacity: 0.35,
|
|
|
|
|
map: $scope.map,
|
|
|
|
|
center: relay.marker.position,
|
2018-04-08 19:13:55 +00:00
|
|
|
radius: ((relay.stats.bytesProxied * 100) / $scope.totals.bytesProxied) * 10000
|
2016-04-14 21:01:25 +00:00
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function constructURI(url) {
|
|
|
|
|
var uri = document.createElement('a');
|
2015-10-23 23:06:02 +00:00
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
// HAX, otherwise doesn't work
|
|
|
|
|
uri.href = url.replace('relay://', 'http://');
|
2015-10-23 23:06:02 +00:00
|
|
|
|
2016-04-14 21:01:25 +00:00
|
|
|
// Convert query string to object
|
|
|
|
|
uri.args = {};
|
|
|
|
|
angular.forEach(uri.search.replace(/^\?/, '').split('&'), function(query) {
|
|
|
|
|
var split = query.split('=');
|
|
|
|
|
uri.args[split[0]] = split[1];
|
2015-10-23 23:06:02 +00:00
|
|
|
});
|
2016-04-14 21:01:25 +00:00
|
|
|
|
|
|
|
|
return uri;
|
|
|
|
|
}
|
2015-10-23 23:06:02 +00:00
|
|
|
}]);
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<script type="text/template" id="infoTemplate">
|
|
|
|
|
<div>
|
2018-04-08 19:13:55 +00:00
|
|
|
<p><b>{{ relay.uri.hostname }}</b> <span ng-if="relay.stats.options['provided-by']">provided by <u>{{ relay.stats.options['provided-by'] }}</u></span></p>
|
|
|
|
|
<div ng-if="relay.stats">
|
|
|
|
|
<span ng-if="relay.stats.startTime">Start time: {{ relay.stats.startTime | date:"medium" }}</br></span>
|
|
|
|
|
<span ng-if="relay.stats.bytesProxied != undefined">Proxied: {{ relay.stats.bytesProxied | bytes }}</br></span>
|
|
|
|
|
<span ng-if="relay.stats.numActiveSessions != undefined">Sessions: {{ relay.stats.numActiveSessions }}</br></span>
|
|
|
|
|
<span ng-if="relay.stats.numConnections != undefined">Clients: {{ relay.stats.numConnections }}</br></span>
|
|
|
|
|
<span ng-if="relay.stats.options.pools">Pools: {{ relay.stats.options.pools.join(', ') }}</br></span>
|
|
|
|
|
<span ng-if="relay.stats.options['global-rate'] != undefined">
|
|
|
|
|
<span ng-if="relay.stats.options['global-rate'] > 0">Global rate limit: {{ relay.stats.options['global-rate'] | bytes }}/s</span>
|
|
|
|
|
<span ng-if="relay.stats.options['global-rate'] == 0">Global rate limit: unlimited</span>
|
2017-07-15 09:54:37 +00:00
|
|
|
<br/>
|
2015-10-23 23:06:02 +00:00
|
|
|
</span>
|
2018-04-08 19:13:55 +00:00
|
|
|
<span ng-if="relay.stats.options['per-session-rate'] != undefined">
|
|
|
|
|
<span ng-if="relay.stats.options['per-session-rate'] > 0">Session rate limit: {{ relay.stats.options['per-session-rate'] | bytes }}/s</span>
|
|
|
|
|
<span ng-if="relay.stats.options['per-session-rate'] == 0">Session rate limit: unlimited</span>
|
2017-07-15 09:54:37 +00:00
|
|
|
<br/>
|
2015-10-23 23:06:02 +00:00
|
|
|
</span>
|
|
|
|
|
</div>
|
2018-04-08 19:13:55 +00:00
|
|
|
<div ng-if="!relay.stats">
|
2015-10-23 23:06:02 +00:00
|
|
|
Data unavailable.
|
|
|
|
|
<div>
|
|
|
|
|
</div>
|
|
|
|
|
</script>
|
|
|
|
|
</html>
|
