Mirror/betaflight-configurator
1
0
Fork 0
mirror of https://github.com/betaflight/betaflight-configurator.git synced 2025-07-16 21:05:30 +03:00
Code Issues Wiki Activity

Fix Firmware Flasher progress bar color indicators

Browse source 
There was previous logic in place to display a visual indicator for the status of the firmware flash using different colors for the progress bar. Unfortunately the logic was never working, or was broken at some point. The progress bar color would remain the default even if the flashing failed, making it difficult to recognize there was a problem.

Fixed to display the progress bar in green for success, red for failed, and blue for other "action required" types of failures. The logic was already there to try and display the red and blue indicators but they weren't working.
This commit is contained in:
Bruce Luckcuck 2019-04-14 20:04:02 -04:00
parent 2c7d47bbdc
commit cc4406a748
3 changed files with 35 additions and 52 deletions
Download patch file Download diff file Expand all files Collapse all files

45
src/css/tabs/firmware_flasher.css
View file

@ -38,6 +38,21 @@
text-decoration: underline; text-decoration: underline;
} }
.tab-firmware_flasher .info .progressLabel.valid {
background-color: #00d000;
border-radius: 5px;
}
.tab-firmware_flasher .info .progressLabel.invalid {
background-color: #A62E32;
border-radius: 5px;
}
.tab-firmware_flasher .info .progressLabel.actionRequired {
background-color: #0081FF;
border-radius: 5px;
}
.tab-firmware_flasher .info .progress { .tab-firmware_flasher .info .progress {
width: 100%; width: 100%;
height: 26px; height: 26px;
@ -60,36 +75,6 @@
border-radius: 4px; border-radius: 4px;
} }
.tab-firmware_flasher .info .progress.valid::-webkit-progress-bar {
background-color: #ffbb00;
border-radius: 4px;
}
.tab-firmware_flasher .info .progress.valid::-webkit-progress-value {
background-color: #ffbb00;
border-radius: 4px;
}
.tab-firmware_flasher .info .progress.invalid::-webkit-progress-bar {
background-color: #A62E32;
border-radius: 4px;
}
.tab-firmware_flasher .info .progress.invalid::-webkit-progress-value {
background-color: #A62E32;
border-radius: 4px;
}
.tab-firmware_flasher .info .progress.actionRequired::-webkit-progress-bar {
background-color: #0081FF;
border-radius: 4px;
}
.tab-firmware_flasher .info .progress.actionRequired::-webkit-progress-value {
background-color: #0081FF;
border-radius: 4px;
}
.tab-firmware_flasher ul li { .tab-firmware_flasher ul li {
list-style: initial; list-style: initial;
list-style-type: circle; list-style-type: circle;

21
src/js/protocols/stm32.js
View file

@ -145,7 +145,8 @@ STM32_protocol.prototype.initialize = function () {
// reset progress bar to initial state // reset progress bar to initial state
self.progress_bar_e = $('.progress'); self.progress_bar_e = $('.progress');
self.progress_bar_e.val(0); self.progress_bar_e.val(0);
self.progress_bar_e.removeClass('valid invalid'); self.progress_label_e = $('span.progressLabel');
self.progress_label_e.removeClass('valid invalid actionRequired');
// lock some UI elements TODO needs rework // lock some UI elements TODO needs rework
$('select[name="release"]').prop('disabled', true); $('select[name="release"]').prop('disabled', true);
@ -161,7 +162,7 @@ STM32_protocol.prototype.initialize = function () {
console.log('STM32 - timed out, programming failed ...'); console.log('STM32 - timed out, programming failed ...');
$('span.progressLabel').text(i18n.getMessage('stm32TimedOut')); $('span.progressLabel').text(i18n.getMessage('stm32TimedOut'));
self.progress_bar_e.addClass('invalid'); self.progress_label_e.addClass('invalid');
// protocol got stuck, clear timer and disconnect // protocol got stuck, clear timer and disconnect
GUI.interval_remove('STM32_timeout'); GUI.interval_remove('STM32_timeout');
@ -244,7 +245,7 @@ STM32_protocol.prototype.verify_response = function (val, data) {
var message = 'STM32 Communication failed, wrong response, expected: ' + val + ' (0x' + val.toString(16) + ') received: ' + data[0] + ' (0x' + data[0].toString(16) + ')'; var message = 'STM32 Communication failed, wrong response, expected: ' + val + ' (0x' + val.toString(16) + ') received: ' + data[0] + ' (0x' + data[0].toString(16) + ')';
console.error(message); console.error(message);
$('span.progressLabel').text(i18n.getMessage('stm32WrongResponse',[val, val.toString(16), data[0], data[0].toString(16)])); $('span.progressLabel').text(i18n.getMessage('stm32WrongResponse',[val, val.toString(16), data[0], data[0].toString(16)]));
self.progress_bar_e.addClass('invalid'); self.progress_label_e.addClass('invalid');
// disconnect // disconnect
this.upload_procedure(99); this.upload_procedure(99);
@ -369,7 +370,7 @@ STM32_protocol.prototype.upload_procedure = function (step) {
self.upload_procedure(2); self.upload_procedure(2);
} else { } else {
$('span.progressLabel').text(i18n.getMessage('stm32ContactingBootloaderFailed')); $('span.progressLabel').text(i18n.getMessage('stm32ContactingBootloaderFailed'));
self.progress_bar_e.addClass('invalid'); self.progress_label_e.addClass('invalid');
GUI.interval_remove('stm32_initialize_mcu'); GUI.interval_remove('stm32_initialize_mcu');
@ -383,7 +384,7 @@ STM32_protocol.prototype.upload_procedure = function (step) {
console.log('STM32 - no response from bootloader, disconnecting'); console.log('STM32 - no response from bootloader, disconnecting');
$('span.progressLabel').text(i18n.getMessage('stm32ResponseBootloaderFailed')); $('span.progressLabel').text(i18n.getMessage('stm32ResponseBootloaderFailed'));
self.progress_bar_e.addClass('invalid'); self.progress_label_e.addClass('invalid');
GUI.interval_remove('stm32_initialize_mcu'); GUI.interval_remove('stm32_initialize_mcu');
GUI.interval_remove('STM32_timeout'); GUI.interval_remove('STM32_timeout');
@ -699,19 +700,17 @@ STM32_protocol.prototype.upload_procedure = function (step) {
if (verify) { if (verify) {
console.log('Programming: SUCCESSFUL'); console.log('Programming: SUCCESSFUL');
$('span.progressLabel').text(i18n.getMessage('stm32ProgrammingSuccessful'));
// update progress bar // update progress bar
self.progress_bar_e.addClass('valid'); $('span.progressLabel').text(i18n.getMessage('stm32ProgrammingSuccessful'));
self.progress_label_e.addClass('valid');
// proceed to next step // proceed to next step
self.upload_procedure(7); self.upload_procedure(7);
} else { } else {
console.log('Programming: FAILED'); console.log('Programming: FAILED');
$('span.progressLabel').text(i18n.getMessage('stm32ProgrammingFailed'));
// update progress bar // update progress bar
self.progress_bar_e.addClass('invalid'); $('span.progressLabel').text(i18n.getMessage('stm32ProgrammingFailed'));
self.progress_label_e.addClass('invalid');
// disconnect // disconnect
self.upload_procedure(99); self.upload_procedure(99);

21
src/js/protocols/stm32usbdfu.js
View file

@ -87,7 +87,8 @@ STM32DFU_protocol.prototype.connect = function (device, hex, options, callback)
// reset progress bar to initial state // reset progress bar to initial state
self.progress_bar_e = $('.progress'); self.progress_bar_e = $('.progress');
self.progress_bar_e.val(0); self.progress_bar_e.val(0);
self.progress_bar_e.removeClass('valid invalid'); self.progress_label_e = $('span.progressLabel');
self.progress_label_e.removeClass('valid invalid actionRequired');
chrome.usb.getDevices(device, function (result) { chrome.usb.getDevices(device, function (result) {
if (result.length) { if (result.length) {
@ -580,7 +581,7 @@ STM32DFU_protocol.prototype.upload_procedure = function (step) {
console.log('Initiate read unprotect'); console.log('Initiate read unprotect');
GUI.log(i18n.getMessage('stm32ReadProtected')); GUI.log(i18n.getMessage('stm32ReadProtected'));
$('span.progressLabel').text(i18n.getMessage('stm32ReadProtected')); $('span.progressLabel').text(i18n.getMessage('stm32ReadProtected'));
self.progress_bar_e.addClass('actionRequired'); self.progress_label_e.addClass('actionRequired');
self.controlTransfer('out', self.request.DNLOAD, 0, 0, 0, [0x92], function () { // 0x92 initiates read unprotect self.controlTransfer('out', self.request.DNLOAD, 0, 0, 0, [0x92], function () { // 0x92 initiates read unprotect
self.controlTransfer('in', self.request.GETSTATUS, 0, 0, 6, 0, function (data) { self.controlTransfer('in', self.request.GETSTATUS, 0, 0, 6, 0, function (data) {
@ -604,12 +605,12 @@ STM32DFU_protocol.prototype.upload_procedure = function (step) {
GUI.log(i18n.getMessage('stm32UnprotectUnplug')); GUI.log(i18n.getMessage('stm32UnprotectUnplug'));
$('span.progressLabel').text(i18n.getMessage('stm32UnprotectUnplug')); $('span.progressLabel').text(i18n.getMessage('stm32UnprotectUnplug'));
self.progress_bar_e.val(0); self.progress_bar_e.val(0);
self.progress_bar_e.addClass('actionRequired'); self.progress_label_e.addClass('actionRequired');
} else { // unprotecting the flight controller did not work. It did not reboot. } else { // unprotecting the flight controller did not work. It did not reboot.
console.log('Failed to execute unprotect memory command'); console.log('Failed to execute unprotect memory command');
GUI.log(i18n.getMessage('stm32UnprotectFailed')); GUI.log(i18n.getMessage('stm32UnprotectFailed'));
$('span.progressLabel').text(i18n.getMessage('stm32UnprotectFailed')); $('span.progressLabel').text(i18n.getMessage('stm32UnprotectFailed'));
self.progress_bar_e.addClass('invalid'); self.progress_label_e.addClass('invalid');
console.log(data); console.log(data);
self.upload_procedure(99); self.upload_procedure(99);
} }
@ -619,7 +620,7 @@ STM32DFU_protocol.prototype.upload_procedure = function (step) {
console.log('Failed to initiate unprotect memory command'); console.log('Failed to initiate unprotect memory command');
GUI.log(i18n.getMessage('stm32UnprotectInitFailed')); GUI.log(i18n.getMessage('stm32UnprotectInitFailed'));
$('span.progressLabel').text(i18n.getMessage('stm32UnprotectInitFailed')); $('span.progressLabel').text(i18n.getMessage('stm32UnprotectInitFailed'));
self.progress_bar_e.addClass('invalid'); self.progress_label_e.addClass('invalid');
self.upload_procedure(99); self.upload_procedure(99);
} }
}); });
@ -928,19 +929,17 @@ STM32DFU_protocol.prototype.upload_procedure = function (step) {
if (verify) { if (verify) {
console.log('Programming: SUCCESSFUL'); console.log('Programming: SUCCESSFUL');
$('span.progressLabel').text(i18n.getMessage('stm32ProgrammingSuccessful'));
// update progress bar // update progress bar
self.progress_bar_e.addClass('valid'); $('span.progressLabel').text(i18n.getMessage('stm32ProgrammingSuccessful'));
self.progress_label_e.addClass('valid');
// proceed to next step // proceed to next step
self.upload_procedure(6); self.upload_procedure(6);
} else { } else {
console.log('Programming: FAILED'); console.log('Programming: FAILED');
$('span.progressLabel').text(i18n.getMessage('stm32ProgrammingFailed'));
// update progress bar // update progress bar
self.progress_bar_e.addClass('invalid'); $('span.progressLabel').text(i18n.getMessage('stm32ProgrammingFailed'));
self.progress_label_e.addClass('invalid');
// disconnect // disconnect
self.upload_procedure(99); self.upload_procedure(99);