Issue #74: Show battery & statuses in top bar
- Battery voltage appears as a horizontal bar - Autodetection of battery type is used to calculate the bar min, max & alarm values according to the battery configuration parameters. - Color changes to red when battery level goes under the alarm setting - Armed, failsafe and Serial Link status icons below battery voltage monitor - Change calibration button contents to "Calibrating" during calibration10.3.x-maintenance
gael
parent
81a49d48b2
commit
0518ed6993
|
|
@ -1620,5 +1620,14 @@
|
|||
},
|
||||
"failsafeKillSwitchHelp": {
|
||||
"message": "Set this option to make the failsafe switch, configured in the modes tab, act as a direct kill switch, bypassing the selected failsafe procedure. <strong>Note:</strong> Arming is blocked with the failsafe kill switch in the ON position"
|
||||
},
|
||||
"mainHelpArmed": {
|
||||
"message": "Motor Arming"
|
||||
},
|
||||
"mainHelpFailsafe": {
|
||||
"message": "Failsafe Mode"
|
||||
},
|
||||
"mainHelpLink": {
|
||||
"message": "Serial Link Status"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="28 -43 141.7 141.7" style="enable-background:new 28 -43 141.7 141.7;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#FFCC00;}
|
||||
</style>
|
||||
<g>
|
||||
<g>
|
||||
<path class="st0" d="M157.1,71.9l-52-97.5c-1.3-2.4-3.8-4-6.6-4c-2.8,0-5.3,1.5-6.6,4L39.6,71.9c-1.2,2.3-1.2,5.1,0.2,7.4
|
||||
c1.4,2.3,3.8,3.7,6.5,3.7h104.3c2.6,0,5.1-1.4,6.4-3.7C158.3,77,158.4,74.2,157.1,71.9L157.1,71.9z M98.5,67.9
|
||||
c-4.1,0-7.5-3.3-7.5-7.5c0-4.1,3.4-7.5,7.5-7.5c4.1,0,7.5,3.4,7.5,7.5C106,64.6,102.6,67.9,98.5,67.9L98.5,67.9z M106,38
|
||||
c0,4.2-3.4,7.5-7.5,7.5c-4.1,0-7.5-3.3-7.5-7.5V8c0-4.1,3.4-7.5,7.5-7.5c4.1,0,7.5,3.4,7.5,7.5V38z M106,38"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 920 B |
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="28 -43 141.7 141.7" style="enable-background:new 28 -43 141.7 141.7;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#818180;}
|
||||
</style>
|
||||
<g>
|
||||
<g>
|
||||
<path class="st0" d="M157.1,71.9l-52-97.5c-1.3-2.4-3.8-4-6.6-4c-2.8,0-5.3,1.5-6.6,4L39.6,71.9c-1.2,2.3-1.2,5.1,0.2,7.4
|
||||
c1.4,2.3,3.8,3.7,6.5,3.7h104.3c2.6,0,5.1-1.4,6.4-3.7C158.3,77,158.4,74.2,157.1,71.9L157.1,71.9z M98.5,67.9
|
||||
c-4.1,0-7.5-3.3-7.5-7.5c0-4.1,3.4-7.5,7.5-7.5c4.1,0,7.5,3.4,7.5,7.5C106,64.6,102.6,67.9,98.5,67.9L98.5,67.9z M106,38
|
||||
c0,4.2-3.4,7.5-7.5,7.5c-4.1,0-7.5-3.3-7.5-7.5V8c0-4.1,3.4-7.5,7.5-7.5c4.1,0,7.5,3.4,7.5,7.5V38z M106,38"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 920 B |
|
|
@ -0,0 +1,14 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 85 56.7" style="enable-background:new 0 0 85 56.7;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#838281;}
|
||||
</style>
|
||||
<g>
|
||||
<path class="st0" d="M7,43.6c1,1,2.1,1.5,3.5,1.5h59.9c1.4,0,2.5-0.5,3.5-1.5c1-1,1.5-2.1,1.5-3.5v-6h2.3c1.3,0,2.3-1,2.3-2.3v-6.1
|
||||
c0-1.3-1-2.3-2.3-2.3h-2.3v-5.8c0-1.4-0.5-2.5-1.5-3.5c-1-1-2.1-1.5-3.5-1.5l-59.9,0c-1.4,0-2.6,0.5-3.5,1.4c-1,1-1.4,2.2-1.4,3.5
|
||||
v22.4C5.5,41.4,6,42.6,7,43.6L7,43.6z M9.1,16.7c0-0.3,0.1-0.4,0.4-0.4l61.9,0c0.2,0,0.4,0.2,0.4,0.4v24.4c0,0.2-0.2,0.4-0.4,0.4
|
||||
l-61.9,0c-0.3,0-0.4-0.1-0.4-0.4V16.7z M9.1,16.7"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 870 B |
|
|
@ -0,0 +1,14 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="28 -43 141.7 141.7" style="enable-background:new 28 -43 141.7 141.7;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#E60000;}
|
||||
</style>
|
||||
<g>
|
||||
<path class="st0" d="M98.9,87l60.9-61.9c0.8-0.8,1.2-1.9,1.1-3l0,0C156.7-8.4,130.5-32,98.9-32c-31.5,0-57.7,23.5-62,53.8v0.1V22
|
||||
l0,0c-0.1,1,0.3,2.1,1.1,2.9l42.9,43.8 M107,68.2l14.8-49.6c3.3-4.7,8.7-7.8,14.9-7.8c7.2,0,13.4,4.2,16.4,10.3L107,68.2z M83.7,19
|
||||
c3.2-4.9,8.8-8.2,15.2-8.2c6.2,0,11.7,3.1,15,7.9L99,68.7L83.7,19z M44.5,20.8c3-6,9.1-10.1,16.2-10.1c6.2,0,11.7,3.1,14.9,7.8
|
||||
l15.1,49.4L44.5,20.8z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 854 B |
|
|
@ -1,11 +1,15 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
width="141.7px" height="141.7px" viewBox="0 0 141.7 141.7" enable-background="new 0 0 141.7 141.7" xml:space="preserve">
|
||||
viewBox="28 -43 141.7 141.7" style="enable-background:new 28 -43 141.7 141.7;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#818181;}
|
||||
</style>
|
||||
<g>
|
||||
<path fill="#818181" d="M70.9,130l60.9-61.9c0.8-0.8,1.2-1.9,1.1-3h0c-4.2-30.5-30.4-54.1-62-54.1c-31.5,0-57.7,23.5-62,53.8
|
||||
c0,0,0,0.1,0,0.1c0,0,0,0.1,0,0.1h0c-0.1,1,0.3,2.1,1.1,2.9l42.9,43.8 M79,111.2l14.8-49.6c3.3-4.7,8.7-7.8,14.9-7.8
|
||||
c7.2,0,13.4,4.2,16.4,10.3L79,111.2z M55.7,62c3.2-4.9,8.8-8.2,15.2-8.2c6.2,0,11.7,3.1,15,7.9l-14.9,50L55.7,62z M16.5,63.8
|
||||
c3-6,9.1-10.1,16.2-10.1c6.2,0,11.7,3.1,14.9,7.8l15.1,49.4L16.5,63.8z"/>
|
||||
<path class="st0" d="M98.9,87l60.9-61.9c0.8-0.8,1.2-1.9,1.1-3l0,0C156.7-8.4,130.5-32,98.9-32c-31.5,0-57.7,23.5-62,53.8v0.1V22
|
||||
l0,0c-0.1,1,0.3,2.1,1.1,2.9l42.9,43.8 M107,68.2l14.8-49.6c3.3-4.7,8.7-7.8,14.9-7.8c7.2,0,13.4,4.2,16.4,10.3L107,68.2z M83.7,19
|
||||
c3.2-4.9,8.8-8.2,15.2-8.2c6.2,0,11.7,3.1,15,7.9L99,68.7L83.7,19z M44.5,20.8c3-6,9.1-10.1,16.2-10.1c6.2,0,11.7,3.1,14.9,7.8
|
||||
|
||||
l15.1,49.4L44.5,20.8z"/>
|
||||
</g>
|
||||
</svg>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 844 B After Width: | Height: | Size: 854 B |
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="28 -43 141.7 141.7" style="enable-background:new 28 -43 141.7 141.7;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#59AA29;}
|
||||
</style>
|
||||
<g>
|
||||
<g>
|
||||
<path class="st0" d="M146.1,18.3l-21,21c-11.6,11.6-30.4,11.6-42,0c-1.8-1.8-3.3-3.9-4.5-6l9.8-9.8c0.5-0.5,1-0.7,1.6-1.1
|
||||
c0.7,2.3,1.9,4.5,3.7,6.3c5.8,5.8,15.2,5.8,21,0l21-21c5.8-5.8,5.8-15.2,0-21s-15.2-5.8-21,0l-7.5,7.5c-6.1-2.4-12.6-3-18.9-2.1
|
||||
l15.9-15.9c11.6-11.6,30.4-11.6,42,0C157.7-12,157.7,6.8,146.1,18.3L146.1,18.3z M90.6,52.8l-7.5,7.5c-5.8,5.8-15.2,5.8-21,0
|
||||
s-5.8-15.2,0-21l21-21c5.8-5.8,15.2-5.8,21,0c1.8,1.8,3,4,3.7,6.3c0.6-0.3,1.1-0.6,1.6-1l9.8-9.7c-1.2-2.1-2.7-4.2-4.5-6
|
||||
c-11.6-11.6-30.4-11.6-42,0l-21,21c-11.6,11.6-11.6,30.4,0,42s30.4,11.6,42,0L109.6,55C103.2,55.8,96.7,55.2,90.6,52.8L90.6,52.8z
|
||||
"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="28 -43 141.7 141.7" style="enable-background:new 28 -43 141.7 141.7;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#818180;}
|
||||
</style>
|
||||
<g>
|
||||
<g>
|
||||
<path class="st0" d="M146.1,18.3l-21,21c-11.6,11.6-30.4,11.6-42,0c-1.8-1.8-3.3-3.9-4.5-6l9.8-9.8c0.5-0.5,1-0.7,1.6-1.1
|
||||
c0.7,2.3,1.9,4.5,3.7,6.3c5.8,5.8,15.2,5.8,21,0l21-21c5.8-5.8,5.8-15.2,0-21s-15.2-5.8-21,0l-7.5,7.5c-6.1-2.4-12.6-3-18.9-2.1
|
||||
l15.9-15.9c11.6-11.6,30.4-11.6,42,0C157.7-12,157.7,6.8,146.1,18.3L146.1,18.3z M90.6,52.8l-7.5,7.5c-5.8,5.8-15.2,5.8-21,0
|
||||
s-5.8-15.2,0-21l21-21c5.8-5.8,15.2-5.8,21,0c1.8,1.8,3,4,3.7,6.3c0.6-0.3,1.1-0.6,1.6-1l9.8-9.7c-1.2-2.1-2.7-4.2-4.5-6
|
||||
c-11.6-11.6-30.4-11.6-42,0l-21,21c-11.6,11.6-11.6,30.4,0,42s30.4,11.6,42,0L109.6,55C103.2,55.8,96.7,55.2,90.6,52.8L90.6,52.8z
|
||||
"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
|
|
@ -128,6 +128,9 @@ var MSP = {
|
|||
ledDirectionLetters: ['n', 'e', 's', 'w', 'u', 'd'], // in LSB bit order
|
||||
ledFunctionLetters: ['i', 'w', 'f', 'a', 't', 'r', 'c'], // in LSB bit order
|
||||
|
||||
last_received_timestamp: null,
|
||||
analog_last_received_timestamp: null,
|
||||
|
||||
supportedBaudRates: [ // 0 based index.
|
||||
'AUTO',
|
||||
'9600',
|
||||
|
|
@ -233,6 +236,7 @@ var MSP = {
|
|||
console.log('Unknown state detected: ' + this.state);
|
||||
}
|
||||
}
|
||||
this.last_received_timestamp = Date.now();
|
||||
},
|
||||
process_data: function (code, message_buffer, message_length) {
|
||||
var data = new DataView(message_buffer, 0); // DataView (allowing us to view arrayBuffer as struct/union)
|
||||
|
|
@ -330,6 +334,7 @@ var MSP = {
|
|||
ANALOG.mAhdrawn = data.getUint16(1, 1);
|
||||
ANALOG.rssi = data.getUint16(3, 1); // 0-1023
|
||||
ANALOG.amperage = data.getInt16(5, 1) / 100; // A
|
||||
this.analog_last_received_timestamp = Date.now();
|
||||
break;
|
||||
case MSP_codes.MSP_RC_TUNING:
|
||||
var offset = 0;
|
||||
|
|
|
|||
|
|
@ -264,7 +264,9 @@ function onConnect() {
|
|||
port_picker.hide();
|
||||
|
||||
var dataflash = $('#dataflash_wrapper_global');
|
||||
dataflash.show();
|
||||
dataflash.show();
|
||||
|
||||
startLiveDataRefreshTimer();
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -286,6 +288,9 @@ function onClosed(result) {
|
|||
|
||||
var dataflash = $('#dataflash_wrapper_global');
|
||||
dataflash.hide();
|
||||
|
||||
var battery = $('#quad-status_wrapper');
|
||||
battery.hide();
|
||||
}
|
||||
|
||||
function read_serial(info) {
|
||||
|
|
@ -339,7 +344,7 @@ function sensor_status(sensors_detected) {
|
|||
|
||||
if (have_sensor(sensors_detected, 'mag')) {
|
||||
$('.mag', e_sensor_status).addClass('on');
|
||||
$('.magicon', e_sensor_status).addClass('active');
|
||||
$('.magicon', e_sensor_status).addClass('active');
|
||||
} else {
|
||||
$('.mag', e_sensor_status).removeClass('on');
|
||||
$('.magicon', e_sensor_status).removeClass('active');
|
||||
|
|
@ -347,7 +352,7 @@ function sensor_status(sensors_detected) {
|
|||
|
||||
if (have_sensor(sensors_detected, 'gps')) {
|
||||
$('.gps', e_sensor_status).addClass('on');
|
||||
$('.gpsicon', e_sensor_status).addClass('active');
|
||||
$('.gpsicon', e_sensor_status).addClass('active');
|
||||
} else {
|
||||
$('.gps', e_sensor_status).removeClass('on');
|
||||
$('.gpsicon', e_sensor_status).removeClass('active');
|
||||
|
|
@ -385,34 +390,117 @@ function highByte(num) {
|
|||
|
||||
function lowByte(num) {
|
||||
return 0x00FF & num;
|
||||
}function update_dataflash_global() {
|
||||
var supportsDataflash = DATAFLASH.totalSize > 0;
|
||||
if (supportsDataflash){
|
||||
}
|
||||
|
||||
$(".noflash_global").css({
|
||||
display: 'none'
|
||||
});
|
||||
function update_dataflash_global() {
|
||||
var supportsDataflash = DATAFLASH.totalSize > 0;
|
||||
if (supportsDataflash){
|
||||
|
||||
$(".dataflash-contents_global").css({
|
||||
display: 'block'
|
||||
});
|
||||
$(".noflash_global").css({
|
||||
display: 'none'
|
||||
});
|
||||
|
||||
$(".dataflash-contents_global").css({
|
||||
display: 'block'
|
||||
});
|
||||
|
||||
$(".dataflash-free_global").css({
|
||||
width: (100-(DATAFLASH.totalSize - DATAFLASH.usedSize) / DATAFLASH.totalSize * 100) + "%",
|
||||
display: 'block'
|
||||
});
|
||||
$(".dataflash-free_global div").text('Dataflash: free ' + formatFilesize(DATAFLASH.totalSize - DATAFLASH.usedSize));
|
||||
} else {
|
||||
$(".noflash_global").css({
|
||||
display: 'block'
|
||||
});
|
||||
$(".dataflash-free_global").css({
|
||||
width: (100-(DATAFLASH.totalSize - DATAFLASH.usedSize) / DATAFLASH.totalSize * 100) + "%",
|
||||
display: 'block'
|
||||
});
|
||||
$(".dataflash-free_global div").text('Dataflash: free ' + formatFilesize(DATAFLASH.totalSize - DATAFLASH.usedSize));
|
||||
} else {
|
||||
$(".noflash_global").css({
|
||||
display: 'block'
|
||||
});
|
||||
|
||||
$(".dataflash-contents_global").css({
|
||||
display: 'none'
|
||||
});
|
||||
}
|
||||
|
||||
$(".dataflash-contents_global").css({
|
||||
display: 'none'
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function startLiveDataRefreshTimer() {
|
||||
// live data refresh
|
||||
GUI.timeout_add('data_refresh', function () { update_live_status(); }, 100);
|
||||
}
|
||||
|
||||
function update_live_status() {
|
||||
|
||||
var statuswrapper = $('#quad-status_wrapper');
|
||||
|
||||
$(".quad-status-contents").css({
|
||||
display: 'inline-block'
|
||||
});
|
||||
|
||||
if (GUI.active_tab != 'cli') {
|
||||
MSP.send_message(MSP_codes.MSP_BOXNAMES, false, false);
|
||||
MSP.send_message(MSP_codes.MSP_STATUS, false, false);
|
||||
MSP.send_message(MSP_codes.MSP_ANALOG, false, false);
|
||||
}
|
||||
|
||||
var active = ((Date.now() - MSP.analog_last_received_timestamp) < 300);
|
||||
|
||||
for (var i = 0; i < AUX_CONFIG.length; i++) {
|
||||
if (AUX_CONFIG[i] == 'ARM') {
|
||||
if (bit_check(CONFIG.mode, i))
|
||||
$(".armedicon").css({
|
||||
'background-image': 'url(images/icons/cf_icon_armed_active.svg)'
|
||||
});
|
||||
else
|
||||
$(".armedicon").css({
|
||||
'background-image': 'url(images/icons/cf_icon_armed_grey.svg)'
|
||||
});
|
||||
}
|
||||
if (AUX_CONFIG[i] == 'FAILSAFE') {
|
||||
if (bit_check(CONFIG.mode, i))
|
||||
$(".failsafeicon").css({
|
||||
'background-image': 'url(images/icons/cf_icon_failsafe_active.svg)'
|
||||
});
|
||||
else
|
||||
$(".failsafeicon").css({
|
||||
'background-image': 'url(images/icons/cf_icon_failsafe_grey.svg)'
|
||||
});
|
||||
}
|
||||
}
|
||||
if (ANALOG != undefined) {
|
||||
var nbCells = Math.floor(ANALOG.voltage / MISC.vbatmaxcellvoltage) + 1;
|
||||
if (ANALOG.voltage == 0)
|
||||
nbCells = 1;
|
||||
|
||||
var min = MISC.vbatmincellvoltage * nbCells;
|
||||
var max = MISC.vbatmaxcellvoltage * nbCells;
|
||||
var warn = MISC.vbatwarningcellvoltage * nbCells;
|
||||
|
||||
$(".battery-status").css({
|
||||
width: ((ANALOG.voltage - min) / (max - min) * 100) + "%",
|
||||
display: 'inline-block'
|
||||
});
|
||||
|
||||
if (active) {
|
||||
$(".linkicon").css({
|
||||
'background-image': 'url(images/icons/cf_icon_link_active.svg)'
|
||||
});
|
||||
} else {
|
||||
$(".linkicon").css({
|
||||
'background-image': 'url(images/icons/cf_icon_link_grey.svg)'
|
||||
});
|
||||
}
|
||||
|
||||
if (ANALOG.voltage < warn) {
|
||||
$(".battery-status").css('background-color', '#D42133');
|
||||
} else {
|
||||
$(".battery-status").css('background-color', '#59AA29');
|
||||
}
|
||||
|
||||
$(".battery-legend").text(ANALOG.voltage + " V");
|
||||
}
|
||||
|
||||
statuswrapper.show();
|
||||
GUI.timeout_remove('data_refresh');
|
||||
startLiveDataRefreshTimer();
|
||||
}
|
||||
|
||||
function specificByte(num, pos) {
|
||||
return 0x000000FF & (num >> (8 * pos));
|
||||
|
|
|
|||
114
main.css
114
main.css
|
|
@ -1478,7 +1478,7 @@ dialog {
|
|||
margin-top: 20px;
|
||||
width:125px;
|
||||
float: right;
|
||||
margin-right: 20px;
|
||||
margin-right: 10px;
|
||||
line-height: 12px;
|
||||
height: 33px;
|
||||
border-radius: 5px;
|
||||
|
|
@ -1566,6 +1566,116 @@ dialog {
|
|||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* Battery element styling*/
|
||||
|
||||
#quad-status_wrapper {
|
||||
display:none;
|
||||
color: white;
|
||||
font-size: 10px;
|
||||
margin-top: 20px;
|
||||
width: 90px;
|
||||
float: right;
|
||||
margin-right: 20px;
|
||||
line-height: 12px;
|
||||
height: 67px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #272727;
|
||||
box-shadow: 0px 1px 0px rgba(92, 92, 92, 0.5);
|
||||
background-color: #434343;
|
||||
background-image: -webkit-linear-gradient(top, transparent, rgba(0, 0, 0, 0.55));
|
||||
text-shadow: 0px 1px rgba(0, 0, 0, 1.0);
|
||||
}
|
||||
|
||||
.quad-status-contents {
|
||||
display: none;
|
||||
margin-top: 14px;
|
||||
margin-left: 7px;
|
||||
height: 15px;
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
|
||||
.battery-legend {
|
||||
display: inline;
|
||||
position: relative;
|
||||
top: -5px;
|
||||
margin-top: 0px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 40px;
|
||||
text-align: left;
|
||||
color: silver;
|
||||
margin-left: -3px;
|
||||
}
|
||||
|
||||
.quad-status-contents progress::-webkit-progress-bar {
|
||||
height: 12px;
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.quad-status-contents progress::-webkit-progress-value {
|
||||
background-color: #bcf;
|
||||
}
|
||||
|
||||
.battery-status {
|
||||
height: 15px;
|
||||
position: relative;
|
||||
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.20);
|
||||
border-radius: 2px;
|
||||
background-color: #59AA29;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.battery-icon {
|
||||
background-image: url(images/icons/cf_icon_bat_grey.svg);
|
||||
background-size: contain;
|
||||
background-position: center;
|
||||
display: inline-block;
|
||||
height: 41px;
|
||||
width: 60px;
|
||||
transition: none;
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.armedicon,
|
||||
.failsafeicon,
|
||||
.linkicon {
|
||||
float: left;
|
||||
margin-left: 8px;
|
||||
margin-right: 2px;
|
||||
margin-top: 6px;
|
||||
display: block;
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
opacity: 0.8;
|
||||
background-size: contain;
|
||||
background-position: center;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.armedicon {
|
||||
background-image: url(images/icons/cf_icon_armed_grey.svg);
|
||||
}
|
||||
.failsafeicon {
|
||||
background-image: url(images/icons/cf_icon_failsafe_grey.svg);
|
||||
}
|
||||
|
||||
.linkicon {
|
||||
background-image: url(images/icons/cf_icon_link_grey.svg);
|
||||
}
|
||||
|
||||
.bottomStatusIcons {
|
||||
background-color: #272727;
|
||||
height: 31px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media only screen and (max-width: 1055px) , only screen and (max-device-width: 1055px) {
|
||||
|
||||
.content_wrapper {
|
||||
|
|
@ -1679,4 +1789,4 @@ input {
|
|||
overflow-y: auto;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
15
main.html
15
main.html
|
|
@ -132,7 +132,7 @@
|
|||
</div>
|
||||
<div class="header-wrapper">
|
||||
<div id="dataflash_wrapper_global">
|
||||
<div class="noflash_global" align="center">No dataflash <br>chip found</div>
|
||||
<div class="noflash_global" align="center">No dataflash <br>chip found</div>
|
||||
<ul class="dataflash-contents_global">
|
||||
<li class="dataflash-free_global">
|
||||
<div class="legend">Dataflash: free space</div>
|
||||
|
|
@ -172,6 +172,19 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="quad-status_wrapper">
|
||||
<div class="battery-icon">
|
||||
<div class="quad-status-contents">
|
||||
<div class="battery-status"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="battery-legend">Battery voltage</div>
|
||||
<div class="bottomStatusIcons">
|
||||
<div class="armedicon cf_tip" i18n_title="mainHelpArmed"></div>
|
||||
<div class="failsafeicon cf_tip" i18n_title="mainHelpFailsafe"></div>
|
||||
<div class="linkicon cf_tip" i18n_title="mainHelpLink"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear-both"></div>
|
||||
|
|
|
|||
|
|
@ -205,4 +205,49 @@
|
|||
width: calc(75% - 20px);
|
||||
height: calc(100% - 218px);
|
||||
}
|
||||
}
|
||||
|
||||
#accel_calib_running {
|
||||
display: none;
|
||||
|
||||
width: 100%;
|
||||
position: relative;
|
||||
margin-bottom: 0px;
|
||||
margin-top: 0px;
|
||||
float: left;
|
||||
|
||||
padding: 5px 0px 5px 0px;
|
||||
text-align: center;
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #59aa29;
|
||||
color: #59aa29;
|
||||
font-family: 'open_sanssemibold', Arial;
|
||||
font-size: 12px;
|
||||
line-height: 13px;
|
||||
transition: all ease 0.2s;
|
||||
text-decoration:none;
|
||||
|
||||
}
|
||||
|
||||
#mag_calib_running {
|
||||
display: none;
|
||||
|
||||
width: 100%;
|
||||
position: relative;
|
||||
margin-bottom: 0px;
|
||||
margin-top: 0px;
|
||||
float: left;
|
||||
|
||||
padding: 5px 0px 5px 0px;
|
||||
text-align: center;
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #59aa29;
|
||||
color: #59aa29;
|
||||
font-family: 'open_sanssemibold', Arial;
|
||||
font-size: 12px;
|
||||
line-height: 13px;
|
||||
transition: all ease 0.2s;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
|
@ -9,11 +9,27 @@
|
|||
<div class="cf_column fourth buttonarea">
|
||||
<div class="spacer_right">
|
||||
<div class="default_btn">
|
||||
<a class="calibrateAccel" id="default_btn green" href="#"
|
||||
i18n="initialSetupButtonCalibrateAccel"></a>
|
||||
<div id="accel_calib_rest">
|
||||
<a class="calibrateAccel" id="default_btn green" href="#"
|
||||
i18n="initialSetupButtonCalibrateAccel"></a>
|
||||
</div>
|
||||
|
||||
<div id="accel_calib_running">
|
||||
<div class="data-loading">
|
||||
<p>Calibrating...</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="default_btn">
|
||||
<a class="calibrateMag" href="#" i18n="initialSetupButtonCalibrateMag"></a>
|
||||
<div id="mag_calib_rest">
|
||||
<a class="calibrateMag" href="#" i18n="initialSetupButtonCalibrateMag"></a>
|
||||
</div>
|
||||
|
||||
<div id="mag_calib_running">
|
||||
<div class="data-loading">
|
||||
<p>Calibrating...</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="default_btn">
|
||||
<a class="resetSettings" href="#" i18n="initialSetupButtonReset"></a>
|
||||
|
|
|
|||
|
|
@ -74,14 +74,17 @@ TABS.setup.initialize = function (callback) {
|
|||
GUI.interval_pause('setup_data_pull');
|
||||
MSP.send_message(MSP_codes.MSP_ACC_CALIBRATION, false, false, function () {
|
||||
GUI.log(chrome.i18n.getMessage('initialSetupAccelCalibStarted'));
|
||||
$('#accel_calib_running').show();
|
||||
$('#accel_calib_rest').hide();
|
||||
});
|
||||
|
||||
GUI.timeout_add('button_reset', function () {
|
||||
GUI.interval_resume('setup_data_pull');
|
||||
|
||||
GUI.log(chrome.i18n.getMessage('initialSetupAccelCalibEnded'));
|
||||
|
||||
self.removeClass('calibrating');
|
||||
$('#accel_calib_running').hide();
|
||||
$('#accel_calib_rest').show();
|
||||
}, 2000);
|
||||
}
|
||||
});
|
||||
|
|
@ -94,11 +97,15 @@ TABS.setup.initialize = function (callback) {
|
|||
|
||||
MSP.send_message(MSP_codes.MSP_MAG_CALIBRATION, false, false, function () {
|
||||
GUI.log(chrome.i18n.getMessage('initialSetupMagCalibStarted'));
|
||||
$('#mag_calib_running').show();
|
||||
$('#mag_calib_rest').hide();
|
||||
});
|
||||
|
||||
GUI.timeout_add('button_reset', function () {
|
||||
GUI.log(chrome.i18n.getMessage('initialSetupMagCalibEnded'));
|
||||
self.removeClass('calibrating');
|
||||
$('#mag_calib_running').hide();
|
||||
$('#mag_calib_rest').show();
|
||||
}, 30000);
|
||||
}
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue