Connect WebSocket and display status of connection.

pull/25/head
Brant K. Kyser 2015-08-27 15:29:14 -05:00
rodzic e28592a867
commit 531ce0f881
3 zmienionych plików z 7108 dodań i 63 usunięć

Wyświetl plik

@ -6,93 +6,57 @@
</title>
<script src="js/jquery-2.1.4.min.js" type="text/javascript"></script>
<script src="js/jquery.form.min.js" type="text/javascript"></script>
<script src="js/socket.io.js" type="text/javascript"></script>
<script src="js/stratux.js" type="text/javascript"></script>
<link href="css/stratux.css" rel="stylesheet" media="screen">
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
$('input[name=UAT_Enabled]').change(function(){
$('#settings').ajaxSubmit({url: 'control.php', type: 'post'})
});
$('input[name=ES_Enabled]').change(function(){
$('#settings').ajaxSubmit({url: 'control.php', type: 'post'})
});
$('input[name=GPS_Enabled]').change(function(){
$('#settings').ajaxSubmit({url: 'control.php', type: 'post'})
});
$('input[name=AHRS_Enabled]').change(function(){
$('#settings').ajaxSubmit({url: 'control.php', type: 'post'})
});
});
(function worker() {
$.ajax({
url: 'control.php',
success: function(data) {
obj = $.parseJSON(data);
$.each(obj, function(k, v) {
// Radio values.
if ((k == "UAT_Enabled") || (k == "ES_Enabled") || (k == "GPS_Enabled") || (k == "AHRS_Enabled")) {
$('[name=' + k + ']').val([v.toString()]);
}
$('#' + k).text(v);
});
},
complete: function() {
// Schedule the next request when the current one is complete.
setTimeout(worker, 1000);
}
});
})();
</script>
<div id="stratux-main" class="well well-large">
<h1>Stratux</h1>
<div class="panel panel-default">
<div class="panel-heading">Status</div>
<div class="panel-heading">Status <span id="connectedLabel" class="label label-warning">Disconnected</span></div>
<div class="panel-body">
<div class="form-horizontal">
<div class="row">
<label class="col-sm-6">RTL-SDR devices:</label>
<span id="Devices" class="col-sm-2">1</span>
<label class="col-sm-6">RTL-SDR devices:</label>
<span id="Devices" class="col-sm-2">1</span>
</div>
<div class="row">
<label class="col-sm-6">Clients connected:</label>
<span id="Connected_Users" class="col-sm-5">2</span>
<label class="col-sm-6">Clients connected:</label>
<span id="Connected_Users" class="col-sm-5">2</span>
</div>
<div class="row">
<label class="col-sm-6">Current firmware:</label>
<span id="Version" class="col-sm-6">2</span>
<label class="col-sm-6">Current firmware:</label>
<span id="Version" class="col-sm-6">2</span>
</div>
<div class="row">
<label class="col-sm-6">UAT msgs:</label>
<div class="col-sm-6">
<span id="UAT_messages_last_minute"></span>
/
<span id="UAT_messsages_max"></span>
</div>
<label class="col-sm-6">UAT msgs:</label>
<div class="col-sm-6">
<span id="UAT_messages_last_minute"></span>
/
<span id="UAT_messsages_max"></span>
</div>
</div>
<div class="row">
<label class="col-sm-6">1090ES msgs:</label>
<div class="col-sm-6">
<span id="ES_messages_last_minute"></span>
/
<span id="ES_messsages_max"></span>
</div>
<label class="col-sm-6">1090ES msgs:</label>
<div class="col-sm-6">
<span id="ES_messages_last_minute"></span>
/
<span id="ES_messsages_max"></span>
</div>
</div>
<div class="row">
<label class="col-sm-6">GPS satellites:</label>
<span id="GPS_satellites_locked" class="col-sm-6"></span>
<label class="col-sm-6">GPS satellites:</label>
<span id="GPS_satellites_locked" class="col-sm-6"></span>
</div>
<div class="row">
<label class="col-sm-6">AHRS:</label>
<span id="RY835AI_connected" class="col-sm-6"></span>
<label class="col-sm-6">AHRS:</label>
<span id="RY835AI_connected" class="col-sm-6"></span>
</div>
<div class="row">
<label class="col-sm-6">Uptime:</label>
<span id="Uptime" class="col-sm-6"></span>
<label class="col-sm-6">Uptime:</label>
<span id="Uptime" class="col-sm-6"></span>
</div>
</div>
</div>

7006
web/js/socket.io.js 100644

Plik diff jest za duży Load Diff

75
web/js/stratux.js 100644
Wyświetl plik

@ -0,0 +1,75 @@
// socket.io specific code
var socket = io.connect('http://192.168.10.1:9110');
function setConnectedClass (cssClass) {
$('#connectedLabel').removeClass('label-success');
$('#connectedLabel').removeClass('label-warning');
$('#connectedLabel').removeClass('label-danger');
$('#connectedLabel').addClass( cssClass );
if(cssClass == 'label-success;')
$('#connectedLabel').text('Connected');
else
$('#connectedLabel').text('Disconnected');
}
socket.on('connect', function () {
setConnectedClass('label-success');
});
socket.on('reconnect', function () {
message('System', 'Reconnected to the server');
setConnectedClass('label-success');
});
socket.on('reconnecting', function () {
message('System', 'Attempting to re-connect to the server');
setConnectedClass('label-danger');
});
socket.on('error', function (e) {
message('System', e ? e : 'A unknown error occurred');
setConnectedClass('label-danger');
});
function message (from, msg) {
$('#lines').append($('<p>').append($('<b>').text(from), msg));
}
// dom manipulation
$(document).ready(function() {
$('input[name=UAT_Enabled]').change(function(){
$('#settings').ajaxSubmit({url: 'control.php', type: 'post'})
});
$('input[name=ES_Enabled]').change(function(){
$('#settings').ajaxSubmit({url: 'control.php', type: 'post'})
});
$('input[name=GPS_Enabled]').change(function(){
$('#settings').ajaxSubmit({url: 'control.php', type: 'post'})
});
$('input[name=AHRS_Enabled]').change(function(){
$('#settings').ajaxSubmit({url: 'control.php', type: 'post'})
});
});
(function worker() {
$.ajax({
url: 'control.php',
success: function(data) {
obj = $.parseJSON(data);
$.each(obj, function(k, v) {
// Radio values.
if ((k == "UAT_Enabled") || (k == "ES_Enabled") || (k == "GPS_Enabled") || (k == "AHRS_Enabled")) {
$('[name=' + k + ']').val([v.toString()]);
}
$('#' + k).text(v);
});
},
complete: function() {
// Schedule the next request when the current one is complete.
setTimeout(worker, 1000);
}
});
})();