Modify a couple of examples to support "audio only" operations

kurento-hello-world/src/main/resources/static/index.html

@@ -69,7 +69,8 @@ <h1>Tutorial 1: Hello World (WebRTC in loopback)</h1>
 		</div>
 		<div class="row">
 			<div class="col-md-5">
-				<h3>Local stream</h3>
+				<h3>Local stream</h3>				
+				<audio id="audioInput" autoplay style='display:none'></audio>
 				<video id="videoInput" autoplay width="480px" height="360px"
 					poster="img/webrtc.png"></video>
 			</div>
@@ -78,9 +79,15 @@ <h3>Local stream</h3>
 					class="glyphicon glyphicon-play"></span> Start</a><br /> <br /> <a
 					id="stop" href="#" class="btn btn-danger"><span
 					class="glyphicon glyphicon-stop"></span> Stop</a>
+				<br /> <br />
+				<select id='modeSelect'>
+					<option value="video">Video And Audio</option>
+					<option value="audio">Audio Only</option>
+				</select>
 			</div>
 			<div class="col-md-5">
 				<h3>Remote stream</h3>
+				<audio id="audioOutput" autoplay style='display:none'></audio>
 				<video id="videoOutput" autoplay width="480px" height="360px"
 					poster="img/webrtc.png"></video>
 			</div>

kurento-hello-world/src/main/resources/static/js/index.js

@@ -18,6 +18,9 @@
 var ws = new WebSocket('wss://' + location.host + '/helloworld');
 var videoInput;
 var videoOutput;
+var audioInput;
+var audioOutput;
+var modeSelect;
 var webRtcPeer;
 var state = null;
 
@@ -30,6 +33,9 @@ window.onload = function() {
 	console.log('Page loaded ...');
 	videoInput = document.getElementById('videoInput');
 	videoOutput = document.getElementById('videoOutput');
+	audioInput = document.getElementById('audioInput');
+	audioOutput = document.getElementById('audioOutput');
+	modeSelect = document.getElementById('modeSelect');
 	setState(I_CAN_START);
 }
 
@@ -73,11 +79,26 @@ function start() {
 	showSpinner(videoInput, videoOutput);
 
 	console.log('Creating WebRtcPeer and generating local sdp offer ...');
-
-	var options = {
-		localVideo : videoInput,
-		remoteVideo : videoOutput,
-		onicecandidate : onIceCandidate
+	var audioOnly = modeSelect.value == 'audio';
+
+	var options;
+
+	if(audioOnly) {
+		options = {
+			localVideo : audioInput,
+			remoteVideo : audioOutput,
+			mediaConstraints: {
+				audio: true,
+				video: false,
+			},
+			onicecandidate : onIceCandidate
+		}
+	} else {
+		options = {
+			localVideo : videoInput,
+			remoteVideo : videoOutput,
+			onicecandidate : onIceCandidate
+		}
 	}
 	webRtcPeer = new kurentoUtils.WebRtcPeer.WebRtcPeerSendrecv(options,
 			function(error) {
@@ -116,6 +137,10 @@ function startResponse(message) {
 	setState(I_CAN_STOP);
 	console.log('SDP answer received from server. Processing ...');
 
+	var audioOnly = modeSelect.value == 'audio';
+	if(audioOnly) {
+		hideSpinner(videoInput, videoOutput);
+	}
 	webRtcPeer.processAnswer(message.sdpAnswer, function(error) {
 		if (error)
 			return console.error(error);

kurento-one2many-call/src/main/java/org/kurento/tutorial/one2manycall/CallHandler.java

@@ -25,6 +25,7 @@
 import org.kurento.client.IceCandidateFoundEvent;
 import org.kurento.client.KurentoClient;
 import org.kurento.client.MediaPipeline;
+import org.kurento.client.MediaType;
 import org.kurento.client.WebRtcEndpoint;
 import org.kurento.jsonrpc.JsonUtils;
 import org.slf4j.Logger;
@@ -57,6 +58,7 @@ public class CallHandler extends TextWebSocketHandler {
 
   private MediaPipeline pipeline;
   private UserSession presenterUserSession;
+  private MediaType mediaType = MediaType.VIDEO;
 
   @Override
   public void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
@@ -119,6 +121,7 @@ private void handleErrorResponse(Throwable throwable, WebSocketSession session,
   private synchronized void presenter(final WebSocketSession session, JsonObject jsonMessage)
       throws IOException {
     if (presenterUserSession == null) {
+
       presenterUserSession = new UserSession(session);
 
       pipeline = kurento.createMediaPipeline();
@@ -143,7 +146,11 @@ public void onEvent(IceCandidateFoundEvent event) {
         }
       });
 
+      boolean audioOnly = jsonMessage.has("modeSelect") && "audio".equals(jsonMessage.get("modeSelect").getAsString());
+      mediaType = audioOnly ? MediaType.AUDIO : MediaType.VIDEO;
+
       String sdpOffer = jsonMessage.getAsJsonPrimitive("sdpOffer").getAsString();
+
       String sdpAnswer = presenterWebRtc.processOffer(sdpOffer);
 
       JsonObject response = new JsonObject();
@@ -208,7 +215,7 @@ public void onEvent(IceCandidateFoundEvent event) {
       });
 
       viewer.setWebRtcEndpoint(nextWebRtc);
-      presenterUserSession.getWebRtcEndpoint().connect(nextWebRtc);
+      presenterUserSession.getWebRtcEndpoint().connect(nextWebRtc, mediaType);
       String sdpOffer = jsonMessage.getAsJsonPrimitive("sdpOffer").getAsString();
       String sdpAnswer = nextWebRtc.processOffer(sdpOffer);
 

kurento-one2many-call/src/main/resources/static/index.html

@@ -92,6 +92,10 @@ <h1>Tutorial 3: Video Call 1 to N with WebRTC</h1>
 							class="glyphicon glyphicon-user"></span> Viewer</a> <a id="stop"
 							href="#" class="btn btn-danger"><span
 							class="glyphicon glyphicon-stop"></span> Stop</a>
+						<select id='modeSelect'>
+							<option value="video">Video And Audio</option>
+							<option value="audio">Audio Only</option>
+						</select>
 					</div>
 				</div>
 				<br /> <label class="control-label" for="console">Console</label><br>
@@ -104,6 +108,7 @@ <h1>Tutorial 3: Video Call 1 to N with WebRTC</h1>
 				<div id="videoBig">
 					<video id="video" autoplay width="640px" height="480px"
 						poster="img/webrtc.png"></video>
+					<audio id='audio' autoplay style='display:none'></audio>
 				</div>
 			</div>
 		</div>

kurento-one2many-call/src/main/resources/static/js/index.js

@@ -17,11 +17,15 @@
 
 var ws = new WebSocket('wss://' + location.host + '/call');
 var video;
+var audio;
+var modeSelect;
 var webRtcPeer;
 
 window.onload = function() {
 	console = new Console();
 	video = document.getElementById('video');
+	audio = document.getElementById('audio');
+	modeSelect = document.getElementById('modeSelect');
 	disableStopButton();
 }
 
@@ -64,6 +68,10 @@ function presenterResponse(message) {
 			if (error)
 				return console.error(error);
 		});
+
+		if(modeSelect.value == 'audio') {
+			hideSpinner();
+		}
 	}
 }
 
@@ -77,16 +85,30 @@ function viewerResponse(message) {
 			if (error)
 				return console.error(error);
 		});
+		if(modeSelect.value == 'audio') {
+			hideSpinner();
+		}
 	}
 }
 
 function presenter() {
 	if (!webRtcPeer) {
-		showSpinner(video);
-
-		var options = {
-			localVideo : video,
-			onicecandidate : onIceCandidate
+		var options;
+
+		if(modeSelect.value == 'audio') {
+			options = {
+				localVideo : audio,
+				onicecandidate : onIceCandidate,
+				mediaConstraints: {
+					audio: true,
+					video: false
+				}
+			};
+		} else {
+			options = {
+				localVideo : video,
+				onicecandidate : onIceCandidate,
+			};
 		}
 		webRtcPeer = new kurentoUtils.WebRtcPeer.WebRtcPeerSendonly(options,
 				function(error) {
@@ -106,18 +128,30 @@ function onOfferPresenter(error, offerSdp) {
 	console.info('Invoking SDP offer callback function ' + location.host);
 	var message = {
 		id : 'presenter',
+		modeSelect: modeSelect.value,
 		sdpOffer : offerSdp
 	}
 	sendMessage(message);
 }
 
 function viewer() {
 	if (!webRtcPeer) {
-		showSpinner(video);
-
-		var options = {
-			remoteVideo : video,
-			onicecandidate : onIceCandidate
+		var options;
+
+		if(modeSelect.value == 'audio') {
+			options = {
+				remoteVideo : audio,
+				onicecandidate : onIceCandidate,
+				mediaConstraints: {
+					audio: true,
+					video: false
+				}
+			};
+		} else {
+			options = {
+				remoteVideo : video,
+				onicecandidate : onIceCandidate,
+			};
 		}
 		webRtcPeer = new kurentoUtils.WebRtcPeer.WebRtcPeerRecvonly(options,
 				function(error) {
@@ -194,7 +228,7 @@ function enableButton(id, functionName) {
 
 function sendMessage(message) {
 	var jsonMessage = JSON.stringify(message);
-	console.log('Senging message: ' + jsonMessage);
+	console.log('Sending message: ' + jsonMessage);
 	ws.send(jsonMessage);
 }