Stun: improve settings

SaitoTech · Jan 23, 2024 · 2d9c846 · 2d9c846
1 parent 0035032
commit 2d9c846
Show file tree

Hide file tree

Showing 5 changed files with 52 additions and 23 deletions.
diff --git a/mods/stun/lib/appspace/PeerManager.js b/mods/stun/lib/appspace/PeerManager.js
@@ -102,6 +102,7 @@ class PeerManager {
 
     app.connection.on("begin-share-screen", async () => {
       try {
+        console.log("Start");
         this.presentationStream = await navigator.mediaDevices.getDisplayMedia({ 
           video: {
             displaySurface: "window",
@@ -127,6 +128,16 @@ class PeerManager {
       }
     });
 
+
+    app.connection.on("stop-share-screen", async () => {
+      console.log("no more");
+      if (this.presentationStream){
+        this.presentationStream.getTracks().forEach(track => track.stop());
+        this.stopSharing();
+        this.presentationStream = null;
+      }
+    });
+
     //Launch the Stun call
     app.connection.on("start-stun-call", async () => {
       console.log("STUN: start-stun-call");

diff --git a/mods/stun/lib/overlays/videocall-settings.js b/mods/stun/lib/overlays/videocall-settings.js
@@ -23,15 +23,30 @@ class VideoCallSettings {
       };
     });
 
-    if (!this.mod.screen_share){
-      document.querySelectorAll(".share-control").forEach((item) => {
-        item.onclick = () => {
+    if (document.querySelector(".share-control")) {
+      document.querySelector(".share-control").onclick = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        if (this_self.mod.screen_share) {
+          console.log("Emit event to stop");
+          this_self.app.connection.emit("stop-share-screen");
+        } else {
+          console.log("Emit event to start");
           this_self.app.connection.emit("begin-share-screen");
-          this_self.saitoOverlay.remove();
-        };
-      });
+        }
+        this_self.saitoOverlay.remove();
+      };
+    }
+
+    if (document.querySelector(".advanced-settings-link")){
+      document.querySelector(".advanced-settings-link").onclick = (e) => {
+        let anotherOverlay = new SaitoOverlay(this.app, this.mod);
+        anotherOverlay.show(`<div class="videocall-setting-grid-item saito-module-settings"></div>`);
+        this.mod.loadSettings(".saito-module-settings");
+      }
     }
   }
+
 }
 
 module.exports = VideoCallSettings;
diff --git a/mods/stun/lib/overlays/videocall-settings.template.js b/mods/stun/lib/overlays/videocall-settings.template.js
@@ -47,17 +47,24 @@ const VideoCallSettingsTemplate = (display_mode, mod) => {
             
             </div>
 
+            <hr>
 
-             ${(!mod.screen_share) ?
-              `<div class="videocall-option-grid">
-                  <div class="videocall-setting-title">Screenshare</div>
-                  <div class="videocall-setting-icon share-control">
-                    <i class="fa-solid fa-display"></i>
-                  </div>
-                </div>`
-                : ``
-            }
+
+            <div class="videocall-option-container share-control">
+              <label class="videocall-option-label" for="videocall-screenshare">
+              <input id="videocall-screenshare" ${(mod.screen_share)?`checked` : ``} type="checkbox" name="videocall-screenshare">
+                <div class="videocall-option-name">Share screen</div>
+                <i class="fa-solid fa-display"></i>
+              </label>
+            </div>
+
+            <hr>
             
+            <div class="videocall-option-label">
+              <i class="fa-solid fa-sliders"></i>
+              <div class="videocall-option-name advanced-settings-link">Module Settings</div>
+            </div>
+
           </div>
          
       `;

diff --git a/mods/stun/stun.js b/mods/stun/stun.js
@@ -313,7 +313,7 @@ class Stun extends ModTemplate {
     return true;
   }
 
-  loadSettings(container) {
+  loadSettings(container = null) {
     let as = new AppSettings(this.app, this.mod, container);
     as.render();
   }

diff --git a/mods/stun/web/css/stun-video-interface.css b/mods/stun/web/css/stun-video-interface.css
@@ -975,9 +975,10 @@
 
 .videocall-setting-grid-item {
   display: grid;
-  gap: 1.5rem;
   background: var(--saito-background-color);
   color: var(--saito-font-color);
+  padding: 2rem;
+  font-size: 1.75rem;
 }
 
 .videocall-option-grid {
@@ -1010,20 +1011,15 @@
 .videocall-option-label i {
   font-size: 4rem;
   color: var(--saito-font-color);
+  margin: auto;
 }
 
 .videocall-option-label i.fa-table-cells {
   font-size: 4.5rem;
-  margin-left: 0.5rem;
 }
 
 .videocall-option-label i.fa-user {
   font-size: 3.5rem;
-  margin-left: 2rem;
-}
-
-.videocall-option-input {
-  line-height: 4rem
 }
 
 .videocall-setting-icon {