Tweaks (#13983)

* Add onConnect to mqtt and doucment

* Add play pause via mouse click

docs/docs/integrations/mqtt.md

@@ -147,6 +147,10 @@ Message published for each changed review item. The first message is published w
 
 Same data available at `/api/stats` published at a configurable interval.
 
+### `frigate/camera_activity`
+
+Returns data about each camera, its current features, and if it is detecting motion, objects, etc. Can be triggered by publising to `frigate/onConnect`
+
 ### `frigate/notifications/set`
 
 Topic to turn notifications on and off. Expected values are `ON` and `OFF`.

frigate/comms/mqtt.py

@@ -222,6 +222,10 @@ class MqttClient(Communicator):  # type: ignore[misc]
                 self.on_mqtt_command,
             )
 
+        self.client.message_callback_add(
+            f"{self.mqtt_config.topic_prefix}/onConnect", self.on_mqtt_command
+        )
+
         self.client.message_callback_add(
             f"{self.mqtt_config.topic_prefix}/restart", self.on_mqtt_command
         )

web/src/components/player/HlsVideoPlayer.tsx

@@ -123,6 +123,23 @@ export default function HlsVideoPlayer({
     videoRef.current.playbackRate = currentPlaybackRate;
   }, [videoRef, hlsRef, useHlsCompat, currentSource]);
 
+  // state handling
+
+  const onPlayPause = useCallback(
+    (play: boolean) => {
+      if (!videoRef.current) {
+        return;
+      }
+
+      if (play) {
+        videoRef.current.play();
+      } else {
+        videoRef.current.pause();
+      }
+    },
+    [videoRef],
+  );
+
   // controls
 
   const [tallCamera, setTallCamera] = useState(false);
@@ -191,17 +208,7 @@ export default function HlsVideoPlayer({
           setMuted={(muted) => setMuted(muted, true)}
           playbackRate={playbackRate ?? 1}
           hotKeys={hotKeys}
-          onPlayPause={(play) => {
+          onPlayPause={onPlayPause}
-            if (!videoRef.current) {
-              return;
-            }
-
-            if (play) {
-              videoRef.current.play();
-            } else {
-              videoRef.current.pause();
-            }
-          }}
           onSeek={(diff) => {
             const currentTime = videoRef.current?.currentTime;
 
@@ -254,12 +261,13 @@ export default function HlsVideoPlayer({
       >
         <video
           ref={videoRef}
-          className={`size-full rounded-lg bg-black md:rounded-2xl ${loadedMetadata ? "" : "invisible"}`}
+          className={`size-full rounded-lg bg-black md:rounded-2xl ${loadedMetadata ? "" : "invisible"} cursor-pointer`}
           preload="auto"
           autoPlay
           controls={!frigateControls}
           playsInline
           muted={muted}
+          onClick={() => onPlayPause(!isPlaying)}
           onVolumeChange={() =>
             setVolume(videoRef.current?.volume ?? 1.0, true)
           }