From 82f78cb8f2cd1bacbb1932739acf8542ca86960c Mon Sep 17 00:00:00 2001
From: bloqaudio <qoshea@gmail.com>
Date: Sun, 13 Sep 2026 11:12:15 -0500
Subject: [PATCH] web: render the per-port tables in physical port order

The firmware emits every per-port array in logical port order, which on a
board with a remapped port table (SWGT024: phys_to_log = {4,5,6,7,8,3,...})
is 6, 1, 2, 3, 4, 5. The old pages iterated over physical port numbers and
looked each entry up; the single-page app rendered the arrays as received,
so the ports, spanning tree, EEE and bandwidth tables and the dashboard
strip came out in logical order, and the strip put the SFP marker and the
detail view on the wrong port.

Sort every array by portNum on receipt so index i is port i+1 throughout.
---
 html/app.js | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/html/app.js b/html/app.js
index 1f6fef2c..5c9c6c33 100644
--- a/html/app.js
+++ b/html/app.js
@@ -542,8 +542,10 @@ Poller.prototype.tick=function(){
   run.then(function(){ if(self.on)self.t=setTimeout(function(){self.tick()},self.ms); });
 };
 
+function byPort(a){return a.sort(function(x,y){return x.portNum-y.portNum})}
 function pollStatus(){
   return getJSON("/status.json").then(function(s){
+    byPort(s);
     var now=Date.now();
     if(!S.n){
       S.n=s.length;
@@ -852,6 +854,7 @@ function stpPortVals(pt){
 }
 function stpLoad(){
   return getJSON("/stp.json").then(function(s){
+    s.ports.sort(function(a,b){return a.p-b.p});
     if(!stpRows)stpBuild(s.ports);
     stpCur=s;
     var en=$("stpen");
@@ -1391,7 +1394,7 @@ function eeeFlags(bits){
 function eeeLoad(){
   return getJSON("/eee.json").then(function(s){
     var tb=$("etable").tBodies[0];tb.innerHTML="";
-    s.forEach(function(p){
+    byPort(s).forEach(function(p){
       var tr=tb.insertRow();
       tr.insertCell().textContent=p.portNum+(p.isSFP?" (SFP)":"");
       if(p.isSFP){
@@ -1419,7 +1422,7 @@ tabHooks.eee={enter:function(){eeePoller.start()},leave:function(){eeePoller.sto
 function bwLoad(){
   return getJSON("/bandwidth.json").then(function(s){
     var tb=$("btable").tBodies[0];tb.innerHTML="";
-    s.forEach(function(p){
+    byPort(s).forEach(function(p){
       var n=p.portNum;
       var iOn=!!Number(p.iLimited),eOn=!!Number(p.eLimited);
       var iM=(parseInt(p.iBW,16)*16/1000),eM=(parseInt(p.eBW,16)*16/1000);