kopia lustrzana https://github.com/cyoung/stratux
Add On/Off switch for settings.
Brant K. Kyser
rodzic
3f6828a600
commit
d39da3d67a
Plik binarny nie jest wyświetlany.
Plik binarny nie jest wyświetlany.
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,45 @@
|
|||
.onoffswitch {
|
||||
position: relative; width: 68px;
|
||||
-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
|
||||
}
|
||||
.onoffswitch-checkbox {
|
||||
display: none;
|
||||
}
|
||||
.onoffswitch-label {
|
||||
display: block; overflow: hidden; cursor: pointer;
|
||||
border: 2px solid #ddd; border-radius: 20px;
|
||||
}
|
||||
.onoffswitch-inner {
|
||||
display: block; width: 200%; margin-left: -100%;
|
||||
transition: margin 0.3s ease-in 0s;
|
||||
}
|
||||
.onoffswitch-inner:before, .onoffswitch-inner:after {
|
||||
display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;
|
||||
font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.onoffswitch-inner:before {
|
||||
content: "ON";
|
||||
padding-left: 10px;
|
||||
background-color: #337AB7; color: #FFFFFF;
|
||||
}
|
||||
.onoffswitch-inner:after {
|
||||
content: "OFF";
|
||||
padding-right: 10px;
|
||||
background-color: #F5F5F5; color: #DDDDDD;
|
||||
text-align: right;
|
||||
}
|
||||
.onoffswitch-switch {
|
||||
display: block; width: 18px; margin: 6px;
|
||||
background: #FFFFFF;
|
||||
position: absolute; top: 0; bottom: 0;
|
||||
right: 34px;
|
||||
border: 2px solid #ddd; border-radius: 20px;
|
||||
transition: all 0.3s ease-in 0s;
|
||||
}
|
||||
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
|
||||
margin-left: 0;
|
||||
}
|
||||
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
|
||||
right: 0px;
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
@import url(bootstrap.min.css);
|
||||
@import url(onoff.css);
|
||||
|
||||
#stratux-main
|
||||
{
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
background-color: #fff;
|
||||
border-color: #ddd;
|
||||
border-width: 1px;
|
||||
border-radius: 4px 4px 0 0;
|
||||
box-shadow: none;
|
||||
margin: auto;
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.setting
|
||||
{
|
||||
display: block;
|
||||
}
|
||||
|
||||
.setting-element
|
||||
{
|
||||
display: inline-block;
|
||||
}
|
||||
173
web/index.html
173
web/index.html
|
|
@ -1,70 +1,121 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
|
||||
<html>
|
||||
<head>
|
||||
<title>
|
||||
Stratux
|
||||
</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>
|
||||
</head>
|
||||
<body>
|
||||
<script type="text/javascript">
|
||||
<head>
|
||||
<title>
|
||||
Stratux
|
||||
</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>
|
||||
<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'})
|
||||
});
|
||||
$('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);
|
||||
});
|
||||
$.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);
|
||||
}
|
||||
});
|
||||
},
|
||||
complete: function() {
|
||||
// Schedule the next request when the current one is complete.
|
||||
setTimeout(worker, 1000);
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
||||
</script>
|
||||
Status:<br>
|
||||
RTL-SDR devices: <span id="Devices">1</span><br>
|
||||
Clients connected: <span id="Connected_Users">2</span><br>
|
||||
Current firmware: <span id="Version">v0.1</span><br>
|
||||
UAT msgs: <span id="UAT_messages_last_minute"></span> / <span id="UAT_messages_max"></span><br>
|
||||
1090ES msgs: <span id="ES_messages_last_minute"></span> / <span id="ES_messages_max"></span><br>
|
||||
GPS satellites: <span id="GPS_satellites_locked"></span><br>
|
||||
AHRS: <span id="RY835AI_connected"></span><br>
|
||||
Uptime: <span id="Uptime"></span><br>
|
||||
<br>
|
||||
<form id="settings">
|
||||
Set:<br>
|
||||
978MHz <input type="radio" name="UAT_Enabled" value="true">On
|
||||
<input type="radio" name="UAT_Enabled" value="false">Off<br>
|
||||
1090MHz <input type="radio" name="ES_Enabled" value="true">On
|
||||
<input type="radio" name="ES_Enabled" value="false">Off<br>
|
||||
GPS <input type="radio" name="GPS_Enabled" value="true">On
|
||||
<input type="radio" name="GPS_Enabled" value="false">Off<br>
|
||||
AHRS <input type="radio" name="AHRS_Enabled" value="true">On
|
||||
<input type="radio" name="AHRS_Enabled" value="false">Off<br>
|
||||
</form>
|
||||
</body>
|
||||
</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-body">
|
||||
RTL-SDR devices: <span id="Devices">1</span><br>
|
||||
Clients connected: <span id="Connected_Users">2</span><br>
|
||||
Current firmware: <span id="Version">v0.1</span><br>
|
||||
UAT msgs: <span id="UAT_messages_last_minute"></span> / <span id="UAT_messages_max"></span><br>
|
||||
1090ES msgs: <span id="ES_messages_last_minute"></span> / <span id="ES_messages_max"></span><br>
|
||||
GPS satellites: <span id="GPS_satellites_locked"></span><br>
|
||||
AHRS: <span id="RY835AI_connected"></span><br>
|
||||
Uptime: <span id="Uptime"></span><br>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">Settings</div>
|
||||
<div class="panel-body form-horizontal">
|
||||
<div class="form-group">
|
||||
<label class="control-label col-sm-4">978MHz</label>
|
||||
<div class="col-sm-1">
|
||||
<div class="onoffswitch">
|
||||
<input type="checkbox" name="UAT_Enabled" class="onoffswitch-checkbox" id="uat-onoffswitch" checked>
|
||||
<label class="onoffswitch-label" for="uat-onoffswitch">
|
||||
<span class="onoffswitch-inner"></span>
|
||||
<span class="onoffswitch-switch"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-sm-4">1090MHz</label>
|
||||
<div class="col-sm-1">
|
||||
<div class="onoffswitch">
|
||||
<input type="checkbox" name="ES_Enabled" class="onoffswitch-checkbox" id="es-onoffswitch" checked>
|
||||
<label class="onoffswitch-label" for="es-onoffswitch">
|
||||
<span class="onoffswitch-inner"></span>
|
||||
<span class="onoffswitch-switch"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-sm-4">GPS</label>
|
||||
<div class="col-sm-1">
|
||||
<div class="onoffswitch">
|
||||
<input type="checkbox" name="GPS_Enabled" class="onoffswitch-checkbox" id="gps-onoffswitch" checked>
|
||||
<label class="onoffswitch-label" for="gps-onoffswitch">
|
||||
<span class="onoffswitch-inner"></span>
|
||||
<span class="onoffswitch-switch"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-sm-4">AHRS</label>
|
||||
<div class="col-sm-1">
|
||||
<div class="onoffswitch">
|
||||
<input type="checkbox" name="AHRS_Enabled" class="onoffswitch-checkbox" id="ahrs-onoffswitch" checked>
|
||||
<label class="onoffswitch-label" for="ahrs-onoffswitch">
|
||||
<span class="onoffswitch-inner"></span>
|
||||
<span class="onoffswitch-switch"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue