From 4de1bd49d82f7d3c26736b9497dcb84f95440585 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=90=D0=BD=D1=82=D0=BE=D0=BD=20=D0=A2=D1=80=D0=BE=D1=88?=
 =?UTF-8?q?=D0=B8=D0=BD?= <i@atroshin.ru>
Date: Mon, 10 Aug 2026 20:02:54 +0300
Subject: [PATCH] Proactive log: expandable hex dump + decoded PLI qualifier
 names

---
 index.html | 36 ++++++++++++++++++++++++++++++++++--
 style.css  | 25 ++++++++-----------------
 2 files changed, 42 insertions(+), 19 deletions(-)

diff --git a/index.html b/index.html
index ab8ae5b..8aa46ae 100644
--- a/index.html
+++ b/index.html
@@ -3919,6 +3919,14 @@ const CMD_NAMES = {
     '15': 'LAUNCH BROWSER', '70': 'ACTIVATE',
 };
 
+const CMD_QUALIFIER_SHORT = {
+    '26': {0x00:'Loc', 0x01:'IMEI', 0x02:'NMR', 0x03:'Time', 0x04:'Lang', 0x05:'TA',
+           0x06:'AccTech', 0x08:'IMEISV', 0x09:'Search', 0x0A:'Batt', 0x0C:'WSID',
+           0x0D:'BCInfo', 0x0E:'MultiAT', 0x0F:'MultiLoc', 0x10:'MultiNMR',
+           0x11:'CSG', 0x12:'HNB-IP', 0x13:'HNB-Macro', 0x14:'WLAN', 0x15:'Slices',
+           0x16:'CAG', 0x17:'RejSlice'},
+};
+
 async function pysimProactiveLogRender() {
     const el = document.getElementById('pysim-proactive-log');
     el.innerHTML = '<span class="text-gray-400">' + t('Loading...') + '</span>';
@@ -3929,13 +3937,24 @@ async function pysimProactiveLogRender() {
             return;
         }
         let html = '';
-        log.forEach(e => {
+        log.forEach((e, i) => {
             const name = CMD_NAMES[e.type_hex] || ('Cmd 0x' + e.type_hex.toUpperCase());
-            html += '<div class="flex items-center gap-2 py-0.5">'
+            let qual = '';
+            if (e.qualifier) {
+                const qs = CMD_QUALIFIER_SHORT[e.type_hex];
+                if (qs) qual = ' [' + (qs[parseInt(e.qualifier,16)] || '0x'+e.qualifier.toUpperCase()) + ']';
+                else qual = ' [0x' + e.qualifier.toUpperCase() + ']';
+            }
+            html += '<div data-plog-row="' + i + '">'
+                + '<div class="flex items-center gap-2 py-0.5">'
+                + (e.raw ? '<span class="cursor-pointer select-none text-gray-400 hover:text-gray-600 dark:hover:text-gray-300" onclick="pysimPlogToggle(' + i + ')" id="plog-tog-' + i + '">▶</span>' : '<span class="w-3"></span>')
                 + '<span class="w-12 text-right text-gray-400">' + e.elapsed + 's</span>'
                 + '<span class="font-mono text-gray-400">0x' + e.type_hex.toUpperCase() + '</span>'
                 + '<span class="truncate">' + esc(name) + '</span>'
+                + (qual ? '<span class="text-[10px] text-gray-500 dark:text-slate-400">' + esc(qual) + '</span>' : '')
                 + '<span class="ml-auto text-gray-400">' + e.bytes + ' bytes</span>'
+                + '</div>'
+                + (e.raw ? '<div class="pli-decode-panel hidden ml-4 pl-2 border-l border-gray-300 dark:border-slate-600" data-plog-data="' + i + '"><div class="text-[10px] font-mono text-gray-500 dark:text-slate-400 max-h-20 overflow-auto word-break-all whitespace-pre-wrap">' + esc(e.raw) + '</div></div>' : '')
                 + '</div>';
         });
         el.innerHTML = html;
@@ -3944,6 +3963,19 @@ async function pysimProactiveLogRender() {
     }
 }
 
+function pysimPlogToggle(idx) {
+	const panel = document.querySelector('[data-plog-data="' + idx + '"]');
+	const tog = document.getElementById('plog-tog-' + idx);
+	if (!panel || !tog) return;
+	if (panel.classList.contains('hidden')) {
+		panel.classList.remove('hidden');
+		tog.textContent = '▼';
+	} else {
+		panel.classList.add('hidden');
+		tog.textContent = '▶';
+	}
+}
+
 // ===== PLI data dictionary =====
 function decPlmn(hex3) {
 	const h = hex3.replace(/\s/g, '').slice(0, 6);
diff --git a/style.css b/style.css
index b7f52bc..2bf1713 100644
--- a/style.css
+++ b/style.css
@@ -688,6 +688,10 @@ video {
   height: 4rem;
 }
 
+.max-h-20 {
+  max-height: 5rem;
+}
+
 .max-h-32 {
   max-height: 8rem;
 }
@@ -728,10 +732,6 @@ video {
   width: 4rem;
 }
 
-.w-2\/3 {
-  width: 66.666667%;
-}
-
 .w-20 {
   width: 5rem;
 }
@@ -744,6 +744,10 @@ video {
   width: 7rem;
 }
 
+.w-3 {
+  width: 0.75rem;
+}
+
 .w-32 {
   width: 8rem;
 }
@@ -756,10 +760,6 @@ video {
   width: 1rem;
 }
 
-.w-40 {
-  width: 10rem;
-}
-
 .w-48 {
   width: 12rem;
 }
@@ -1068,11 +1068,6 @@ video {
   padding: 1.5rem;
 }
 
-.px-0\.5 {
-  padding-left: 0.125rem;
-  padding-right: 0.125rem;
-}
-
 .px-1 {
   padding-left: 0.25rem;
   padding-right: 0.25rem;
@@ -1219,10 +1214,6 @@ video {
   font-style: italic;
 }
 
-.leading-none {
-  line-height: 1;
-}
-
 .leading-relaxed {
   line-height: 1.625;
 }