Mirror/intercept
1
0
Fork 0
mirror of https://github.com/smittix/intercept.git synced 2026-07-08 09:38:12 -07:00
Code Issues Packages Projects Releases Wiki Activity

Replace modal with inline device detail panel above proximity radar

Browse Source 
- Added detail panel that appears above the radar when a device is clicked
- Shows comprehensive device information:
  - Large RSSI display with visual bar and range indicator
  - Protocol, status, and flag badges
  - 8-column stats grid: Manufacturer, Mfr ID, Address Type, Seen count,
    Min/Max RSSI, First/Last seen timestamps
  - Service UUIDs list (when available)
  - Copy Address button
- Selected device is highlighted in the device list
- Close button (×) to dismiss the panel
- Cyan accent border and gradient header for visual distinction

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Smittix
2026-01-21 20:04:49 +00:00
parent 6e1ebfcc85
commit b1ea96f906
3 changed files with 405 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/index.html
+64
View File
@@ -707,6 +707,70 @@
<div class="bt-layout-container" id="btLayoutContainer" style="display: none;">
<!-- Left: Bluetooth Visualizations -->
<div class="bt-visuals-column" id="btVisuals">
<!-- Device Detail Panel (shown when device selected) -->
<div class="bt-detail-panel" id="btDetailPanel" style="display: none;">
<div class="bt-detail-header">
<div class="bt-detail-title-row">
<h5 id="btDetailName">Device Name</h5>
<button class="bt-detail-close" onclick="BluetoothMode.clearSelection()" title="Close">&times;</button>
</div>
<div class="bt-detail-address" id="btDetailAddress">00:00:00:00:00:00</div>
</div>
<div class="bt-detail-body">
<div class="bt-detail-rssi-section">
<div class="bt-detail-rssi-main">
<span class="bt-detail-rssi-value" id="btDetailRssi">--</span>
<span class="bt-detail-rssi-unit">dBm</span>
</div>
<div class="bt-detail-rssi-bar-container">
<div class="bt-detail-rssi-bar" id="btDetailRssiBar"></div>
</div>
<div class="bt-detail-rssi-range" id="btDetailRange">Unknown Range</div>
</div>
<div class="bt-detail-badges" id="btDetailBadges"></div>
<div class="bt-detail-grid">
<div class="bt-detail-stat">
<span class="bt-detail-stat-label">Manufacturer</span>
<span class="bt-detail-stat-value" id="btDetailMfr">Unknown</span>
</div>
<div class="bt-detail-stat">
<span class="bt-detail-stat-label">Mfr ID</span>
<span class="bt-detail-stat-value" id="btDetailMfrId">--</span>
</div>
<div class="bt-detail-stat">
<span class="bt-detail-stat-label">Type</span>
<span class="bt-detail-stat-value" id="btDetailAddrType">--</span>
</div>
<div class="bt-detail-stat">
<span class="bt-detail-stat-label">Seen</span>
<span class="bt-detail-stat-value" id="btDetailSeen">0×</span>
</div>
<div class="bt-detail-stat">
<span class="bt-detail-stat-label">Min RSSI</span>
<span class="bt-detail-stat-value" id="btDetailRssiMin">--</span>
</div>
<div class="bt-detail-stat">
<span class="bt-detail-stat-label">Max RSSI</span>
<span class="bt-detail-stat-value" id="btDetailRssiMax">--</span>
</div>
<div class="bt-detail-stat">
<span class="bt-detail-stat-label">First Seen</span>
<span class="bt-detail-stat-value" id="btDetailFirstSeen">--</span>
</div>
<div class="bt-detail-stat">
<span class="bt-detail-stat-label">Last Seen</span>
<span class="bt-detail-stat-value" id="btDetailLastSeen">--</span>
</div>
</div>
<div class="bt-detail-services" id="btDetailServices" style="display: none;">
<span class="bt-detail-stat-label">Services</span>
<div class="bt-detail-services-list" id="btDetailServicesList"></div>
</div>
<div class="bt-detail-actions">
<button class="bt-detail-btn" onclick="BluetoothMode.copyAddress()">Copy Address</button>
</div>
</div>
</div>
<!-- Proximity Radar -->
<div class="wifi-visual-panel bt-radar-panel">
<h5>Proximity Radar</h5>