Further work and preparation.
Placed dataflash status bar in the header but can’t figure out how to trigger a readout on connect in serial_backend.js. Some help?10.3.x-maintenance
parent
10f7cdd1b0
commit
b0b8cc00d7
|
@ -10,7 +10,7 @@ function startApplication() {
|
|||
id: 'main-window',
|
||||
frame: 'chrome',
|
||||
innerBounds: {
|
||||
minWidth: 1200, // changed from 960
|
||||
minWidth: 1150, // changed from 960
|
||||
minHeight: 700 // changed from 625
|
||||
}
|
||||
}, function (createdWindow) {
|
||||
|
|
|
@ -238,10 +238,21 @@ function onConnect() {
|
|||
$('#tabs ul.mode-connected').show();
|
||||
|
||||
if ("CLFL" == CONFIG.flightControllerIdentifier){
|
||||
var documentationButton = $('#button-documentation');
|
||||
|
||||
/* placing this elsewhere
|
||||
var documentationButton = $('#button-documentation');
|
||||
documentationButton.show();
|
||||
documentationButton.html("Documentation for "+CONFIG.flightControllerVersion);
|
||||
documentationButton.attr("href","https://github.com/cleanflight/cleanflight/tree/v{0}/docs".format(CONFIG.flightControllerVersion));
|
||||
*/
|
||||
|
||||
/* just a thought
|
||||
var sensor_state = $('#sensor-status');
|
||||
sensor_state.show();
|
||||
*/
|
||||
|
||||
var flashstate = $('#header_dataflash');
|
||||
flashstate.show();
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -255,8 +266,14 @@ function onClosed(result) {
|
|||
$('#tabs ul.mode-connected').hide();
|
||||
$('#tabs ul.mode-disconnected').show();
|
||||
|
||||
var documentationButton = $('#button-documentation');
|
||||
documentationButton.hide();
|
||||
|
||||
var flashstate = $('#header_dataflash');
|
||||
flashstate.hide();
|
||||
|
||||
/* just a thought
|
||||
var sensor_state = $('#sensor-status');
|
||||
sensor_state.hide();
|
||||
*/
|
||||
}
|
||||
|
||||
function read_serial(info) {
|
||||
|
|
58
main.css
58
main.css
|
@ -70,8 +70,7 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
|
||||
#port-picker {
|
||||
float: left;
|
||||
|
||||
height: 20px;
|
||||
height: 105px; /* was 20px */
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
#port-picker li {
|
||||
|
@ -80,10 +79,8 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
#port-picker select {
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
|
||||
float: left;
|
||||
margin-right: 5px;
|
||||
|
||||
border: 1px solid silver;
|
||||
}
|
||||
#port-picker #port {
|
||||
|
@ -106,22 +103,17 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
|
||||
#port-picker a {
|
||||
float: left;
|
||||
|
||||
display: block;
|
||||
|
||||
width: 80px;
|
||||
height: 18px;
|
||||
border: 1px solid silver;
|
||||
|
||||
line-height: 18px;
|
||||
text-align: center;
|
||||
}
|
||||
#port-picker a.connect {
|
||||
margin-right: 10px;
|
||||
|
||||
background-color: #be2222;
|
||||
color: white;
|
||||
|
||||
font-weight: bold;
|
||||
}
|
||||
#port-picker a.connect:hover {
|
||||
|
@ -136,37 +128,33 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
}
|
||||
#port-picker input.auto_connect {
|
||||
float: left;
|
||||
|
||||
margin-top: 4px;
|
||||
}
|
||||
#port-picker span.auto_connect {
|
||||
float: left;
|
||||
|
||||
margin: 3px 0 0 5px;
|
||||
}
|
||||
|
||||
#sensor-status {
|
||||
float: right;
|
||||
|
||||
margin-right: 10px;
|
||||
|
||||
height: 22px;
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
#header_dataflash {
|
||||
display:none; }
|
||||
|
||||
|
||||
#sensor-status li {
|
||||
float: left;
|
||||
|
||||
padding: 0 12px 0 12px;
|
||||
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
|
||||
color: white;
|
||||
text-align: center;
|
||||
|
||||
border: 1px solid #c0c0c0;
|
||||
border-right: 0;
|
||||
|
||||
background-color: #e32424;
|
||||
}
|
||||
#sensor-status li:last-child {
|
||||
|
@ -188,12 +176,9 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
/*
|
||||
#button-documentation {
|
||||
float: left;
|
||||
|
||||
padding: 0 12px 0 12px;
|
||||
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
|
||||
background-color: #ffcb18;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
|
@ -203,10 +188,8 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
*/
|
||||
#options {
|
||||
float: right;
|
||||
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
|
||||
background-image: url('./images/ic_settings_24px.svg');
|
||||
background-position: -1px -1px;
|
||||
background-repeat: no-repeat;
|
||||
|
@ -225,14 +208,10 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
#options-window {
|
||||
display: none;
|
||||
position: fixed;
|
||||
|
||||
right: 30px;
|
||||
top: 15px;
|
||||
|
||||
padding: 5px;
|
||||
|
||||
line-height: 20px;
|
||||
|
||||
border: 1px solid silver;
|
||||
background-color: white;
|
||||
}
|
||||
|
@ -268,9 +247,7 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
margin-top: 0px;
|
||||
|
||||
z-index: 10;
|
||||
|
||||
font-weight: regular;
|
||||
}
|
||||
|
||||
|
@ -283,11 +260,9 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
}
|
||||
|
||||
#tabs li {
|
||||
width:100%;
|
||||
|
||||
width:100%;
|
||||
float: left;
|
||||
margin-right: 4px;
|
||||
|
||||
border: 1px solid #848484;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
@ -295,11 +270,8 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
#tabs li a {
|
||||
width:100%;
|
||||
display: block;
|
||||
|
||||
height: 15px;
|
||||
|
||||
padding: 5px 4px;
|
||||
|
||||
background-color: #d0d0d0;
|
||||
}
|
||||
#tabs li a:hover {
|
||||
|
@ -310,7 +282,6 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
}
|
||||
#tabs li.active a {
|
||||
height: 16px;
|
||||
|
||||
background-color: white;
|
||||
}
|
||||
#tabs li.active a:hover {
|
||||
|
@ -320,29 +291,20 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
#content {
|
||||
margin-top: 0px; /* 31 */
|
||||
padding: 0px; /* 10 */
|
||||
|
||||
height:100%; /* (port picker, log, tab, status bar) was calc(100% - 171px) */
|
||||
|
||||
height:calc(100% - 150px); /* (port picker 105px, log 25px, tab 0px, status bar: 20px) - was: calc(100% - 171px)*/
|
||||
background-color: white;
|
||||
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
|
||||
border: 0px solid #848484; /* 1px solid #848484; */
|
||||
|
||||
-webkit-transform: rotateX(0deg); /* DO NOT REMOVE! this fixes the UI freezing bug on MAC OS X */
|
||||
}
|
||||
#status-bar {
|
||||
position: fixed;
|
||||
|
||||
bottom: 0px;
|
||||
|
||||
width: calc(100% - 20px);
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
|
||||
padding: 0 10px 0 10px;
|
||||
|
||||
border-top: 1px solid #7d7d79;
|
||||
background-color: #bfbeb5;
|
||||
}
|
||||
|
@ -351,12 +313,10 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
|
||||
padding-right: 10px;
|
||||
margin-right: 10px;
|
||||
|
||||
border-right: 1px solid #7d7d79;
|
||||
}
|
||||
#status-bar .version {
|
||||
float: right;
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
|
@ -367,7 +327,6 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
.data-loading {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
background-image: url('../images/loading-bars.svg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center 45%;
|
||||
|
@ -375,7 +334,6 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||
.data-loading p {
|
||||
position: relative;
|
||||
top: calc(45% + 45px);
|
||||
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
|
32
main.html
32
main.html
|
@ -113,10 +113,34 @@
|
|||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a id="options" href="#" i18n_title="options_title"></a>
|
||||
|
||||
<div class="tab-dataflash" id="flashstate" style="width:120px; float:right; height:12px;"
|
||||
>
|
||||
<div class="require-dataflash" id="header_dataflash">
|
||||
<ul class="dataflash-contents" style="height:7px; margin:12px;">
|
||||
<li class="dataflash-free" style="height:10px; text-align:left;">
|
||||
<div class="legend" align="left" style="font-size:10px; margin-top:-40px; float:left; line-height:12px; width:100%;"></div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="header-wrapper">
|
||||
<div id="sensor-status">
|
||||
<div id="sensor-status" class="sensor_state">
|
||||
<ul>
|
||||
<li class="gyro" title="Gyroscope">Gyro</li>
|
||||
<li class="accel" title="Accelerometer">Accel</li>
|
||||
|
@ -127,8 +151,8 @@
|
|||
</ul>
|
||||
</div>
|
||||
<div id="documentation-controls">
|
||||
<ul>
|
||||
<li><a id="button-documentation" href="#" target="_blank"></a></li>
|
||||
<ul>
|
||||
<li><a id="button-documentation" href="#" target="_blank"></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -59,7 +59,7 @@ TABS.dataflash.initialize = function (callback) {
|
|||
display: 'block'
|
||||
});
|
||||
|
||||
$(".tab-dataflash .dataflash-used div").text('Used space ' + formatFilesize(DATAFLASH.usedSize));
|
||||
$(".tab-dataflash .dataflash-used div").text('Used space: ' + formatFilesize(DATAFLASH.usedSize));
|
||||
} else {
|
||||
$(".tab-dataflash .dataflash-used").css({
|
||||
display: 'none'
|
||||
|
@ -71,7 +71,7 @@ TABS.dataflash.initialize = function (callback) {
|
|||
width: ((DATAFLASH.totalSize - DATAFLASH.usedSize) / DATAFLASH.totalSize * 100) + "%",
|
||||
display: 'block'
|
||||
});
|
||||
$(".tab-dataflash .dataflash-free div").text('Free space ' + formatFilesize(DATAFLASH.totalSize - DATAFLASH.usedSize));
|
||||
$(".tab-dataflash .dataflash-free div").text('Free space: ' + formatFilesize(DATAFLASH.totalSize - DATAFLASH.usedSize));
|
||||
} else {
|
||||
$(".tab-dataflash .dataflash-free").css({
|
||||
display: 'none'
|
||||
|
|
|
@ -14,7 +14,7 @@ TABS.sensors.initialize = function (callback) {
|
|||
SENSOR_DATA.accelerometer[i] = 0;
|
||||
SENSOR_DATA.gyroscope[i] = 0;
|
||||
SENSOR_DATA.magnetometer[i] = 0;
|
||||
SENSOR_DATA.sonar[i] = 0;
|
||||
SENSOR_DATA.sonar = 0;
|
||||
SENSOR_DATA.debug[i] = 0;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue