UI tweaks (#12297)

* Use full resolution aspect for main camera style in history view

* Only check for offline cameras after 60s of uptime

* only call onPlaying when loadeddata is fired or after timeout

* revert to inline funcs

* Portal frigate plus alert dialog

* remove duplicated logic

* increase onplaying timeout

* Use a ref instead of a state and clear timeout in AutoUpdatingCameraImage

* default to the selected month for selectedDay

* Use buffered time instead of timeout

* Use default cursor when not editing polygons

web/src/views/events/RecordingView.tsx

@@ -314,7 +314,7 @@ export function RecordingView({
       return undefined;
     }
 
-    const aspect = camera.detect.width / camera.detect.height;
+    const aspect = getCameraAspect(mainCamera);
 
     if (!aspect) {
       return undefined;
@@ -336,7 +336,14 @@ export function RecordingView({
     return {
       width: `${Math.round(percent)}%`,
     };
-  }, [config, mainCameraAspect, mainWidth, mainHeight, mainCamera]);
+  }, [
+    config,
+    mainCameraAspect,
+    mainWidth,
+    mainHeight,
+    mainCamera,
+    getCameraAspect,
+  ]);
 
   const previewRowOverflows = useMemo(() => {
     if (!previewRowRef.current) {
@@ -532,6 +539,7 @@ export function RecordingView({
                 isScrubbing={scrubbing || exportMode == "timeline"}
                 setFullResolution={setFullResolution}
                 toggleFullscreen={toggleFullscreen}
+                containerRef={mainLayoutRef}
               />
             </div>
             {isDesktop && (

web/src/views/live/LiveCameraView.tsx

@@ -399,7 +399,7 @@ export default function LiveCameraView({
                   onClick={() => setMic(!mic)}
                 />
               )}
-              {supportsAudioOutput && (
+              {supportsAudioOutput && preferredLiveMode != "jsmpeg" && (
                 <CameraFeatureToggle
                   className="p-2 md:p-0"
                   variant={fullscreen ? "overlay" : "primary"}