Detect Track or Stream Changes

[zerobox584]

I have a question about handling conversation content updates.

Here’s the scenario:

Both call1 and call2 use the same peer class. Initially, call1 starts as an audio-only call but later switches to both audio and video.

How can call2 detect that call1 has added a new track or changed its stream?

in example code on html

//Peer.js
export default class Peer {
  constructor(options, callbacks) {
    this.options = options;
    this.callbacks = callbacks;
    this.localStream = null;
    this.remoteStream = null;
    this.peerConnection = null;
  }
  gotRemoteStream = (event) => {
    console.log("gotRemoteStream: ", event);
    this.remoteStream = event.streams[0];
  };
  errorHandler = function (e) {
    console.log("Peer Error", e);
  };
  createdDescription = function (description) {
    this.peerConnection
      .setLocalDescription(description)
      .then(() => {
        console.log("Set description");
      })
      .catch(this.errorHandler);
  };
  stop = function () {
    if (this.localStream) {
      this.localStream.getTracks().forEach((track) => track.stop());
    }
    this.localStream = null;
    this.callbacks.onStopLocalVideo();
    this.callbacks.onStopRemoteVideo();
    this.peerConnection = null;
  };
  answerRTC = async function (sdp) {
    return new Promise(async (resolve, reject) => {
      const gotIceCandidate = (event) => {
        if (event.candidate != null) {
          console.log(event.candidate);
        } else {
          resolve(this.peerConnection.localDescription);
        }
      };

      try {
        console.log(Date.now(), "Start get user media");
        const stream = await navigator.mediaDevices.getUserMedia(
          this.options.constraints,
        );
        this.localStream = stream;
        this.callbacks.onPlayLocalVideo(stream);
        console.log(Date.now(), "Got local stream");
      } catch (error) {
        this.errorHandler(error);
        reject(error);
      }
      this.peerConnection = new RTCPeerConnection(this.options.config);
      this.peerConnection.onicecandidate = gotIceCandidate;
      this.peerConnection.ontrack = this.gotRemoteStream;
      for (const track of this.localStream.getTracks()) {
        this.peerConnection.addTrack(track, this.localStream);
      }
      await this.peerConnection.setRemoteDescription(
        new RTCSessionDescription({ type: "offer", sdp: sdp }),
      );
      const description = await this.peerConnection.createAnswer();
      this.createdDescription(description);
    });
  };
}

//index.js
async function voicetovideo() {
  const constraints = {
    video: { deviceId: { exact: videoLastuse.deviceId } },
    audio: true,
  };
  try {
    const stream = await navigator.mediaDevices.getUserMedia(constraints);
    for (const track of stream.getTracks()) {
      console.log("voice to video track: ", track);
      peer.peerConnection.addTrack(track);
    }
  } catch (e) {
    console.log("error: ", e);
  }
}