Color for vtx ready status

[HThuren]

Change to Device ready has green / red color, are moved up in presentation and are updated if device status change.

[blckmn]

AUTOMERGE: (FAIL)

• github identifies PR as mergeable -> FAIL
• assigned to a milestone -> PASS
• cooling off period lapsed -> PASS
• commit count less or equal to three -> FAIL
• Don't merge label NOT found -> PASS
• at least one RN: label found -> PASS
• Tested label found -> FAIL
• assigned to an approver -> FAIL
• approver count at least three -> FAIL

[McGiverGim]

It's cleaner for the translators simply apply the class to the element depending on the content. It's how we it usually in the rest of the code and does not imply new messages with class included.

[HThuren]

It's cleaner for the translators simply apply the class to the element depending on the content. It's how we it usually in the rest of the code and does not imply new messages with class included.

I am not sure what you address, I used the same setup as GPS fixed, can you give an exampel ?
This one

vtxReadyFalse = "<span class="fixfalse">No"

to embed the class in js or html ?

[McGiverGim]

Sorry for my late response, but I was out. What I was talking about is to do something like this:

betaflight-configurator/src/js/serial_backend.js

Line 681 in 9d9edf9

$(".armedicon").toggleClass('active', bit_check(FC.CONFIG.mode, i));

More info here: http://api.jquery.com/toggleclass/

This will add/remove the class depending on the second parameter true/false. In this way the messages file is clean, only with basic 'true' and 'false', and we use this in the same part of the code where we decide what to show, and where we assign MSP values to fields.

In the CSS file you can have a "red" value for the 'basic' class, and a gree value when the 'basic' class has a 'valid' class too, something similar to (the names are only for reference, better to use something more significative):

.basic {
  color: red;
}
.basic .valid {
  color: green;
}

Add a "custom" method like your latest version, I think is not the best way, because maybe we want it for YES/NO, or TRUE/FALSE, or ACEPTED/REJECTED, or VALID/NOT VALID... etc.

[HThuren]

@McGiverGim , no worry, I also have a fulltime job :-)

Very smart and rigorous way you decribe, I go for it .-.

[HThuren]

hi @McGiverGim

Well, I havn't suceed in the requested change, don't you think we still have a 'clean' message file with this construction

export function getColorYesNo(value) {
    return (value ? `<span class="fixtrue">${i18n.getMessage("Yes")}</span>` : `<span class="fixfalse">${i18n.getMessage("No")}</span>`);
}

called fx
$('.GPS_info td.fix').html(getColorYesNo(FC.GPS_DATA.fix));

[Benky]

Could it be something like this: Benky@aeaf2fd ?

[HThuren]

Could it be something like this: Benky@aeaf2fd ?

So simple and elegant :-) - thats the way

[haslinghuis]

Also notice plugging LIPO updates status - but removing LIPO the status remains. But is outside the scope of this PR.

[HThuren]

Also notice plugging LIPO updates status - but removing LIPO the status remains. But is outside the scope of this PR.

yes, I'm aware, another PR. :-)

[haslinghuis]

One left :)

[haslinghuis]

@McGiverGim should be good to go now

[McGiverGim]

A lot more functionality very interesting. The code seems ok to me.
But the less/css code can be a lot better using the less possibilities. Only one difference between the active and the basis class.
I'm on mobile, tomorrow I can suggest the exact code. Sorry but my real work has all my time lately.

[HThuren]

A lot more functionality very interesting. The code seems ok to me. But the less/css code can be a lot better using the less possibilities. Only one difference between the active and the basis class. I'm on mobile, tomorrow I can suggest the exact code. Sorry but my real work has all my time lately.

No worry and hurry, I look forward to learn about CSS/less

[McGiverGim]

Hi! Sorry for my late response, but I think this will work.

[haslinghuis]

@HThuren LGTM, only two unresolved issues remaining

[sonarcloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[github-actions]

Do you want to test this code? Here you have an automated build:
Betaflight-Configurator-Android
Betaflight-Configurator-Linux
Betaflight-Configurator-macOS
Betaflight-Configurator-Windows
WARNING: It may be unstable and result in corrupted configurations or data loss. Use only for testing!

[McGiverGim]

For the rest to me is ok. Thanks for the changes.

[haslinghuis]

@HThuren there is a problem. After save it does not retrieve status anymore - going false (red). Please revisit.

EDIT: Fixed in #3538