Adding display / hide of layout buttons when a meet start / ends

front/src/Phaser/Game/GameScene.ts

@@ -18,7 +18,7 @@ import {PlayerMovement} from "./PlayerMovement";
 import {PlayersPositionInterpolator} from "./PlayersPositionInterpolator";
 import {RemotePlayer} from "../Entity/RemotePlayer";
 import {Queue} from 'queue-typescript';
-import {SimplePeer} from "../../WebRtc/SimplePeer";
+import {SimplePeer, UserSimplePeer} from "../../WebRtc/SimplePeer";
 import {ReconnectingSceneName} from "../Reconnecting/ReconnectingScene";
 import {FourOFourSceneName} from "../Reconnecting/FourOFourScene";
 import {loadAllLayers} from "../Entity/body_character";
@@ -227,6 +227,19 @@ export class GameScene extends Phaser.Scene {
 
             // When connection is performed, let's connect SimplePeer
             this.simplePeer = new SimplePeer(this.connection);
+            const self = this;
+            this.simplePeer.registerPeerConnectionListener({
+                onConnect(user: UserSimplePeer) {
+                    self.presentationModeSprite.setVisible(true);
+                    self.chatModeSprite.setVisible(true);
+                },
+                onDisconnect(userId: string) {
+                    if (self.simplePeer.getNbConnections() === 0) {
+                        self.presentationModeSprite.setVisible(false);
+                        self.chatModeSprite.setVisible(false);
+                    }
+                }
+            })
 
             this.scene.wake();
             this.scene.sleep(ReconnectingSceneName);
@@ -374,19 +387,20 @@ export class GameScene extends Phaser.Scene {
             }, 500);
         }
 
-        // FIXME: handle display / hide based on number of cameras connected
         this.presentationModeSprite = this.add.sprite(2, this.game.renderer.height - 2, 'layout_modes', 0);
         this.presentationModeSprite.setScrollFactor(0, 0);
         this.presentationModeSprite.setOrigin(0, 1);
         this.presentationModeSprite.setInteractive();
+        this.presentationModeSprite.setVisible(false);
         this.presentationModeSprite.on('pointerup', this.switchLayoutMode.bind(this));
         this.chatModeSprite = this.add.sprite(36, this.game.renderer.height - 2, 'layout_modes', 3);
         this.chatModeSprite.setScrollFactor(0, 0);
         this.chatModeSprite.setOrigin(0, 1);
         this.chatModeSprite.setInteractive();
+        this.chatModeSprite.setVisible(false);
         this.chatModeSprite.on('pointerup', this.switchLayoutMode.bind(this));
 
-        // FIXME: change this to use the class for input
+        // FIXME: change this to use the UserInputManager class for input
         this.input.keyboard.on('keyup-' + 'M', () => {
             this.switchLayoutMode();
         });

front/src/WebRtc/SimplePeer.ts

@@ -14,6 +14,12 @@ export interface UserSimplePeer{
     initiator?: boolean;
 }
 
+export interface PeerConnectionListener {
+    onConnect(user: UserSimplePeer): void;
+
+    onDisconnect(userId: string): void;
+}
+
 /**
  * This class manages connections to all the peers in the same group as me.
  */
@@ -24,6 +30,7 @@ export class SimplePeer {
 
     private PeerConnectionArray: Map<string, SimplePeerNamespace.Instance> = new Map<string, SimplePeerNamespace.Instance>();
     private readonly updateLocalStreamCallback: (media: MediaStream) => void;
+    private readonly peerConnectionListeners: Array<PeerConnectionListener> = new Array<PeerConnectionListener>();
 
     constructor(Connection: Connection, WebRtcRoomId: string = "test-webrtc") {
         this.Connection = Connection;
@@ -34,6 +41,14 @@ export class SimplePeer {
         this.initialise();
     }
 
+    public registerPeerConnectionListener(peerConnectionListener: PeerConnectionListener) {
+        this.peerConnectionListeners.push(peerConnectionListener);
+    }
+
+    public getNbConnections(): number {
+        return this.PeerConnectionArray.size;
+    }
+
     /**
      * permit to listen when user could start visio
      */
@@ -182,6 +197,10 @@ export class SimplePeer {
         });
 
         this.addMedia(user.userId);
+
+        for (let peerConnectionListener of this.peerConnectionListeners) {
+            peerConnectionListener.onConnect(user);
+        }
     }
 
     /**
@@ -203,6 +222,9 @@ export class SimplePeer {
             peer.destroy();
             this.PeerConnectionArray.delete(userId)
             //console.log('Nb users in peerConnectionArray '+this.PeerConnectionArray.size);
+            for (let peerConnectionListener of this.peerConnectionListeners) {
+                peerConnectionListener.onDisconnect(userId);
+            }
         } catch (err) {
             console.error("closeConnection", err)
         }