webRTC: Add audio later or disable microphone using peerJS

Question

I am currently writing an application that enables user to start a video call via webRTC using peerJS. Now I want users to be able to decide if they want add audio or not, but without restarting the call.

As I see it - and according to this answer - there is no way to control the microphone using the browser. Suppose I start the call with video and audio enabled I could mute the video element on the partners side. I don't want to do that. Why? I imagine that somebody could use the developer console of the browser and unmute the video element, thus spying on the caller without his or her knowledge.

So for now it seems that I would have to re-call the partner and activate both, video and audio, now if the user wants video only I would have to re-call again.

My question: Is there a better way to do it? Also, if answering the call is there a way to determine wether it is a video-only or a video and audio call?

Answer 1

By accident I found this blog post from Mozilla. The interesting part starts beneath the headline "Muting audio and video streams". Here you will find the following line of code:

mediaStream.getVideoTracks()[0].enabled = !(mediaStream.getVideoTracks()[0].enabled);

That basically means that you can disable the Video-Track. As it turns out, the same is possible with:

mediaStream.getAudioTracks()[0].enabled = false;

Which will mute the audio stream. If this is applied to the localStream like so:

Participant.prototype.startCall = function(){

     var participant = this;

     var target = participant.callees[0];

     navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;

     navigator.getUserMedia({
          audio: true,
          video: true
     },function(stream){
          console.log("called");
          //IMPORTANT LINE HERE
          stream.getAudioTracks()[0].enabled = false;
          participant.localStream = stream;
          participant.call = participant.peer.call(target, stream);
     },function(error){
          console.log(error);   
     });
};

it seems to disable the audio stream. As you can see I store the localStream as a property of my object and am later able to activate the audio-stream by using

myObj.localStream.getAudioTracks()[0].enabled = true;

As far as I can judge you can't do the same operation on the remoteStream. But I will have to verify this thru further testing.