Move each camera to a separate card and show per process info

This commit is contained in:
Nick Mowen 2022-11-09 12:13:24 -07:00
parent 9c9220979e
commit 997bc0845b
2 changed files with 42 additions and 23 deletions

View File

@ -90,6 +90,7 @@ def stats_snapshot(stats_tracking: StatsTrackingTypes) -> dict[str, Any]:
for name, camera_stats in camera_metrics.items():
total_detection_fps += camera_stats["detection_fps"].value
pid = camera_stats["process"].pid if camera_stats["process"] else None
ffmpeg_pid = camera_stats["ffmpeg_pid"].value if camera_stats["ffmpeg_pid"] else None
cpid = (
camera_stats["capture_process"].pid
if camera_stats["capture_process"]
@ -102,6 +103,7 @@ def stats_snapshot(stats_tracking: StatsTrackingTypes) -> dict[str, Any]:
"detection_fps": round(camera_stats["detection_fps"].value, 2),
"pid": pid,
"capture_pid": cpid,
"ffmpeg_pid": ffmpeg_pid,
}
stats["detectors"] = {}

View File

@ -67,29 +67,46 @@ export default function Debug() {
</Table>
</div>
<Heading>
Cameras
</Heading>
<div data-testid="cameras" className="min-w-0 overflow-auto">
<Table className="w-full">
{cameraNames.map((camera, i) => (
<div className='dark:bg-gray-800 shadow-md hover:shadow-lg rounded-lg transition-shadow p-4 m-2'>
<div className='text-lg flex justify-between'>
<Link href={`/cameras/${camera}`}>{camera.replaceAll('_', ' ')}</Link>
<div className='text-sm'>
ffprobe
</div>
</div>
<div className='p-4'>
<Table className='w-full'>
<Thead>
<Tr>
<Th>camera</Th>
{cameraDataKeys.map((name) => (
<Th key={name}>{name.replace('_', ' ')}</Th>
))}
<Th>Processes</Th>
<Th>Process ID</Th>
<Th>Cpu Usage</Th>
</Tr>
</Thead>
<Tbody>
{cameraNames.map((camera, i) => (
<Tr key={i} index={i}>
<Td>
<Link href={`/cameras/${camera}`}>{camera.replaceAll('_', ' ')}</Link>
</Td>
{cameraDataKeys.map((name) => (
<Td key={`${name}-${camera}`}>{cameras[camera][name]}</Td>
))}
<Tr key='capture' index='0'>
<Td>Capture</Td>
<Td>{cameras[camera]['capture_pid']}</Td>
<Td>25%</Td>
</Tr>
<Tr key='detect' index='0'>
<Td>Detect</Td>
<Td>{cameras[camera]['pid']}</Td>
<Td>2%</Td>
</Tr>
))}
</Tbody>
</Table>
</div>
</div>
))}
</div>
<p>Debug stats update automatically every {config.mqtt.stats_interval} seconds.</p>