AJ ONeal
4 years ago
14 changed files with 809 additions and 705 deletions
@ -0,0 +1,18 @@ |
|||||
|
{ "node": true |
||||
|
, "browser": true |
||||
|
, "jquery": true |
||||
|
, "globals": { "angular": true, "Promise": true } |
||||
|
|
||||
|
, "indent": 2 |
||||
|
, "onevar": true |
||||
|
, "laxcomma": true |
||||
|
, "laxbreak": true |
||||
|
, "curly": true |
||||
|
, "nonbsp": true |
||||
|
|
||||
|
, "eqeqeq": true |
||||
|
, "immed": true |
||||
|
, "undef": true |
||||
|
, "unused": true |
||||
|
, "latedef": true |
||||
|
} |
@ -0,0 +1,7 @@ |
|||||
|
{ |
||||
|
"bracketSpacing": true, |
||||
|
"printWidth": 120, |
||||
|
"tabWidth": 4, |
||||
|
"trailingComma": "none", |
||||
|
"useTabs": false |
||||
|
} |
@ -1,110 +1,124 @@ |
|||||
<!DOCTYPE html> |
<!DOCTYPE html> |
||||
<html lang="en"> |
<html lang="en"> |
||||
<head> |
|
||||
<title>Websock VPN Instrumentation</title> |
|
||||
</head> |
|
||||
<body ng-app="vpnAdmin" ng-controller="vpnInstrumentationController"> |
|
||||
|
|
||||
<div class="panel panel-default panel-primary"> |
|
||||
<div class="panel-heading">VPN Instrumentation</div> |
|
||||
<div class="panel-body"> |
|
||||
<div class="panel panel-default panel-info"> |
|
||||
<div class="panel-heading ">Control Plane</div> |
|
||||
<div class="panel-body"> |
|
||||
|
|
||||
<div class="row"> <!-- Auth --> |
|
||||
<div class="col-lg-6"> |
|
||||
<div class="input-group"> |
|
||||
<span class="input-group-btn"> |
|
||||
<button class="btn btn-default" type="button" ng-click="startWebSocket()">Start WebSocket</button> |
|
||||
</span> |
|
||||
<button class="btn btn-default" type="button" ng-class="conn == false && 'btn-danger' || 'btn-success'"> |
|
||||
{[{ conn == false && 'False' || 'True' }]} |
|
||||
</button> |
|
||||
|
<head> |
||||
|
<title>Websock VPN Instrumentation</title> |
||||
|
</head> |
||||
|
<body ng-app="vpnAdmin" ng-controller="vpnInstrumentationController"> |
||||
|
<div class="panel panel-default panel-primary"> |
||||
|
<div class="panel-heading">VPN Instrumentation</div> |
||||
|
<div class="panel-body"> |
||||
|
<div class="panel panel-default panel-info"> |
||||
|
<div class="panel-heading">Control Plane</div> |
||||
|
<div class="panel-body"> |
||||
|
<div class="row"> |
||||
|
<!-- Auth --> |
||||
|
<div class="col-lg-6"> |
||||
|
<div class="input-group"> |
||||
|
<span class="input-group-btn"> |
||||
|
<button class="btn btn-default" type="button" ng-click="startWebSocket()"> |
||||
|
Start WebSocket |
||||
|
</button> |
||||
|
</span> |
||||
|
<button |
||||
|
class="btn btn-default" |
||||
|
type="button" |
||||
|
ng-class="conn == false && 'btn-danger' || 'btn-success'" |
||||
|
> |
||||
|
{[{ conn == false && 'False' || 'True' }]} |
||||
|
</button> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
|
||||
|
|
||||
<br> |
|
||||
|
<br /> |
||||
|
|
||||
<div class="row"> |
|
||||
<div class="col-lg-6"> |
|
||||
<div class="input-group"> |
|
||||
<span class="input-group-btn"> |
|
||||
<button class="btn btn-default" type="button">Auth</button> |
|
||||
</span> |
|
||||
<input type="text" class="form-control" placeholder="Enter auth data here"> |
|
||||
|
<div class="row"> |
||||
|
<div class="col-lg-6"> |
||||
|
<div class="input-group"> |
||||
|
<span class="input-group-btn"> |
||||
|
<button class="btn btn-default" type="button">Auth</button> |
||||
|
</span> |
||||
|
<input type="text" class="form-control" placeholder="Enter auth data here" /> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
|
||||
<div class="panel panel-default panel-info"> |
|
||||
<div class="panel-heading">Data</div> |
|
||||
<div class="panel-body"> |
|
||||
<p ng-repeat="text in log_elements">{[{text}]}</p> |
|
||||
|
<div class="panel panel-default panel-info"> |
||||
|
<div class="panel-heading">Data</div> |
||||
|
<div class="panel-body"> |
||||
|
<p ng-repeat="text in log_elements">{[{text}]}</p> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
|
||||
</body> |
|
||||
|
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> |
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script> |
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> |
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> |
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
console.log("startup"); |
|
||||
|
|
||||
var vpnAdmin = angular.module('vpnAdmin',[]); |
|
||||
vpnAdmin.config(function($interpolateProvider) { |
|
||||
console.log("vpnTest Config"); |
|
||||
$interpolateProvider.startSymbol('{[{'); |
|
||||
$interpolateProvider.endSymbol('}]}'); |
|
||||
}); |
|
||||
vpnAdmin.controller('vpnInstrumentationController', function ($scope) { |
|
||||
console.log("vpnInstrumentationController startup"); |
|
||||
|
|
||||
$scope.log_elements = []; |
|
||||
$scope.auth_key = ""; |
|
||||
$scope.conn = false; |
|
||||
|
|
||||
$scope.webSocketStatus = function() { |
|
||||
if ($scope.conn == false) { |
|
||||
return "" |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
$scope.startWebSocket = function() { |
|
||||
console.log("Start webSocket {{$}}"); |
|
||||
if (window["WebSocket"]) { |
|
||||
$scope.conn = new WebSocket("wss://{{$}}/ws/admin"); |
|
||||
$scope.append_log("Websocket opened"); |
|
||||
$scope.conn.onclose = function (evt) { |
|
||||
$scope.append_log("Connection closed."); |
|
||||
} |
|
||||
$scope.conn.onmessage = function (evt) { |
|
||||
$scope.append_log(evt.data) |
|
||||
} |
|
||||
} |
|
||||
else { |
|
||||
appendLog($("<div><b>Your browser does not support WebSockets.</b></div>")) |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
$scope.auth_click = function() { |
|
||||
$scope.append_log($scope.auth_key) |
|
||||
}; |
|
||||
|
|
||||
$scope.append_log = function(txt) { |
|
||||
$scope.log_elements.push(txt) |
|
||||
}; |
|
||||
|
|
||||
|
|
||||
|
|
||||
}); |
|
||||
</script> |
|
||||
|
|
||||
</html> |
|
||||
|
</body> |
||||
|
|
||||
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> |
||||
|
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script> |
||||
|
<link |
||||
|
rel="stylesheet" |
||||
|
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" |
||||
|
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" |
||||
|
crossorigin="anonymous" |
||||
|
/> |
||||
|
<link |
||||
|
rel="stylesheet" |
||||
|
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" |
||||
|
integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" |
||||
|
crossorigin="anonymous" |
||||
|
/> |
||||
|
<script |
||||
|
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" |
||||
|
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" |
||||
|
crossorigin="anonymous" |
||||
|
></script> |
||||
|
|
||||
|
<script type="text/javascript"> |
||||
|
console.log("startup"); |
||||
|
|
||||
|
var vpnAdmin = angular.module("vpnAdmin", []); |
||||
|
vpnAdmin.config(function ($interpolateProvider) { |
||||
|
console.log("vpnTest Config"); |
||||
|
$interpolateProvider.startSymbol("{[{"); |
||||
|
$interpolateProvider.endSymbol("}]}"); |
||||
|
}); |
||||
|
vpnAdmin.controller("vpnInstrumentationController", function ($scope) { |
||||
|
console.log("vpnInstrumentationController startup"); |
||||
|
|
||||
|
$scope.log_elements = []; |
||||
|
$scope.auth_key = ""; |
||||
|
$scope.conn = false; |
||||
|
|
||||
|
$scope.webSocketStatus = function () { |
||||
|
if ($scope.conn == false) { |
||||
|
return ""; |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
$scope.startWebSocket = function () { |
||||
|
console.log("Start webSocket {{$}}"); |
||||
|
if (window["WebSocket"]) { |
||||
|
$scope.conn = new WebSocket("wss://{{$}}/ws/admin"); |
||||
|
$scope.append_log("Websocket opened"); |
||||
|
$scope.conn.onclose = function (evt) { |
||||
|
$scope.append_log("Connection closed."); |
||||
|
}; |
||||
|
$scope.conn.onmessage = function (evt) { |
||||
|
$scope.append_log(evt.data); |
||||
|
}; |
||||
|
} else { |
||||
|
appendLog($("<div><b>Your browser does not support WebSockets.</b></div>")); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
$scope.auth_click = function () { |
||||
|
$scope.append_log($scope.auth_key); |
||||
|
}; |
||||
|
|
||||
|
$scope.append_log = function (txt) { |
||||
|
$scope.log_elements.push(txt); |
||||
|
}; |
||||
|
}); |
||||
|
</script> |
||||
|
</html> |
||||
|
@ -1,132 +1,151 @@ |
|||||
<!DOCTYPE html> |
<!DOCTYPE html> |
||||
<html lang="en"> |
<html lang="en"> |
||||
<head> |
|
||||
<title>Websock VPN Test Client</title> |
|
||||
</head> |
|
||||
<body ng-app="vpnTest" ng-controller="vpnTestController"> |
|
||||
|
|
||||
<div class="panel panel-default panel-primary"> |
|
||||
<div class="panel-heading">WebSocket Client Test</div> |
|
||||
<div class="panel-body"> |
|
||||
<div class="panel panel-default panel-info"> |
|
||||
<div class="panel-heading ">Control Plane</div> |
|
||||
<div class="panel-body"> |
|
||||
|
|
||||
<div class="row"> <!-- Auth --> |
|
||||
<div class="col-lg-6"> |
|
||||
<div class="input-group"> |
|
||||
<span class="input-group-btn"> |
|
||||
<button class="btn btn-default" type="button" ng-click="startWebSocket()">Start WebSocket</button> |
|
||||
</span> |
|
||||
<button class="btn btn-default" type="button" ng-class="conn == false && 'btn-danger' || 'btn-success'"> |
|
||||
{[{ conn == false && 'False' || 'True' }]} |
|
||||
</button> |
|
||||
|
<head> |
||||
|
<title>Websock VPN Test Client</title> |
||||
|
</head> |
||||
|
<body ng-app="vpnTest" ng-controller="vpnTestController"> |
||||
|
<div class="panel panel-default panel-primary"> |
||||
|
<div class="panel-heading">WebSocket Client Test</div> |
||||
|
<div class="panel-body"> |
||||
|
<div class="panel panel-default panel-info"> |
||||
|
<div class="panel-heading">Control Plane</div> |
||||
|
<div class="panel-body"> |
||||
|
<div class="row"> |
||||
|
<!-- Auth --> |
||||
|
<div class="col-lg-6"> |
||||
|
<div class="input-group"> |
||||
|
<span class="input-group-btn"> |
||||
|
<button class="btn btn-default" type="button" ng-click="startWebSocket()"> |
||||
|
Start WebSocket |
||||
|
</button> |
||||
|
</span> |
||||
|
<button |
||||
|
class="btn btn-default" |
||||
|
type="button" |
||||
|
ng-class="conn == false && 'btn-danger' || 'btn-success'" |
||||
|
> |
||||
|
{[{ conn == false && 'False' || 'True' }]} |
||||
|
</button> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
|
||||
|
|
||||
<br> |
|
||||
|
|
||||
<div class="row"> |
|
||||
<div class="col-lg-6"> |
|
||||
<div class="input-group"> |
|
||||
<span class="input-group-btn"> |
|
||||
<button class="btn btn-default" type="button">Auth</button> |
|
||||
</span> |
|
||||
<input type="text" class="form-control" placeholder="Enter auth data here"> |
|
||||
|
<br /> |
||||
|
|
||||
|
<div class="row"> |
||||
|
<div class="col-lg-6"> |
||||
|
<div class="input-group"> |
||||
|
<span class="input-group-btn"> |
||||
|
<button class="btn btn-default" type="button">Auth</button> |
||||
|
</span> |
||||
|
<input type="text" class="form-control" placeholder="Enter auth data here" /> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
|
||||
|
|
||||
<br> |
|
||||
|
|
||||
<div class="row"> |
|
||||
<div class="col-lg-6"> |
|
||||
<div class="input-group"> |
|
||||
<span class="input-group-btn"> |
|
||||
<button class="btn btn-default" ng-click="send_click()" type="button">Send</button> |
|
||||
</span> |
|
||||
<input ng-model="send_data" type="text" class="form-control" placeholder="Enter send data here"> |
|
||||
|
<br /> |
||||
|
|
||||
|
<div class="row"> |
||||
|
<div class="col-lg-6"> |
||||
|
<div class="input-group"> |
||||
|
<span class="input-group-btn"> |
||||
|
<button class="btn btn-default" ng-click="send_click()" type="button"> |
||||
|
Send |
||||
|
</button> |
||||
|
</span> |
||||
|
<input |
||||
|
ng-model="send_data" |
||||
|
type="text" |
||||
|
class="form-control" |
||||
|
placeholder="Enter send data here" |
||||
|
/> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
|
|
||||
|
|
||||
</div> |
</div> |
||||
</div> |
|
||||
<div class="panel panel-default panel-danger"> |
|
||||
<div class="panel-heading">Messages</div> |
|
||||
<div class="panel-body"> |
|
||||
<p ng-repeat="text in log_elements">{[{text}]}</p> |
|
||||
|
<div class="panel panel-default panel-danger"> |
||||
|
<div class="panel-heading">Messages</div> |
||||
|
<div class="panel-body"> |
||||
|
<p ng-repeat="text in log_elements">{[{text}]}</p> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
|
||||
</body> |
|
||||
|
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> |
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script> |
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> |
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> |
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
console.log("startup"); |
|
||||
|
|
||||
var vpnTest = angular.module('vpnTest',[]); |
|
||||
vpnTest.config(function($interpolateProvider) { |
|
||||
console.log("vpnTest Config"); |
|
||||
$interpolateProvider.startSymbol('{[{'); |
|
||||
$interpolateProvider.endSymbol('}]}'); |
|
||||
}); |
|
||||
vpnTest.controller('vpnTestController', function ($scope) { |
|
||||
console.log("vpnTestController startup"); |
|
||||
|
|
||||
$scope.log_elements = []; |
|
||||
$scope.auth_key = ""; |
|
||||
$scope.conn = false; |
|
||||
$scope.send_data = "" |
|
||||
|
|
||||
$scope.webSocketStatus = function() { |
|
||||
if ($scope.conn == false) { |
|
||||
return "" |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
$scope.startWebSocket = function() { |
|
||||
console.log("Start webSocket {{$}}"); |
|
||||
if (window["WebSocket"]) { |
|
||||
$scope.conn = new WebSocket("wss://{{$}}/ws/client"); |
|
||||
$scope.append_log("Websocket opened"); |
|
||||
$scope.conn.onclose = function (evt) { |
|
||||
$scope.append_log("Connection closed."); |
|
||||
} |
|
||||
$scope.conn.onmessage = function (evt) { |
|
||||
console.log(evt.data) |
|
||||
$scope.append_log(evt.data) |
|
||||
} |
|
||||
} |
|
||||
else { |
|
||||
appendLog($("<div><b>Your browser does not support WebSockets.</b></div>")) |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
$scope.auth_click = function() { |
|
||||
$scope.append_log($scope.auth_key) |
|
||||
}; |
|
||||
|
|
||||
$scope.send_click = function() { |
|
||||
console.log("send_click") |
|
||||
$scope.conn.send($scope.send_data) |
|
||||
}; |
|
||||
|
|
||||
$scope.append_log = function(txt) { |
|
||||
$scope.log_elements.push(txt) |
|
||||
}; |
|
||||
|
|
||||
|
|
||||
|
|
||||
}); |
|
||||
</script> |
|
||||
|
|
||||
|
</body> |
||||
|
|
||||
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> |
||||
|
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script> |
||||
|
<link |
||||
|
rel="stylesheet" |
||||
|
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" |
||||
|
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" |
||||
|
crossorigin="anonymous" |
||||
|
/> |
||||
|
<link |
||||
|
rel="stylesheet" |
||||
|
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" |
||||
|
integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" |
||||
|
crossorigin="anonymous" |
||||
|
/> |
||||
|
<script |
||||
|
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" |
||||
|
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" |
||||
|
crossorigin="anonymous" |
||||
|
></script> |
||||
|
|
||||
|
<script type="text/javascript"> |
||||
|
console.log("startup"); |
||||
|
|
||||
|
var vpnTest = angular.module("vpnTest", []); |
||||
|
vpnTest.config(function ($interpolateProvider) { |
||||
|
console.log("vpnTest Config"); |
||||
|
$interpolateProvider.startSymbol("{[{"); |
||||
|
$interpolateProvider.endSymbol("}]}"); |
||||
|
}); |
||||
|
vpnTest.controller("vpnTestController", function ($scope) { |
||||
|
console.log("vpnTestController startup"); |
||||
|
|
||||
|
$scope.log_elements = []; |
||||
|
$scope.auth_key = ""; |
||||
|
$scope.conn = false; |
||||
|
$scope.send_data = ""; |
||||
|
|
||||
|
$scope.webSocketStatus = function () { |
||||
|
if ($scope.conn == false) { |
||||
|
return ""; |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
$scope.startWebSocket = function () { |
||||
|
console.log("Start webSocket {{$}}"); |
||||
|
if (window["WebSocket"]) { |
||||
|
$scope.conn = new WebSocket("wss://{{$}}/ws/client"); |
||||
|
$scope.append_log("Websocket opened"); |
||||
|
$scope.conn.onclose = function (evt) { |
||||
|
$scope.append_log("Connection closed."); |
||||
|
}; |
||||
|
$scope.conn.onmessage = function (evt) { |
||||
|
console.log(evt.data); |
||||
|
$scope.append_log(evt.data); |
||||
|
}; |
||||
|
} else { |
||||
|
appendLog($("<div><b>Your browser does not support WebSockets.</b></div>")); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
$scope.auth_click = function () { |
||||
|
$scope.append_log($scope.auth_key); |
||||
|
}; |
||||
|
|
||||
|
$scope.send_click = function () { |
||||
|
console.log("send_click"); |
||||
|
$scope.conn.send($scope.send_data); |
||||
|
}; |
||||
|
|
||||
|
$scope.append_log = function (txt) { |
||||
|
$scope.log_elements.push(txt); |
||||
|
}; |
||||
|
}); |
||||
|
</script> |
||||
</html> |
</html> |
||||
|
@ -1,60 +1,57 @@ |
|||||
<!doctype html> |
|
||||
|
<!DOCTYPE html> |
||||
<html lang="en"> |
<html lang="en"> |
||||
<head> |
|
||||
<meta charset="utf-8"> |
|
||||
<title>Page Not Found</title> |
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|
||||
<style> |
|
||||
|
|
||||
* { |
|
||||
line-height: 1.2; |
|
||||
margin: 0; |
|
||||
} |
|
||||
|
|
||||
html { |
|
||||
color: #888; |
|
||||
display: table; |
|
||||
font-family: sans-serif; |
|
||||
height: 100%; |
|
||||
text-align: center; |
|
||||
width: 100%; |
|
||||
} |
|
||||
|
|
||||
body { |
|
||||
display: table-cell; |
|
||||
vertical-align: middle; |
|
||||
margin: 2em auto; |
|
||||
} |
|
||||
|
|
||||
h1 { |
|
||||
color: #555; |
|
||||
font-size: 2em; |
|
||||
font-weight: 400; |
|
||||
} |
|
||||
|
|
||||
p { |
|
||||
margin: 0 auto; |
|
||||
width: 280px; |
|
||||
} |
|
||||
|
<head> |
||||
|
<meta charset="utf-8" /> |
||||
|
<title>Page Not Found</title> |
||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" /> |
||||
|
<style> |
||||
|
* { |
||||
|
line-height: 1.2; |
||||
|
margin: 0; |
||||
|
} |
||||
|
|
||||
@media only screen and (max-width: 280px) { |
|
||||
|
html { |
||||
|
color: #888; |
||||
|
display: table; |
||||
|
font-family: sans-serif; |
||||
|
height: 100%; |
||||
|
text-align: center; |
||||
|
width: 100%; |
||||
|
} |
||||
|
|
||||
body, p { |
|
||||
width: 95%; |
|
||||
|
body { |
||||
|
display: table-cell; |
||||
|
vertical-align: middle; |
||||
|
margin: 2em auto; |
||||
} |
} |
||||
|
|
||||
h1 { |
h1 { |
||||
font-size: 1.5em; |
|
||||
margin: 0 0 0.3em; |
|
||||
|
color: #555; |
||||
|
font-size: 2em; |
||||
|
font-weight: 400; |
||||
} |
} |
||||
|
|
||||
} |
|
||||
|
p { |
||||
|
margin: 0 auto; |
||||
|
width: 280px; |
||||
|
} |
||||
|
|
||||
</style> |
|
||||
</head> |
|
||||
<body> |
|
||||
<h1>Page Not Found</h1> |
|
||||
<p>Sorry, but the page you were trying to view does not exist.</p> |
|
||||
</body> |
|
||||
|
@media only screen and (max-width: 280px) { |
||||
|
body, |
||||
|
p { |
||||
|
width: 95%; |
||||
|
} |
||||
|
|
||||
|
h1 { |
||||
|
font-size: 1.5em; |
||||
|
margin: 0 0 0.3em; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
|
</head> |
||||
|
<body> |
||||
|
<h1>Page Not Found</h1> |
||||
|
<p>Sorry, but the page you were trying to view does not exist.</p> |
||||
|
</body> |
||||
</html> |
</html> |
||||
<!-- IE needs 512+ bytes: http://blogs.msdn.com/b/ieinternals/archive/2010/08/19/http-error-pages-in-internet-explorer.aspx --> |
<!-- IE needs 512+ bytes: http://blogs.msdn.com/b/ieinternals/archive/2010/08/19/http-error-pages-in-internet-explorer.aspx --> |
||||
|
@ -1,89 +1,98 @@ |
|||||
<div class="panel panel-default" data-ng-controller="serverController"> |
<div class="panel panel-default" data-ng-controller="serverController"> |
||||
<div class="panel-heading"> |
|
||||
<div class="panel-title"> |
|
||||
<div class="row"> |
|
||||
<div class="col-md-6"> |
|
||||
Servers |
|
||||
</div> |
|
||||
<div class="col-md-6"> |
|
||||
<form class="form-inline pull-right"> |
|
||||
<div class="form-group"> |
|
||||
<label for="search">Search:</label> |
|
||||
<input type="text" class="form-control" id="search" data-ng-model="servers_search"> |
|
||||
</div> |
|
||||
<button type="button" title="Refresh" class="btn btn-default" aria-label="Refresh"> |
|
||||
<span class="glyphicon glyphicon-refresh" title="Refresh" aria-hidden="false" ng-click="updateView()"></span> |
|
||||
</button> |
|
||||
</form> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="panel-body"> |
|
||||
<table class="table table-striped table-bordered"> |
|
||||
<th width="3%">ID</th> |
|
||||
<th width="10%">Name</th> |
|
||||
<th width="10%">Address</th> |
|
||||
<th width="10%">Xfer (in/out)</th> |
|
||||
<th width="10%">Req/Resp</th> |
|
||||
<th width="5%">Duration</th> |
|
||||
<th width="5%">State</th> |
|
||||
<th width="5%">Idle</th> |
|
||||
<th width="1%"><center><span class="glyphicon glyphicon-option-vertical" aria-hidden="true"></span></center></th> |
|
||||
|
|
||||
|
|
||||
<tr ng-repeat="s in servers | filter:servers_search | orderBy:'server_id'"> |
|
||||
<td>{{ s.server_id }}</td> |
|
||||
<td>{{ s.server_name }}</td> |
|
||||
<td> |
|
||||
{{ s.source_address }} |
|
||||
<div ng-hide="checkDetail(s.server_id)"> |
|
||||
domains({{ s.domains.length}}) |
|
||||
<div ng-repeat="d in s.domains | orderBy:'domain_name'"> |
|
||||
   {{ d.domain_name }} |
|
||||
</div> |
|
||||
</div> |
|
||||
</td> |
|
||||
<td> |
|
||||
{{ s.bytes_in | bytes }}/{{ s.bytes_out | bytes }} |
|
||||
<div ng-hide="checkDetail(s.server_id)"> |
|
||||
  |
|
||||
<div ng-repeat="d in s.domains | orderBy:'domain_name'"> |
|
||||
   {{ d.bytes_in | bytes }}/{{ d.bytes_out | bytes }} |
|
||||
</div> |
|
||||
|
<div class="panel-heading"> |
||||
|
<div class="panel-title"> |
||||
|
<div class="row"> |
||||
|
<div class="col-md-6"> |
||||
|
Servers |
||||
</div> |
</div> |
||||
</td> |
|
||||
<td> |
|
||||
{{ s.requests }}/{{ s.responses }} |
|
||||
<div ng-hide="checkDetail(s.server_id)"> |
|
||||
  |
|
||||
<div ng-repeat="d in s.domains | orderBy:'domain_name'"> |
|
||||
   {{ d.requests }}/{{ d.responses }} |
|
||||
</div> |
|
||||
|
<div class="col-md-6"> |
||||
|
<form class="form-inline pull-right"> |
||||
|
<div class="form-group"> |
||||
|
<label for="search">Search:</label> |
||||
|
<input type="text" class="form-control" id="search" data-ng-model="servers_search" /> |
||||
|
</div> |
||||
|
<button type="button" title="Refresh" class="btn btn-default" aria-label="Refresh"> |
||||
|
<span |
||||
|
class="glyphicon glyphicon-refresh" |
||||
|
title="Refresh" |
||||
|
aria-hidden="false" |
||||
|
ng-click="updateView()" |
||||
|
></span> |
||||
|
</button> |
||||
|
</form> |
||||
</div> |
</div> |
||||
</td> |
|
||||
|
|
||||
<td>{{ s.duration | hfcduration }}</td> |
|
||||
<td>{{ s.server_state }}</td> |
|
||||
<td>{{ s.idle | hfcduration }}</td> |
|
||||
<td> |
|
||||
<span class="glyphicon glyphicon-zoom-in" title="Detail" aria-hidden="false" ng-click="triggerDetail(s.server_id)"></span> |
|
||||
<div ng-hide="checkDetail(s.server_id)"> |
|
||||
  |
|
||||
<div ng-repeat="d in s.domains | orderBy:'domain_name'"> |
|
||||
<span class="glyphicon glyphicon-zoom-in" title="Detail" aria-hidden="false" ng-click="triggerDetail(s.server_id+d.domain_name)"></span> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
</table> |
|
||||
|
|
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="panel-body"> |
||||
|
<table class="table table-striped table-bordered"> |
||||
|
<th width="3%">ID</th> |
||||
|
<th width="10%">Name</th> |
||||
|
<th width="10%">Address</th> |
||||
|
<th width="10%">Xfer (in/out)</th> |
||||
|
<th width="10%">Req/Resp</th> |
||||
|
<th width="5%">Duration</th> |
||||
|
<th width="5%">State</th> |
||||
|
<th width="5%">Idle</th> |
||||
|
<th width="1%"> |
||||
|
<center><span class="glyphicon glyphicon-option-vertical" aria-hidden="true"></span></center> |
||||
|
</th> |
||||
|
|
||||
|
<tr ng-repeat="s in servers | filter:servers_search | orderBy:'server_id'"> |
||||
|
<td>{{ s.server_id }}</td> |
||||
|
<td>{{ s.server_name }}</td> |
||||
|
<td> |
||||
|
{{ s.source_address }} |
||||
|
<div ng-hide="checkDetail(s.server_id)"> |
||||
|
domains({{ s.domains.length}}) |
||||
|
<div ng-repeat="d in s.domains | orderBy:'domain_name'"> |
||||
|
   {{ d.domain_name }} |
||||
|
</div> |
||||
|
</div> |
||||
|
</td> |
||||
|
<td> |
||||
|
{{ s.bytes_in | bytes }}/{{ s.bytes_out | bytes }} |
||||
|
<div ng-hide="checkDetail(s.server_id)"> |
||||
|
  |
||||
|
<div ng-repeat="d in s.domains | orderBy:'domain_name'"> |
||||
|
   {{ d.bytes_in | bytes }}/{{ d.bytes_out | bytes }} |
||||
|
</div> |
||||
|
</div> |
||||
|
</td> |
||||
|
<td> |
||||
|
{{ s.requests }}/{{ s.responses }} |
||||
|
<div ng-hide="checkDetail(s.server_id)"> |
||||
|
  |
||||
|
<div ng-repeat="d in s.domains | orderBy:'domain_name'"> |
||||
|
   {{ d.requests }}/{{ d.responses }} |
||||
|
</div> |
||||
|
</div> |
||||
|
</td> |
||||
|
|
||||
</div> |
|
||||
</div> |
|
||||
|
<td>{{ s.duration | hfcduration }}</td> |
||||
|
<td>{{ s.server_state }}</td> |
||||
|
<td>{{ s.idle | hfcduration }}</td> |
||||
|
<td> |
||||
|
<span |
||||
|
class="glyphicon glyphicon-zoom-in" |
||||
|
title="Detail" |
||||
|
aria-hidden="false" |
||||
|
ng-click="triggerDetail(s.server_id)" |
||||
|
></span> |
||||
|
<div ng-hide="checkDetail(s.server_id)"> |
||||
|
  |
||||
|
<div ng-repeat="d in s.domains | orderBy:'domain_name'"> |
||||
|
<span |
||||
|
class="glyphicon glyphicon-zoom-in" |
||||
|
title="Detail" |
||||
|
aria-hidden="false" |
||||
|
ng-click="triggerDetail(s.server_id+d.domain_name)" |
||||
|
></span> |
||||
|
</div> |
||||
|
</div> |
||||
|
</td> |
||||
|
</tr> |
||||
|
</table> |
||||
|
</div> |
||||
|
</div> |
||||
|
Loading…
Reference in new issue