github/Bose-SoundTouch
1
0
Fork 0
mirror of https://github.com/gesellix/Bose-SoundTouch.git synced 2026-08-19 09:06:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(web): pair Current/Planned diffs per axis instead of mixing them

Browse Source 
With XML+resolv selected together, the bottom panes rendered as
"Current XML | Planned XML | Planned resolv hook" plus a separate
full-width "Current /etc/resolv.conf" block above — three panes plus
a hanger above, each pair scattered.

Restructured into two side-by-side .diff-container rows that each
pair their own Current/Planned columns:

  - #xml-diff-row    — Current Config (on Speaker)   | Planned Config (AfterTouch)
  - #resolv-diff-row — Current /etc/resolv.conf      | Planned /etc/resolv.conf Hook

current-resolv-pane moved out of its standalone wrapper into the
resolv row. The deprecated #planned-hosts-pane is removed entirely
(hosts is no longer offered as a method, per the earlier UI cleanup).

onCustomizeChange now toggles the row IDs instead of per-pane IDs,
and uses display:"" rather than display:"block" so the .diff-container
flex layout isn't accidentally overridden.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Tobias Gesellchen
2026-05-11 00:37:11 +02:00
co-authored by Claude Opus 4.7
parent 12165ba58a
commit 967d516d4d
2 changed files with 20 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pkg/service/handlers/web/index.html
+12 -34
View File
@@ -968,15 +968,6 @@
</div>
</div>
<div
id="current-resolv-pane"
style="display: none; margin-bottom: 20px"
>
<span class="config-header"
>Current /etc/resolv.conf</span
>
<pre id="current-resolv-content"></pre>
</div>
<div
id="telnet-method-pane"
@@ -1056,7 +1047,9 @@
></div>
</div>
<div class="diff-container">
<!-- XML diff pair: Current Config | Planned Config. Shown
when URL flip = xml in the Customize form. -->
<div class="diff-container" id="xml-diff-row" style="display: none">
<div id="xml-diff-pane" class="diff-pane">
<span class="config-header"
>Current Config (on Speaker)</span
@@ -1082,33 +1075,18 @@
<a href="https://github.com/gesellix/bose-soundtouch/blob/main/docs/guides/TROUBLESHOOTING.md#hostname-resolution" target="_blank" style="color: #856404;">Learn more →</a>
</div>
</div>
<div
id="planned-hosts-pane"
class="diff-pane"
style="display: none"
>
</div>
<!-- Resolv diff pair: Current /etc/resolv.conf | Planned hook.
Shown when DNS = resolv in the Customize form. -->
<div class="diff-container" id="resolv-diff-row" style="display: none; margin-top: 12px">
<div id="current-resolv-pane" class="diff-pane">
<span class="config-header"
>Planned /etc/hosts Entries</span
>Current /etc/resolv.conf</span
>
<pre id="planned-hosts"></pre>
<div
style="
margin-top: 10px;
font-size: 0.9em;
color: #666;
"
>
<strong>Note:</strong> This method also injects
the AfterTouch Local Root CA into
<code>/etc/pki/tls/certs/ca-bundle.crt</code> to
enable secure HTTPS communication.
</div>
<pre id="current-resolv-content"></pre>
</div>
<div
id="planned-resolv-pane"
class="diff-pane"
style="display: none"
>
<div id="planned-resolv-pane" class="diff-pane">
<span class="config-header"
>Planned /etc/resolv.conf Hook</span
>
pkg/service/handlers/web/js/script.js
+8 -9
View File
@@ -1811,7 +1811,6 @@ async function showSummary(deviceId) {
currentConfigElem.style.color = summary.ssh_success ? "black" : "red";
document.getElementById("planned-config").innerText = summary.planned_config;
document.getElementById("planned-hosts").innerText = summary.planned_hosts || "";
document.getElementById("planned-resolv").innerText = summary.planned_resolv || "";
const resolveErrEl = document.getElementById("resolve-ip-error");
@@ -3143,19 +3142,19 @@ function onCustomizeChange() {
const dns = (document.querySelector('input[name="customize-dns"]:checked') || {}).value || "none";
const caInstall = !!(document.getElementById("customize-ca-install") || {}).checked;
// Visibility of the legacy preview/test panes inside Customize.
// Visibility of the diff pairs and per-method panes. Each diff
// pair is its own .diff-container row so the Current/Planned
// columns line up side-by-side per axis instead of mixing into
// a single 3+ column layout.
const show = (id, on) => {
const el = document.getElementById(id);
if (el) el.style.display = on ? "block" : "none";
if (el) el.style.display = on ? "" : "none";
};
show("xml-diff-pane", flip === "xml");
show("planned-xml-pane", flip === "xml");
show("xml-diff-row", flip === "xml");
show("resolv-diff-row", dns === "resolv");
show("telnet-method-pane", flip === "telnet");
show("planned-resolv-pane", dns === "resolv");
show("planned-hosts-pane", false);
show("current-resolv-pane", dns === "resolv");
show("hosts-redirection-test", false);
show("dns-redirection-test", dns === "resolv");
show("hosts-redirection-test", false);
// Validate the combination and toggle the Apply button.
const errors = [];