80 lines
3.7 KiB
Markdown
80 lines
3.7 KiB
Markdown
|
|
# Wide Grid Layout Improvements
|
||
|
|
|
||
|
|
## Enhanced Column Specifications
|
||
|
|
|
||
|
|
The grid view has been significantly widened to ensure proper column alignment and readability:
|
||
|
|
|
||
|
|
### Column Width Changes
|
||
|
|
|
||
|
|
| Column | Old Width | New Width | Alignment | Description |
|
||
|
|
|--------|-----------|-----------|-----------|-------------|
|
||
|
|
| # | 2 chars | 3 chars | Right | Flow number |
|
||
|
|
| Source | 20 chars | 24 chars | Left | IP:port source endpoint |
|
||
|
|
| Proto | 6 chars | 8 chars | Left | Transport protocol (UDP, TCP, etc.) |
|
||
|
|
| Destination | 20 chars | 24 chars | Left | IP:port destination endpoint |
|
||
|
|
| Extended | 10 chars | 12 chars | Left | Extended protocol (CH10, PTP, etc.) |
|
||
|
|
| Frame Type | 12 chars | 15 chars | Left | Specific frame type |
|
||
|
|
| Pkts | 6 chars | 8 chars | Right | Packet count |
|
||
|
|
| Volume | 8 chars | 10 chars | Right | Data volume with units |
|
||
|
|
| Timing | 8 chars | 10 chars | Right | Inter-arrival timing |
|
||
|
|
| Quality | 8 chars | 10 chars | Right | Quality percentage/status |
|
||
|
|
|
||
|
|
### Total Width Calculation
|
||
|
|
|
||
|
|
- **Previous total**: ~93 characters
|
||
|
|
- **New total**: ~124 characters
|
||
|
|
- **Width increase**: ~33% wider for better readability
|
||
|
|
|
||
|
|
## Alignment Improvements
|
||
|
|
|
||
|
|
### Source and Destination Fields
|
||
|
|
- Increased from 20 to 24 characters
|
||
|
|
- Supports longer IP addresses and port numbers
|
||
|
|
- Truncation threshold increased from 18 to 22 characters
|
||
|
|
- Better accommodation for IPv4 addresses with high port numbers
|
||
|
|
|
||
|
|
### Right-Aligned Numeric Columns
|
||
|
|
- All numeric columns now have 2 extra characters of width
|
||
|
|
- Ensures proper right-edge alignment for:
|
||
|
|
- Packet counts (up to 99,999,999)
|
||
|
|
- Volume with units (up to 999.9MB)
|
||
|
|
- Timing values (up to 99.9s)
|
||
|
|
- Quality percentages (up to 100.0%)
|
||
|
|
|
||
|
|
### Visual Hierarchy
|
||
|
|
- Sub-rows now use 4-character indent to match wider flow number column
|
||
|
|
- Perfect alignment maintained between main flows and sub-rows
|
||
|
|
- All columns line up precisely regardless of data content
|
||
|
|
|
||
|
|
## Layout Example
|
||
|
|
|
||
|
|
```
|
||
|
|
# Source Proto Destination Extended Frame Type Pkts Volume Timing Quality
|
||
|
|
1 192.168.4.89:1024 UDP 239.1.2.10:8080 3 types Mixed 1452 1.9MB 77.8ms Enhanced
|
||
|
|
CH10 CH10-Data 1110 1.44MB 102ms 76.4%
|
||
|
|
CH10 TMATS 114 148KB 990ms 7.8%
|
||
|
|
UDP 228 296KB 493ms 15.7%
|
||
|
|
```
|
||
|
|
|
||
|
|
## Technical Changes
|
||
|
|
|
||
|
|
### Formatting Functions Updated
|
||
|
|
1. **`_format_flow_summary_line()`**: Updated to use new column widths
|
||
|
|
2. **`_format_protocol_frame_line()`**: Updated to match main flow alignment
|
||
|
|
3. **Header formatting**: Expanded to accommodate wider columns
|
||
|
|
4. **Truncation logic**: Removed `[:width-8]` constraints that were cutting off data
|
||
|
|
|
||
|
|
### IP Address Handling
|
||
|
|
- Source/Destination truncation increased from 10 to 14 characters before ellipsis
|
||
|
|
- Better support for longer IP addresses and port combinations
|
||
|
|
- Maintains readability while showing more endpoint information
|
||
|
|
|
||
|
|
## Benefits
|
||
|
|
|
||
|
|
1. **Perfect Column Alignment**: All numeric columns now line up properly on their right edges
|
||
|
|
2. **No Data Truncation**: Removed width constraints that were cutting off information
|
||
|
|
3. **Better Readability**: Increased spacing makes complex flow data easier to scan
|
||
|
|
4. **Professional Appearance**: Wider grid looks more polished and organized
|
||
|
|
5. **Future-Proof**: Accommodates longer protocol names and extended data
|
||
|
|
|
||
|
|
The wide grid layout ensures that complex telemetry flow analysis is presented in a clear, professional format that makes the hierarchical protocol breakdown easy to understand at a glance.
|