Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

GPS tab: New design for gps Status / Quality #3566

Merged
merged 10 commits into from Sep 9, 2023
Merged

GPS tab: New design for gps Status / Quality #3566

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
953e922
small fixes
HThuren Sep 4, 2023
29c84bf
Ajust Colours when translated
HThuren Sep 5, 2023
d31eee6
new design
HThuren Sep 7, 2023
2dac83a
new design
HThuren Sep 9, 2023
fcaea74
new design
HThuren Sep 9, 2023
89798f4
new design
HThuren Sep 9, 2023
96df8dc
new design
HThuren Sep 9, 2023
caa7583
new design
HThuren Sep 9, 2023
8b4b6de
new design
HThuren Sep 9, 2023
3847013
Merge branch 'master' into gpsAjustment
HThuren Sep 9, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
10 changes: 8 additions & 2 deletions src/css/main.less
View file
Open in desktop
Expand Up @@ -1725,13 +1725,19 @@ dialog {
}
}
.colorToggle {
background-color: #e60000;
background-color: #ff0000;
padding: 2px 5px;
border-radius: 3px;
color: #fff;
font-size: 10px;
&.search {
background-color: #ffcc3f;
}
&.almostReady {
background-color: #ffa500;
}
&.ready {
background-color: #56ac1d;
background-color: #008000;
}
}
.buildInfoBtn {
Expand Down
52 changes: 36 additions & 16 deletions src/js/tabs/gps.js
View file
Open in desktop
@@ -1,10 +1,11 @@
import { i18n } from "../localization";
import semver from 'semver';
import { API_VERSION_1_43 } from '../data_storage';
import { API_VERSION_1_43, API_VERSION_1_46 } from '../data_storage';
import GUI, { TABS } from '../gui';
import FC from '../fc';
import MSP from "../msp";
import MSPCodes from "../msp/MSPCodes";
import $ from 'jquery';
import { have_sensor } from "../sensor_helpers";
import { mspHelper } from '../msp/MSPHelper';
import { updateTabList } from '../utils/updateTabList';
Expand Down Expand Up @@ -132,7 +133,10 @@ gps.initialize = async function (callback) {

}).val(FC.GPS_CONFIG.provider).change();

gpsAutoBaudElement.prop('checked', FC.GPS_CONFIG.auto_baud === 1);
// auto_baud is no longer used in API 1.46
if (semver.lt(FC.CONFIG.apiVersion, API_VERSION_1_46)) {
gpsAutoBaudElement.prop('checked', FC.GPS_CONFIG.auto_baud === 1);
}

gpsAutoConfigElement.on('change', function () {
const checked = $(this).is(":checked");
Expand All @@ -146,7 +150,7 @@ gps.initialize = async function (callback) {
const enableSbasVisible = checked && ubloxSelected;
gpsUbloxSbasGroup.toggle(enableSbasVisible);

gpsAutoBaudGroup.toggle(ubloxSelected || mspSelected);
gpsAutoBaudGroup.toggle((ubloxSelected || mspSelected) && semver.lt(FC.CONFIG.apiVersion, API_VERSION_1_46));
gpsAutoConfigGroup.toggle(ubloxSelected || mspSelected);

}).prop('checked', FC.GPS_CONFIG.auto_config === 1).trigger('change');
Expand Down Expand Up @@ -181,8 +185,9 @@ gps.initialize = async function (callback) {
const lat = FC.GPS_DATA.lat / 10000000;
const lon = FC.GPS_DATA.lon / 10000000;
const url = `https://maps.google.com/?q=${lat},${lon}`;
const heading = hasMag ? Math.atan2(FC.SENSOR_DATA.magnetometer[1], FC.SENSOR_DATA.magnetometer[0]) : undefined;
const headingDeg = heading === undefined ? 0 : heading * 180 / Math.PI;
const magHeading = hasMag ? Math.atan2(FC.SENSOR_DATA.magnetometer[1], FC.SENSOR_DATA.magnetometer[0]) : undefined;
const magHeadingDeg = magHeading === undefined ? 0 : magHeading * 180 / Math.PI;
const gpsHeading = FC.GPS_DATA.ground_course / 100;
const gnssArray = ['GPS', 'SBAS', 'Galileo', 'BeiDou', 'IMES', 'QZSS', 'Glonass'];
const qualityArray = ['gnssQualityNoSignal', 'gnssQualitySearching', 'gnssQualityAcquired', 'gnssQualityUnusable', 'gnssQualityLocked',
'gnssQualityFullyLocked', 'gnssQualityFullyLocked', 'gnssQualityFullyLocked'];
Expand All @@ -195,8 +200,8 @@ gps.initialize = async function (callback) {

const gspUnitText = i18n.getMessage('gpsPositionUnit');
$('.GPS_info td.alt').text(`${alt} m`);
$('.GPS_info td.latLon a').prop('href', url).text(`${lat.toFixed(4)} deg / ${lon.toFixed(4)} deg`);
$('.GPS_info td.heading').text(`${headingDeg.toFixed(4)} ${gspUnitText}`);
$('.GPS_info td.latLon a').prop('href', url).text(`${lat.toFixed(4)} / ${lon.toFixed(4)} ${gspUnitText}`);
$('.GPS_info td.heading').text(`${magHeadingDeg.toFixed(4)} / ${gpsHeading.toFixed(4)} ${gspUnitText}`);
$('.GPS_info td.speed').text(`${FC.GPS_DATA.speed} cm/s`);
$('.GPS_info td.sats').text(FC.GPS_DATA.numSat);
$('.GPS_info td.distToHome').text(`${FC.GPS_DATA.distanceToHome} m`);
Expand All @@ -221,7 +226,7 @@ gps.initialize = async function (callback) {
<tr>
<td>-</td>
<td>${FC.GPS_DATA.svid[i]}</td>
<td><progress value="${FC.GPS_DATA.cno[i]}" max="99"></progress></td>
<td><meter value="${FC.GPS_DATA.cno[i]}" max="55"></meter></td>
<td>${FC.GPS_DATA.quality[i]}</td>
</tr>
`);
Expand All @@ -232,7 +237,7 @@ gps.initialize = async function (callback) {
<tr>
<td>-</td>
<td>-</td>
<td><progress value="0" max="99"></progress></td>
<td><meter value="0" max="55"></meter></td>
<td> </td>
</tr>
`);
Expand All @@ -253,30 +258,45 @@ gps.initialize = async function (callback) {

if (FC.GPS_DATA.chn[i] >= 7) {
rowContent += '<td>-</td>';
rowContent += `<td><progress value="${0}" max="99"></progress></td>`;
rowContent += `<td><meter value="${0}" max="55"></meter></td>`;
rowContent += `<td> </td>`;
} else {
rowContent += `<td>${FC.GPS_DATA.svid[i]}</td>`;
rowContent += `<td><progress value="${FC.GPS_DATA.cno[i]}" max="99"></progress></td>`;
rowContent += `<td><meter value="${FC.GPS_DATA.cno[i]}" max="55"></meter></td>`;

let quality = i18n.getMessage(qualityArray[FC.GPS_DATA.quality[i] & 0x7]);
let used = i18n.getMessage(usedArray[(FC.GPS_DATA.quality[i] & 0x8) >> 3]);
let healthy = i18n.getMessage(healthyArray[(FC.GPS_DATA.quality[i] & 0x30) >> 4]);

// Add color to the text
if (quality.startsWith('fully locked')) {
// yellow for searching and orange for locked, green only when fully locked, used and healthy
// 1st column: unusable = red, searching = yellow, locked = orange and fully locked = green
// 2nd column: unused = red, used = green
// 3d column: non healthy = red, healthy = green

// || quality.startsWith(i18n.getMessage('gnssQualityLocked'))
HThuren marked this conversation as resolved.
Show resolved Hide resolved

if (quality.startsWith(i18n.getMessage('gnssQualityFullyLocked'))) {
quality = `<span class="colorToggle ready">${quality}</span>`;
} else {
quality = `<span class="colorToggle">${quality}</span>`;
if (quality.startsWith(i18n.getMessage('gnssQualityLocked'))) {
HThuren marked this conversation as resolved.
Show resolved Hide resolved
quality = `<span class="colorToggle almostReady">${quality}</span>`;
} else {
if (quality.startsWith(i18n.getMessage('gnssQualitySearching'))) {
quality = `<span class="colorToggle search">${quality}</span>`;
} else {
quality = `<span class="colorToggle">${quality}</span>`;
}
}
}

if (used.startsWith('used')) {
if (used.startsWith(i18n.getMessage('gnssUsedUsed'))) {
used = `<span class="colorToggle ready">${used}</span>`;
} else {
used = `<span class="colorToggle">${used}</span>`;
}

if (healthy.startsWith('healthy')) {
if (healthy.startsWith(i18n.getMessage('gnssHealthyHealthy'))) {
healthy = `<span class="colorToggle ready">${healthy}</span>`;
} else {
healthy = `<span class="colorToggle">${healthy}</span>`;
Expand All @@ -292,7 +312,7 @@ gps.initialize = async function (callback) {
action: 'center',
lat: lat,
lon: lon,
heading: heading,
heading: magHeading,
};

frame = document.getElementById('map');
Expand Down
2 changes: 1 addition & 1 deletion src/js/tabs/setup.js
View file
Open in desktop
Expand Up @@ -434,7 +434,7 @@ setup.initialize = function (callback) {
const lon = FC.GPS_DATA.lon / 10000000;
const url = `https://maps.google.com/?q=${lat},${lon}`;
const gpsUnitText = i18n.getMessage('gpsPositionUnit');
$('.GPS_info td.latLon a').prop('href', url).text(`${lat.toFixed(4)} ${gpsUnitText} / ${lon.toFixed(4)} ${gpsUnitText}`);
$('.GPS_info td.latLon a').prop('href', url).text(`${lat.toFixed(4)} / ${lon.toFixed(4)} ${gpsUnitText}`);
}

function get_fast_data() {
Expand Down