sundowndev
/
betaflight-configurator
mirror of https://github.com/sundowndev/betaflight-configurator.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor: use js to generate table contents

10.8-maintenance
Tomas Chmelevskij 2021-12-22 14:22:00 +01:00
parent f4bc4b366b
commit f71e4d0d1e
5 changed files with 40 additions and 227 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.sonarcloud.properties
View File

@ -1 +0,0 @@
sonar.cpd.exclusions=src/*.html

2
src/css/dark-theme.css
View File

@ -147,7 +147,7 @@ button {
border-style: solid; border-style: solid;
} }
.noboarder td { .cf_table tr:last-child td {
border-style: unset; border-style: unset;
} }

2
src/css/main.css
View File

@ -2148,7 +2148,7 @@ dialog .dialog_toolbar .btn a.disabled {
width: 33%; width: 33%;
} }
.noboarder td { .cf_table tr:last-child td {
border: none; border: none;
} }

63
src/js/tabs/gps.js
View File

@ -67,56 +67,67 @@ TABS.gps.initialize = function (callback) {
$('.GPS_info td.distToHome').text(FC.GPS_DATA.distanceToHome + ' m'); $('.GPS_info td.distToHome').text(FC.GPS_DATA.distanceToHome + ' m');
// Update GPS Signal Strengths // Update GPS Signal Strengths
const eSsTable = $('div.GPS_signal_strength table tr:not(.titles)'); const eSsTable = $('div.GPS_signal_strength table');
eSsTable.html('');
eSsTable.append(`
<tr class="titles">
<td style="width: 12%;" i18n="gpsSignalGnssId">${i18n.getMessage('gpsSignalGnssId')}</td>
<td style="width: 10%;" i18n="gpsSignalSatId">${i18n.getMessage('gpsSignalSatId')}</td>
<td style="width: 25%;" i18n="gpsSignalStr">${i18n.getMessage('gpsSignalStr')}</td>
<td style="width: 53%;" i18n="gpsSignalStatusQly">${i18n.getMessage('gpsSignalStatusQly')}</td>
</tr>
`);
if (FC.GPS_DATA.chn.length <= 16) { if (FC.GPS_DATA.chn.length <= 16) {
// Legacy code path: old BF firmware or old ublox module // Legacy code path: old BF firmware or old ublox module
for (let i = 0; i < FC.GPS_DATA.chn.length; i++) { for (let i = 0; i < FC.GPS_DATA.chn.length; i++) {
const row = eSsTable.eq(i); eSsTable.append(`
<tr>
$('td', row).eq(0).text('-'); <td>-</td>
$('td', row).eq(1).text(FC.GPS_DATA.svid[i]); <td>${FC.GPS_DATA.svid[i]}</td>
$('td', row).eq(2).find('progress').val(FC.GPS_DATA.cno[i]); <td><progress value="${FC.GPS_DATA.cno[i]}" max="99"></progress></td>
$('td', row).eq(3).text(FC.GPS_DATA.quality[i]); <td>${FC.GPS_DATA.quality[i]}</td>
</tr>
`);
} }
// Cleanup the rest of the table // Cleanup the rest of the table
for (let i = FC.GPS_DATA.chn.length; i < 32; i++) { for (let i = FC.GPS_DATA.chn.length; i < 32; i++) {
const row = eSsTable.eq(i); eSsTable.append(`
<tr>
$('td', row).eq(0).text('-'); <td>-</td>
$('td', row).eq(1).text('-'); <td>-</td>
$('td', row).eq(2).find('progress').val(0); <td><progress value="0" max="99"></progress></td>
$('td', row).eq(3).text(' '); <td> </td>
</tr>
`);
} }
} else { } else {
// M8N/M9N on newer firmware // M8N/M9N on newer firmware
const maxUIChannels = 32; //the list in html can only show 32 channels but future firmware could send more const maxUIChannels = 32; //the list in html can only show 32 channels but future firmware could send more
let channels = Math.min(maxUIChannels, FC.GPS_DATA.chn.length); let channels = Math.min(maxUIChannels, FC.GPS_DATA.chn.length) || 32;
for (let i = 0; i < channels; i++) { for (let i = 0; i < channels; i++) {
const row = eSsTable.eq(i); let rowContent = '';
if (FC.GPS_DATA.chn[i] <= 6) { if (FC.GPS_DATA.chn[i] <= 6) {
$('td', row).eq(0).text(gnssArray[FC.GPS_DATA.chn[i]]); rowContent += `<td>${gnssArray[FC.GPS_DATA.chn[i]]}</td>`;
} else { } else {
$('td', row).eq(0).text('-'); rowContent += '<td>-</td>';
} }
if (FC.GPS_DATA.chn[i] >= 7) { if (FC.GPS_DATA.chn[i] >= 7) {
$('td', row).eq(1).text('-'); rowContent += '<td>-</td>';
$('td', row).eq(2).find('progress').val(0); rowContent += `<td><progress value="${0}" max="99"></progress></td>`;
$('td', row).eq(3).text(' '); rowContent += `<td> </td>`;
} else { } else {
$('td', row).eq(1).text(FC.GPS_DATA.svid[i]); rowContent += `<td>${FC.GPS_DATA.svid[i]}</td>`;
$('td', row).eq(2).find('progress').val(FC.GPS_DATA.cno[i]); rowContent += `<td><progress value="${FC.GPS_DATA.cno[i]}" max="99"></progress></td>`;
const quality = i18n.getMessage(qualityArray[FC.GPS_DATA.quality[i] & 0x7]); const quality = i18n.getMessage(qualityArray[FC.GPS_DATA.quality[i] & 0x7]);
const used = i18n.getMessage(usedArray[(FC.GPS_DATA.quality[i] & 0x8) >> 3]); const used = i18n.getMessage(usedArray[(FC.GPS_DATA.quality[i] & 0x8) >> 3]);
const healthy = i18n.getMessage(healthyArray[(FC.GPS_DATA.quality[i] & 0x30) >> 4]); const healthy = i18n.getMessage(healthyArray[(FC.GPS_DATA.quality[i] & 0x30) >> 4]);
rowContent += `<td>${quality} | ${used} | ${healthy}</td>`;
$('td', row).eq(3).text(`${quality} | ${used} | ${healthy}`);
} }
eSsTable.append(`<tr>${rowContent}</tr>`);
} }
} }

199
src/tabs/gps.html
View File

@ -52,204 +52,7 @@
</div> </div>
<div class="spacer_box GPS_signal_strength"> <div class="spacer_box GPS_signal_strength">
<table class="cf_table"> <table class="cf_table">
<tr class="titles"> <!-- Contents generated in gps.js -->
<td style="width: 12%;" i18n="gpsSignalGnssId"></td>
<td style="width: 10%;" i18n="gpsSignalSatId"></td>
<td style="width: 25%;" i18n="gpsSignalStr"></td>
<td style="width: 53%;" i18n="gpsSignalStatusQly"></td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr>
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
<tr class="noboarder">
<td>0</td>
<td>0</td>
<td><progress value="0" max="99"></progress></td>
<td>0</td>
</tr>
</table> </table>
</div> </div>
</div> </div>