From d2779242efe9e3b2d4579ada8ef6e1441f5d1592 Mon Sep 17 00:00:00 2001
From: Mark Haslinghuis <mark@numloq.nl>
Date: Fri, 8 Nov 2024 12:29:56 +0100
Subject: [PATCH] Fix gps color (#4241)

* Fix gps color

* Refactor and ease usedColor

* [chore]Refactor lexical scoping
---
 src/js/tabs/gps.js | 33 ++++++++++-----------------------
 1 file changed, 10 insertions(+), 23 deletions(-)

diff --git a/src/js/tabs/gps.js b/src/js/tabs/gps.js
index 3a56c6b677..240832ed6e 100644
--- a/src/js/tabs/gps.js
+++ b/src/js/tabs/gps.js
@@ -265,31 +265,18 @@ gps.initialize = async function (callback) {
                         rowContent += `<td>${FC.GPS_DATA.svid[i]}</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 usedColor = '';
+                        const quality = i18n.getMessage(qualityArray[FC.GPS_DATA.quality[i] & 0x7]);
+                        const used = i18n.getMessage(usedArray[(FC.GPS_DATA.quality[i] & 0x8) >> 3]);
 
                         // Add color to the text
-                        // 2nd column: no signal = red, unusable = red, searching = red, locked = yellow and fully locked = green
-                        if (quality.startsWith(i18n.getMessage('gnssQualityFullyLocked'))) {
-                            usedColor = 'locked';
-                            quality = `<span class="colorToggle ready">${quality}</span>`;
-                        } else if (quality.startsWith(i18n.getMessage('gnssQualityLocked'))) {
-                            usedColor = 'notReady';
-                            quality = `<span class="colorToggle locked">${quality}</span>`;
-                        } else {
-                            quality = `<span class="colorToggle">${quality}</span>`;
-                        }
-
-                        // 1st column: unused = red, used = green
-                        if (used.startsWith(i18n.getMessage('gnssUsedUsed'))) {
-                            used = `<span class="colorToggle ready">${used}</span>`;
-                        } else {
-                            used = `<span class="colorToggle ${usedColor}">${used}</span>`;
-                        }
-
-                        rowContent += `<td style="text-align: left;  width: 17%;">${used}</td>
-                                       <td style="text-align: left;  width: 33%;">${quality}</td>`;
+                        const qualityColor = quality.startsWith(i18n.getMessage('gnssQualityFullyLocked')) ? 'ready' : quality.startsWith(i18n.getMessage('gnssQualityLocked')) ? 'locked' : 'low';
+                        const qualityHtml = `<span class="colorToggle ${qualityColor}">${quality}</span>`;
+
+                        const usedColor = used.startsWith(i18n.getMessage('gnssUsedUsed')) ? 'ready' : 'low';
+                        const usedHtml = `<span class="colorToggle ${usedColor}">${used}</span>`;
+
+                        rowContent += `<td style="text-align: left;  width: 17%;">${usedHtml}</td>
+                                       <td style="text-align: left;  width: 33%;">${qualityHtml}</td>`;
                     }
                     eSsTable.append(`<tr>${rowContent}</tr>`);
                 }