Adding importance handling

front/src/Components/Video/LocalStreamMedia.svelte

@@ -1,4 +1,6 @@
 <script lang="typescript">
+    import {ScreenSharingLocalMedia} from "../../Stores/ScreenSharingStore";
+
     function srcObject(node, stream) {
         node.srcObject = stream;
         return {
@@ -10,11 +12,12 @@
         }
     }
 
-    export let stream : MediaStream|undefined;
+    export let peer : ScreenSharingLocalMedia;
+    let stream : MediaStream|undefined = peer.stream;
     export let cssClass : string|undefined;
 </script>
 
 
 <div class="video-container {cssClass}" class:hide={!stream}>
-    <video class="myCamVideo" use:srcObject={stream} autoplay muted playsinline></video>
+    <video class="myCamVideo" use:srcObject={stream} autoplay muted playsinline  on:click={() => peer.importanceStore.toggle()}></video>
 </div>

front/src/Components/Video/Peer.svelte

@@ -15,6 +15,6 @@
     {:else if peer instanceof ScreenSharingPeer}
         <ScreenSharingMedia peer={peer}/>
     {:else}
-        <LocalStreamMedia stream={peer.stream}/>
+        <LocalStreamMedia peer={peer}/>
     {/if}
 </div>

front/src/Components/Video/ScreenSharingMedia.svelte

@@ -45,7 +45,7 @@
     {#if $streamStore === null}
         <i style="background-color: {getColorByString(name)};">{name}</i>
     {/if}
-    <video use:srcObject={$streamStore} autoplay playsinline></video>
+    <video use:srcObject={$streamStore} autoplay playsinline on:click={() => peer.importanceStore.toggle()}></video>
 </div>
 
 <style lang="scss">

front/src/Components/Video/VideoMedia.svelte

@@ -4,12 +4,14 @@
     import microphoneCloseImg from "../images/microphone-close.svg";
     import reportImg from "./images/report.svg";
     import blockSignImg from "./images/blockSign.svg";
+    import {DivImportance} from "../../WebRtc/LayoutManager";
 
     export let peer: VideoPeer;
     let streamStore = peer.streamStore;
     let name = peer.userName;
     let statusStore = peer.statusStore;
     let constraintStore = peer.constraintsStore;
+    let importanceStore = peer.importanceStore;
 
     constraintStore.subscribe((vl) => console.log('CONS', vl));
 
@@ -40,6 +42,7 @@
             }
         }
     }
+
 </script>
 
 <div class="video-container">
@@ -59,7 +62,7 @@
         <img alt="Report this user" src={reportImg}>
         <span>Report/Block</span>
     </button>
-    <video use:srcObject={$streamStore} autoplay playsinline></video>
+    <video use:srcObject={$streamStore} autoplay playsinline on:click={() => peer.importanceStore.toggle()}></video>
     <img src={blockSignImg} class="block-logo" alt="Block">
     {#if $constraintStore && $constraintStore.audio !== false}
         <SoundMeterWidget stream={$streamStore}></SoundMeterWidget>