latest dev

front/src/Components/MyCamera.svelte

@@ -1,6 +1,6 @@
 <script lang="typescript">
     import {obtainedMediaConstraintStore} from "../Stores/MediaStore";
-    import {localStreamStore} from "../Stores/MediaStore";
+    import {localStreamStore, isSilentStore} from "../Stores/MediaStore";
     import SoundMeterWidget from "./SoundMeterWidget.svelte";
     import {onDestroy} from "svelte";
     import {srcObject} from "./Video/utils";
@@ -17,14 +17,25 @@
 
     onDestroy(unsubscribe);
 
+
+    let isSilent: boolean;
+    const unsubscribeIsSilent = isSilentStore.subscribe(value => {
+        isSilent = value;
+    });
+
+    onDestroy(unsubscribeIsSilent);
+
 </script>
 
 
 <div>
-    <div class="video-container nes-container is-rounded is-dark  div-myCamVideo" class:hide={!$obtainedMediaConstraintStore.video}>
+    <div class="video-container nes-container is-rounded is-dark div-myCamVideo" class:hide={!$obtainedMediaConstraintStore.video || isSilent}>
         {#if $localStreamStore.type === "success" && $localStreamStore.stream}
         <video class="myCamVideo" use:srcObject={stream} autoplay muted playsinline></video>
         <SoundMeterWidget stream={stream}></SoundMeterWidget>
         {/if}
     </div>
+    <div class="is-silent" class:hide={isSilent}>
+        Silent zone
+    </div>
 </div>