Join session with audio and/or video off. Toggle both during session

README.md

@@ -90,8 +90,15 @@ mvn install -DskipTests=true
 ```
 **/openvidu/openvidu-server**
 ```
-mvn compile exec:java -Dexec.mainClass="org.openvidu.server.OpenViduServer"
+mvn compile exec:java
 ```
+
+*(or if you prefer you can just run the Java application in your favourite IDE)*
+
+
+----------
+
+
 At these point, you can start modifying *openvidu-ng-testapp*, *openvidu-browser* or *openvidu-server*.
 
  - *openvidu-ng-testapp*:  the previous "ng serve" command will take care of refreshing the browser's page whenever any change takes place.
@@ -105,7 +112,6 @@ At these point, you can start modifying *openvidu-ng-testapp*, *openvidu-browser
 
  **/openvidu/openvidu-server** 
  ``` 
- mvn compile exec:java -Dexec.mainClass="org.openvidu.server.OpenViduServer"
+ mvn compile exec:java
   ```
-
-
+*(or re-launch the Java application in your IDE)*

openvidu-browser/src/main/resources/ts/Participant.ts

@@ -33,7 +33,8 @@ export class Participant {
                         recvAudio: ( streamOptions.recvAudio == undefined ? true : streamOptions.recvAudio ),
                         audio: streamOptions.audio,
                         video: streamOptions.video,
-                        data: streamOptions.data
+                        data: streamOptions.data,
+                        mediaConstraints: streamOptions.mediaConstraints
                     }
                     let stream = new Stream( openVidu, false, room, streamOpts );
 

openvidu-browser/src/main/resources/ts/Stream.ts

@@ -35,6 +35,7 @@ export interface StreamOptions {
     video: boolean;
     audio: boolean;
     data: boolean;
+    mediaConstraints: any;
 }
 
 export interface VideoOptions {
@@ -55,6 +56,9 @@ export class Stream {
     private speechEvent: any;
     private recvVideo: any;
     private recvAudio: any;
+    private sendVideo: boolean;
+    private sendAudio: boolean;
+    private mediaConstraints: any;
     private showMyRemote = false;
     private localMirrored = false;
     private chanId = 0;
@@ -73,6 +77,9 @@ export class Stream {
         this.recvVideo = options.recvVideo;
         this.recvAudio = options.recvAudio;
         this.dataChannel = options.data || false;
+        this.sendVideo = options.video;
+        this.sendAudio = options.audio;
+        this.mediaConstraints = options.mediaConstraints;
     }
 
     getRecvVideo() {
@@ -262,6 +269,9 @@ export class Stream {
         };
 
         navigator.getUserMedia( constraints, userStream => {
+            userStream.getAudioTracks()[0].enabled = this.sendAudio;
+            userStream.getVideoTracks()[0].enabled = this.sendVideo;
+
             this.wrStream = userStream;
             callback(undefined, this);
         },  error => {
@@ -316,9 +326,15 @@ export class Stream {
 
     private initWebRtcPeer( sdpOfferCallback ) {
         if ( this.local ) {
+
+            let userMediaConstraints = {
+                audio : this.sendAudio,
+                video : this.sendVideo
+            }
             
             let options: any = {
                 videoStream: this.wrStream,
+                mediaConstraints: userMediaConstraints,
                 onicecandidate: this.participant.sendIceCandidate.bind( this.participant ),
             }
             

openvidu-ng-testapp/src/app/app.component.html

@@ -9,6 +9,12 @@
 			<label>Session:</label>
 			<input type="text" name="sessionId" [(ngModel)]="sessionId" required>
 		</p>
+		<p>
+			<input type="checkbox" [(ngModel)]="joinWithVideo" id="join-with-video" name="join-with-video"> Send video
+		</p>
+		<p>
+			<input type="checkbox" [(ngModel)]="joinWithAudio" id="join-with-audio" name="join-with-audio"> Send audio
+		</p>
 		<p>
 			<input type="submit" name="commit" value="Join!">
 		</p>
@@ -18,6 +24,10 @@
 <div *ngIf="session">
 	<h2>{{sessionId}}</h2>
 	<input type="button" (click)="leaveSession()" value="Leave session">
+	<input type="checkbox" id="toggle-video" name="toggle-video" 
+		[checked]="toggleVideo" (change)="updateToggleVideo($event)"> Toggle your video
+	<input type="checkbox" id="toggle-audio" name="toggle-audio" 
+		[checked]="toggleAudio" (change)="updateToggleAudio($event)"> Toggle your audio
 	<div>
 		<stream *ngFor="let s of streams" [stream]="s"></stream>
 	</div>

openvidu-ng-testapp/src/app/app.component.ts

@@ -9,14 +9,20 @@ export class AppComponent {
 
   private openVidu: OpenVidu;
 
-  //Join form
+  // Join form
   sessionId: string;
   participantId: string;
 
-  //Session
+  // Session
   session: Session;
   streams: Stream[] = [];
 
+  // Publish options
+  joinWithVideo: boolean = true;
+  joinWithAudio: boolean = true;
+  toggleVideo: boolean;
+  toggleAudio: boolean;
+
   constructor() {
     this.generateParticipantInfo();
     window.onbeforeunload = () => {
@@ -24,22 +30,35 @@ export class AppComponent {
     }
   }
 
-  private generateParticipantInfo(){
+  private generateParticipantInfo() {
     this.sessionId = "SessionA";
-    this.participantId = "Participant"+Math.floor(Math.random() * 100);
+    this.participantId = "Participant" + Math.floor(Math.random() * 100);
   }
 
-  private addVideoTag(stream:Stream){
+  private addVideoTag(stream: Stream) {
     console.log("Stream added");
     this.streams.push(stream);
   }
 
-  private removeVideoTag(stream:Stream){
+  private removeVideoTag(stream: Stream) {
     console.log("Stream removed");
     this.streams.slice(this.streams.indexOf(stream), 1);
   }
 
   joinSession() {
+    var cameraOptions = {
+      audio: this.joinWithAudio,
+      video: this.joinWithVideo,
+      data: true,
+      mediaConstraints: {}
+    }
+    this.joinSessionShared(cameraOptions);
+  }
+
+  joinSessionShared(cameraOptions) {
+
+    this.toggleVideo = this.joinWithVideo;
+    this.toggleAudio = this.joinWithAudio;
 
     this.openVidu = new OpenVidu("wss://127.0.0.1:8443/");
 
@@ -48,7 +67,7 @@ export class AppComponent {
       if (error)
         return console.log(error);
 
-      let camera = openVidu.getCamera();
+      let camera = openVidu.getCamera(cameraOptions);
 
       camera.requestCameraAccess((error, camera) => {
 
@@ -72,11 +91,11 @@ export class AppComponent {
           camera.publish();
 
           session.addEventListener("stream-added", streamEvent => {
-            this.addVideoTag(streamEvent.stream);            
+            this.addVideoTag(streamEvent.stream);
           });
 
           session.addEventListener("stream-removed", streamEvent => {
-            this.removeVideoTag(streamEvent.stream);            
+            this.removeVideoTag(streamEvent.stream);
           });
 
         });
@@ -91,4 +110,34 @@ export class AppComponent {
     this.generateParticipantInfo();
   }
 
+  updateToggleVideo(event) {
+    this.toggleVideoTrack(event.target.checked);
+    let msg = (event.target.checked) ? 'Publishing video...' : 'Unpublishing video...'
+    console.log(msg);
+  }
+
+  updateToggleAudio(event) {
+    this.toggleAudioTrack(event.target.checked);
+    let msg = (event.target.checked) ? 'Publishing audio...' : 'Unpublishing audio...'
+    console.log(msg);
+  }
+
+  toggleVideoTrack(activate: boolean) {
+    this.openVidu.getCamera().getWebRtcPeer().videoEnabled = activate;
+  }
+
+  toggleAudioTrack(activate: boolean) {
+    this.openVidu.getCamera().getWebRtcPeer().audioEnabled = activate;
+  }
+
+  publishVideoAudio() {
+    this.toggleVideoTrack(true);
+    this.toggleAudioTrack(true);
+  }
+
+  unpublishVideoAudio() {
+    this.toggleVideoTrack(false);
+    this.toggleAudioTrack(false);
+  }
+
 }

openvidu-server/pom.xml

@@ -45,6 +45,11 @@
 			<organizationUrl>http://www.kurento.org</organizationUrl>
 		</developer>
 	</developers>
+	
+	<properties>
+		<!-- Main class -->
+		<start-class>org.openvidu.server.OpenViduServer</start-class>
+	</properties>
 
 	<build>
 		<resources>
@@ -60,6 +65,16 @@
 				</includes>
 			</resource>
 		</resources>
+		
+		<plugins>
+			<plugin>
+				<groupId>org.codehaus.mojo</groupId>
+				<artifactId>exec-maven-plugin</artifactId>
+				<configuration>
+					<mainClass>${start-class}</mainClass>
+				</configuration>
+			</plugin>
+		</plugins>
 	</build>
 
 	<dependencies>