Modern WebRTC setParameters

by steveseguin

HTML

<video id="v1" height="120" width="160" autoplay muted></video>
<video id="v2" height="120" width="160" autoplay></video><br>
<button onclick="start()">Start!</button><div id="div"></div>
<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>

JavaScript

var pc1 = new RTCPeerConnection(), pc2 = new RTCPeerConnection();

var add = (pc, can) => can && pc.addIceCandidate(can).catch(failed);
pc1.onicecandidate = e => add(pc2, e.candidate);
pc2.onicecandidate = e => add(pc1, e.candidate);
pc2.onaddstream = e => v2.srcObject = e.stream;
pc1.oniceconnectionstatechange = e => log(pc1.iceConnectionState);

function start() {
  navigator.mediaDevices.getUserMedia({ video: true })
  .then(stream => {
    var sender = pc1.addTrack(stream.getVideoTracks()[0],v1.srcObject = stream);
    var parameters = { encodings: [
      { rid: "foo", maxBitrate: 40000 },
      { rid: "bar", maxBitrate: 10000 },
    ] };
    sender.setParameters(parameters);
  })
  .then(() => pc1.createOffer())
  .then(offer => pc1.setLocalDescription(offer))
  .then(() => pc2.setRemoteDescription(pc1.localDescription))
  .then(() => pc2.createAnswer())
  .then(answer => pc2.setLocalDescription(answer))
  .then(() => pc1.setRemoteDescription(pc2.localDescription))
  .catch(failed);
  
  log("will pause video in 3 seconds for 1 second")
  setTimeout(function(){
  	var sender = pc1.getSenders().find(function(s) {return s.track && s.track.kind == "video";});
		var parameters = sender.getParameters();
		parameters.encodings[0].active = false;
    sender.setParameters(parameters).then(() => {
    			log("unpausing video in 1 second")
					setTimeout(function(){
          	var sender = pc1.getSenders().find(function(s) {return s.track && s.track.kind == "video";});
            var parameters = sender.getParameters();
            parameters.encodings[0].active = true;
            sender.setParameters(parameters).then(() => {
            	// bitrate should be non-zero.
              log("video *should* be unpaused")
            }).catch();
          },1000)
		}).catch();
  },3000)
  
}

var log = msg => div.innerHTML += "<p>" + msg + "</p>";
var failed = e => log(e +", line "+ e.lineNumber);