sjg/trx-rs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[feat](trx-frontend-http): adjust auth header and style ids

Browse Source 
Keep the top bar visible while logged out, limit access to\nthe Main tab, and leave theme controls available while the\nrig selector stays disabled.\n\nRename the internal style ids from nord/arctic and\nmonokai/lime, including a compatibility remap for saved\nsettings.\n\nCo-authored-by: Codex <codex@openai.com>

Signed-off-by: Stan Grams <sjg@haxx.space>
This commit is contained in:
Stan Grams
2026-02-28 08:53:51 +01:00
parent 4b93e8ff97
commit b27c2f8d73
3 changed files with 39 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
+32 -20
View File
@@ -82,18 +82,11 @@ function showAuthGate(allowGuest = false) {
authGate.style.flexDirection = "column";
authGate.style.justifyContent = "center";
authGate.style.alignItems = "stretch";
document.getElementById("tab-bar").style.display = "none";
const overviewStrip = document.querySelector(".overview-strip");
if (overviewStrip) {
overviewStrip.style.display = "none";
}
// Hide rig picker since no rigs are accessible without auth
const rigSwitch = document.querySelector(".header-rig-switch");
if (rigSwitch) {
rigSwitch.style.display = "none";
}
// Hide all tab panels
document.querySelectorAll(".tab-panel").forEach(panel => {
panel.style.display = "none";
@@ -104,24 +97,22 @@ function showAuthGate(allowGuest = false) {
if (guestBtn) {
guestBtn.style.display = allowGuest ? "block" : "none";
}
document.querySelectorAll(".tab-bar .tab").forEach((btn) => {
btn.classList.toggle("active", btn.dataset.tab === "main");
});
syncTopBarAccess();
}
function hideAuthGate() {
const authGate = document.getElementById("auth-gate");
authGate.style.display = "none";
document.getElementById("loading").style.display = "block";
document.getElementById("tab-bar").style.display = "";
const overviewStrip = document.querySelector(".overview-strip");
if (overviewStrip) {
overviewStrip.style.display = "";
}
// Show rig picker again now that user is authenticated
const rigSwitch = document.querySelector(".header-rig-switch");
if (rigSwitch) {
rigSwitch.style.display = "";
}
// Show Main tab by default and hide all other tabs
document.querySelectorAll(".tab-panel").forEach(panel => {
panel.style.display = "none";
@@ -139,6 +130,7 @@ function hideAuthGate() {
if (mainTabBtn) {
mainTabBtn.classList.add("active");
}
syncTopBarAccess();
}
function showAuthError(msg) {
@@ -158,6 +150,7 @@ function updateAuthUI() {
if (!authEnabled) {
if (badge) badge.style.display = "none";
if (headerAuthBtn) headerAuthBtn.style.display = "none";
syncTopBarAccess();
return;
}
@@ -175,6 +168,7 @@ function updateAuthUI() {
headerAuthBtn.style.display = "block";
}
}
syncTopBarAccess();
}
function applyAuthRestrictions() {
@@ -333,6 +327,22 @@ const headerStylePickSelect = document.getElementById("header-style-pick-select"
const rdsPsOverlay = document.getElementById("rds-ps-overlay");
let overviewPeakHoldMs = Number(loadSetting("overviewPeakHoldMs", 2000));
function syncTopBarAccess() {
const loggedOut = authEnabled && !authRole;
const tabBar = document.getElementById("tab-bar");
if (tabBar) tabBar.style.display = "";
document.querySelectorAll(".tab-bar .tab").forEach((btn) => {
const isMain = btn.dataset.tab === "main";
btn.style.display = !loggedOut || isMain ? "" : "none";
btn.disabled = false;
});
if (headerRigSwitchSelect) {
headerRigSwitchSelect.disabled = loggedOut || authRole === "rx" || lastRigIds.length === 0;
}
}
let overviewDrawPending = false;
let lastSpectrumData = null;
let lastControl;
@@ -403,7 +413,7 @@ const CANVAS_PALETTE = {
waterfallHue: [210, 35], waterfallSat: 82, waterfallLight: [92, 40], waterfallAlpha: [0.42, 0.80],
},
},
nord: {
arctic: {
dark: {
bg: "#1e2530",
spectrumLine: "#88c0d0", spectrumFill: "rgba(136,192,208,0.12)",
@@ -421,7 +431,7 @@ const CANVAS_PALETTE = {
waterfallHue: [215, 195], waterfallSat: 65, waterfallLight: [88, 45], waterfallAlpha: [0.35, 0.78],
},
},
monokai: {
lime: {
dark: {
bg: "#181815",
spectrumLine: "#a6e22e", spectrumFill: "rgba(166,226,46,0.10)",
@@ -470,8 +480,9 @@ function canvasPalette() {
}
function setStyle(style) {
const valid = ["original", "nord", "monokai", "contrast"];
const next = valid.includes(style) ? style : "original";
const remapped = style === "nord" ? "arctic" : style === "monokai" ? "lime" : style;
const valid = ["original", "arctic", "lime", "contrast"];
const next = valid.includes(remapped) ? remapped : "original";
if (next === "original") {
document.documentElement.removeAttribute("data-style");
} else {
@@ -584,7 +595,7 @@ function applyRigList(activeRigId, rigIds, displayNames) {
const aboutActive = document.getElementById("about-active-rig");
if (aboutActive) aboutActive.textContent = activeRigId;
}
const disableSwitch = lastRigIds.length === 0 || authRole === "rx";
const disableSwitch = lastRigIds.length === 0 || !authRole || authRole === "rx";
populateRigPicker(headerRigSwitchSelect, lastRigIds, activeRigId, disableSwitch);
updateRigSubtitle(activeRigId);
}
@@ -1540,7 +1551,7 @@ async function switchRigFromSelect(selectEl) {
showHint("Rig switch failed", 2000);
console.error(err);
} finally {
const disableSwitch = lastRigIds.length === 0 || authRole === "rx";
const disableSwitch = lastRigIds.length === 0 || !authRole || authRole === "rx";
selectEl.disabled = disableSwitch;
}
}
@@ -1934,6 +1945,7 @@ if (spectrumBwSetBtn) {
document.querySelector(".tab-bar").addEventListener("click", (e) => {
const btn = e.target.closest(".tab[data-tab]");
if (!btn) return;
if (authEnabled && !authRole && btn.dataset.tab !== "main") return;
document.querySelectorAll(".tab-bar .tab").forEach((t) => t.classList.remove("active"));
btn.classList.add("active");
document.querySelectorAll(".tab-panel").forEach((p) => p.style.display = "none");
src/trx-client/trx-frontend/trx-frontend-http/assets/web/index.html
+2 -2
View File
@@ -25,8 +25,8 @@
<div class="header-style-pick">
<select id="header-style-pick-select" aria-label="Select UI style">
<option value="original">Original</option>
<option value="nord">Arctic</option>
<option value="monokai">Brownie</option>
<option value="arctic">Arctic</option>
<option value="lime">Lime</option>
<option value="contrast">Contrast</option>
</select>
</div>
src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
+5 -5
View File
@@ -962,7 +962,7 @@ button:focus-visible, input:focus-visible, select:focus-visible {
}
/* ── Arctic style ─────────────────────────────────────────────────────── */
[data-style="nord"] {
[data-style="arctic"] {
--bg: #242933;
--card-bg: #2e3440;
--input-bg: #242933;
@@ -990,7 +990,7 @@ button:focus-visible, input:focus-visible, select:focus-visible {
--wavelength-fg: #7a8ea8;
--spectrum-bg: #1e2530;
}
[data-style="nord"][data-theme="light"] {
[data-style="arctic"][data-theme="light"] {
--bg: #e5e9f0;
--card-bg: #eceff4;
--input-bg: #d8dee9;
@@ -1019,8 +1019,8 @@ button:focus-visible, input:focus-visible, select:focus-visible {
--spectrum-bg: #dde1e9;
}
/* ── Brownie style ────────────────────────────────────────────────────── */
[data-style="monokai"] {
/* ── Lime style ───────────────────────────────────────────────────────── */
[data-style="lime"] {
--bg: #1c1c17;
--card-bg: #272822;
--input-bg: #1c1c17;
@@ -1048,7 +1048,7 @@ button:focus-visible, input:focus-visible, select:focus-visible {
--wavelength-fg: #9c8f78;
--spectrum-bg: #181815;
}
[data-style="monokai"][data-theme="light"] {
[data-style="lime"][data-theme="light"] {
--bg: #f5f0e4;
--card-bg: #fdf9f2;
--input-bg: #ede8d8;