Mirror/intercept
1
0
Fork 0
mirror of https://github.com/smittix/intercept.git synced 2026-04-24 14:50:00 -07:00
Code Issues Packages Projects Releases Wiki Activity

Make device detail panel static and compact

Browse Source 
- Panel is now always visible with fixed 140px height
- Shows "Select a device to view details" placeholder when empty
- Clicking a device populates the panel without layout shifts
- More compact design:
  - Smaller fonts and padding throughout
  - Combined Min/Max RSSI into single field
  - 4x2 stats grid with minimal spacing
  - Services shown inline as comma-separated text
- Panel no longer pushes proximity radar when populated

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Smittix
2026-01-21 20:08:44 +00:00
parent 201fce0125
commit 85159cbc44
3 changed files with 163 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
static/js/modes/bluetooth.js
View File

@@ -298,31 +298,25 @@ const BluetoothMode = (function() {
if (!device) return;
selectedDeviceId = deviceId;
const panel = document.getElementById('btDetailPanel');
if (!panel) return;
const placeholder = document.getElementById('btDetailPlaceholder');
const content = document.getElementById('btDetailContent');
if (!placeholder || !content) return;
const rssi = device.rssi_current;
const rssiColor = getRssiColor(rssi);
const rssiPercent = rssi != null ? Math.max(0, Math.min(100, ((rssi + 100) / 70) * 100)) : 0;
const flags = device.heuristic_flags || [];
const protocol = device.protocol || 'ble';
// Update panel elements
document.getElementById('btDetailName').textContent = device.name || formatDeviceId(device.address);
document.getElementById('btDetailAddress').textContent = device.address;
document.getElementById('btDetailAddress').style.color = '#00d4ff';
// RSSI section
// RSSI
const rssiEl = document.getElementById('btDetailRssi');
rssiEl.textContent = rssi != null ? rssi : '--';
rssiEl.style.color = rssiColor;
const rssiBar = document.getElementById('btDetailRssiBar');
rssiBar.style.width = rssiPercent + '%';
rssiBar.style.background = rssiColor;
document.getElementById('btDetailRange').textContent = (device.range_band || 'Unknown') + ' Range';
// Badges
const badgesEl = document.getElementById('btDetailBadges');
let badgesHtml = `<span class="bt-detail-badge ${protocol}">${protocol.toUpperCase()}</span>`;
@@ -333,20 +327,21 @@ const BluetoothMode = (function() {
badgesEl.innerHTML = badgesHtml;
// Stats grid
document.getElementById('btDetailMfr').textContent = device.manufacturer_name || 'Unknown';
document.getElementById('btDetailMfr').textContent = device.manufacturer_name || '--';
document.getElementById('btDetailMfrId').textContent = device.manufacturer_id != null
? '0x' + device.manufacturer_id.toString(16).toUpperCase().padStart(4, '0')
: '--';
document.getElementById('btDetailAddrType').textContent = device.address_type || 'unknown';
document.getElementById('btDetailAddrType').textContent = device.address_type || '--';
document.getElementById('btDetailSeen').textContent = (device.seen_count || 0) + '×';
document.getElementById('btDetailRange').textContent = device.range_band || '--';
const rssiMinEl = document.getElementById('btDetailRssiMin');
rssiMinEl.textContent = device.rssi_min != null ? device.rssi_min + ' dBm' : '--';
rssiMinEl.style.color = '#ef4444';
const rssiMaxEl = document.getElementById('btDetailRssiMax');
rssiMaxEl.textContent = device.rssi_max != null ? device.rssi_max + ' dBm' : '--';
rssiMaxEl.style.color = '#22c55e';
// Min/Max combined
const minMax = [];
if (device.rssi_min != null) minMax.push(device.rssi_min);
if (device.rssi_max != null) minMax.push(device.rssi_max);
document.getElementById('btDetailRssiRange').textContent = minMax.length === 2
? minMax[0] + '/' + minMax[1]
: '--';
document.getElementById('btDetailFirstSeen').textContent = device.first_seen
? new Date(device.first_seen).toLocaleTimeString()
@@ -360,15 +355,14 @@ const BluetoothMode = (function() {
const servicesList = document.getElementById('btDetailServicesList');
if (device.service_uuids && device.service_uuids.length > 0) {
servicesContainer.style.display = 'block';
servicesList.innerHTML = device.service_uuids.map(uuid =>
`<span class="bt-detail-service">${uuid}</span>`
).join('');
servicesList.textContent = device.service_uuids.join(', ');
} else {
servicesContainer.style.display = 'none';
}
// Show panel
panel.style.display = 'block';
// Show content, hide placeholder
placeholder.style.display = 'none';
content.style.display = 'block';
// Highlight selected device in list
highlightSelectedDevice(deviceId);
@@ -379,8 +373,11 @@ const BluetoothMode = (function() {
*/
function clearSelection() {
selectedDeviceId = null;
const panel = document.getElementById('btDetailPanel');
if (panel) panel.style.display = 'none';
const placeholder = document.getElementById('btDetailPlaceholder');
const content = document.getElementById('btDetailContent');
if (placeholder) placeholder.style.display = 'flex';
if (content) content.style.display = 'none';
// Remove highlight from device list
if (deviceContainer) {