Add zoom mode functionality and refactor video feed hooks

- Implemented zoom mode in RegionSelector for digital zooming.
- Updated VideoFeedGridPainter to handle zoom interactions.
- Refactored useGetVideoFeed to support target detection and video feed queries based on mode.
- Enhanced useCreateVideoSnapshot to manage snapshots during zoom mode.
This commit is contained in:
2025-12-09 12:39:03 +00:00
parent fa33b012cc
commit c6a336389b
4 changed files with 130 additions and 37 deletions

View File

@@ -174,6 +174,27 @@ const RegionSelector = ({
/>
<span className="text-xl">Erase mode</span>
</label>
<label
htmlFor="zoomMode"
className={`p-4 border rounded-lg mb-2
${mode === "zoom" ? "border-gray-400 bg-[#202b36]" : "bg-[#253445] border-gray-700"}
hover:bg-[#202b36] hover:cursor-pointer`}
>
<input
id="zoomMode"
type="radio"
onChange={handleChange}
checked={mode === "zoom"}
value="zoom"
className="sr-only"
/>
<div className="flex flex-col space-y-3">
<span className="text-xl">Enlarge image</span>
{mode === "zoom" && (
<small className={`text-gray-400 italic`}>Use mouse to digitally zoom in and out</small>
)}
</div>
</label>
</div>
</div>