feat(recordings): enhance recording management with improved error handling, finalize recording logic, and add motion notification support

This commit is contained in:
2026-02-03 17:45:00 +00:00
parent ef74b5ca19
commit 23db01dfc8
4 changed files with 442 additions and 39 deletions

View File

@@ -208,17 +208,6 @@
<!-- CLIENT DASHBOARD -->
<section id="screen-home-client" class="hidden space-y-5">
<div class="relative overflow-hidden rounded-2xl bg-gray-900 border border-white/5 aspect-video">
<video id="clientStreamVideo" class="absolute inset-0 w-full h-full object-cover hidden" autoplay playsinline></video>
<img id="clientStreamImage" class="absolute inset-0 w-full h-full object-cover hidden" alt="Live stream preview" />
<div id="clientStreamPlaceholder" class="absolute inset-0 flex flex-col items-center justify-center gap-2 text-gray-500">
<svg xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-gray-700" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z" />
</svg>
<p class="text-xs">No active live stream</p>
</div>
</div>
<!-- Quick Actions -->
<div class="flex gap-2 overflow-x-auto pb-1 scrollbar-hide">
<button id="linkCameraBtn" class="btn btn-sm btn-outline border-white/10 text-gray-300 gap-2 shrink-0">
@@ -233,7 +222,7 @@
<!-- Live Feeds Section -->
<div class="space-y-3">
<h3 class="text-xs font-bold text-gray-500 uppercase tracking-wider pl-1">Linked Cameras</h3>
<div id="linkedCamerasList" class="space-y-3">
<div id="linkedCamerasList" class="flex gap-3 overflow-x-auto pb-2 scrollbar-hide">
<!-- Populated by JS -->
<div class="text-center py-8 bg-gray-900/30 rounded-xl border border-dashed border-gray-800">
<p class="text-gray-600 text-xs">No cameras linked yet</p>
@@ -309,5 +298,15 @@
<script src="/socket.io/socket.io.js"></script>
<script src="/sim/mobile-sim.js" defer></script>
<div id="recordingModal" class="fixed inset-0 bg-black/70 backdrop-blur-sm z-50 hidden items-center justify-center p-4">
<div class="w-full max-w-lg bg-gray-900 border border-white/10 rounded-2xl p-4 space-y-3 shadow-2xl">
<div class="flex items-center justify-between">
<h3 id="recordingModalTitle" class="text-sm font-semibold text-white">Recording Playback</h3>
<button id="recordingModalCloseBtn" class="btn btn-xs btn-ghost text-gray-400">Close</button>
</div>
<video id="recordingModalVideo" class="w-full rounded-lg bg-black max-h-[60vh]" controls playsinline></video>
</div>
</div>
</body>
</html>