voxeet/dolby.io создание нескольких конференций

Я использую dolby.io

Till now I have implemented join conference, leave conference, start and stop video, start and stop recording, start and stop screen sharing. What I am facing issue is about multiple conference. I want to implement multiple conferences with unique conference IDs so that every user specified for relevant conference should join its own. I am not getting any idea from its official documentation.

here is my code

const initUI = () => {
  const nameMessage = document.getElementById('name-message');
  const joinButton = document.getElementById('join-btn');
  const conferenceAliasInput = document.getElementById('alias-input');
  const leaveButton = document.getElementById('leave-btn');
  const startVideoBtn = document.getElementById('start-video-btn');
  const stopVideoBtn = document.getElementById('stop-video-btn');
  const startScreenShareBtn = document.getElementById('start-screenshare-btn');
  const stopScreenShareBtn = document.getElementById('stop-screenshare-btn');
  const startRecordingBtn = document.getElementById('start-recording-btn');
  const stopRecordingBtn = document.getElementById('stop-recording-btn');
  //const mute_unmute = document.getElementById('mute');
  //oxeetSDK.conference.mute(VoxeetSDK.session.participant, VoxeetSDK.session.participant.isMuted);
  //let isMuted = VoxeetSDK.conference.toggleMute(VoxeetSDK.session.participant);
  nameMessage.innerHTML = `${randomName}`;
  joinButton.disabled = false;

  joinButton.onclick = () => {
      let conferenceAlias = conferenceAliasInput.value;

      /*
      1. Create a conference room with an alias
      2. Join the conference with its id
      */
      VoxeetSDK.conference.create({ alias: conferenceAlias })
          .then((conference) => VoxeetSDK.conference.join(conference, {}))
          .then(() => {
              joinButton.disabled = true;
              leaveButton.disabled = false;
              startVideoBtn.disabled = false;
              startScreenShareBtn.disabled = false;
              startRecordingBtn.disabled = false;
          })
          .catch((e) => console.log('Something wrong happened : ' + e))
  };

  leaveButton.onclick = () => {
      VoxeetSDK.conference.leave()
          .then(() => {
              joinButton.disabled = false;
              leaveButton.disabled = true;
              startScreenShareBtn.disabled = true;
              stopScreenShareBtn.disabled = true;
          })
          .catch((err) => {
              console.log(err);
          });
  };

  startVideoBtn.onclick = () => {
      VoxeetSDK.conference.startVideo(VoxeetSDK.session.participant)
          .then(() => {
              startVideoBtn.disabled = true;
              stopVideoBtn.disabled = false;
          });
  };

  stopVideoBtn.onclick = () => {
      VoxeetSDK.conference.stopVideo(VoxeetSDK.session.participant)
          .then(() => {
              stopVideoBtn.disabled = true;
              startVideoBtn.disabled = false;
          });
  };

  startScreenShareBtn.onclick = () => {
      VoxeetSDK.conference.startScreenShare()
          .then(() => {
              startScreenShareBtn.disabled = true;
              stopScreenShareBtn.disabled = false;
          })
          .catch((e) => console.log(e))
  };

  stopScreenShareBtn.onclick = () => {
      VoxeetSDK.conference.stopScreenShare()
          .then(() => {
              startScreenShareBtn.disabled = false;
              stopScreenShareBtn.disabled = true;
          })
          .catch((e) => console.log(e))
  };

  startRecordingBtn.onclick = () => {
      let recordStatus = document.getElementById('record-status');
      VoxeetSDK.recording.start()
          .then(() => {
              recordStatus.innerText = 'Recording...';
              startRecordingBtn.disabled = true;
              stopRecordingBtn.disabled = false;
          })
          .catch((err) => {
              console.log(err);
          })
  };

  stopRecordingBtn.onclick = () => {
      let recordStatus = document.getElementById('record-status');
      VoxeetSDK.recording.stop()
          .then(() => {
              recordStatus.innerText = '';
              startRecordingBtn.disabled = false;
              stopRecordingBtn.disabled = true;
          })
          .catch((err) => {
              console.log(err);
          })
  };
};

const addVideoNode = (participant, stream) => {
  const videoContainer = document.getElementById('video-container');
  let videoNode = document.getElementById('video-' + participant.id);

  if(!videoNode) {
      videoNode = document.createElement('video');
      
      videoNode.setAttribute('id', 'video-' + participant.id);

      videoNode.setAttribute('controls', true);

      //VoxeetSDK.conference.mute(VoxeetSDK.session.participant, VoxeetSDK.session.participant.isMuted);
      //let isMuted = VoxeetSDK.conference.toggleMute(VoxeetSDK.session.participant);
      //console.log(isMuted);

      //videoNode.setAttribute('height', 240);
      //videoNode.setAttribute('width', 720);
      
      videoContainer.appendChild(videoNode);
      
      videoNode.autoplay = 'autoplay';
      videoNode.muted = true;
  }

  navigator.attachMediaStream(videoNode, stream);
};

const removeVideoNode = (participant) => {
  let videoNode = document.getElementById('video-' + participant.id);

  if (videoNode) {
      videoNode.parentNode.removeChild(videoNode);
  }
};

const addParticipantNode = (participant) => {
  //const members_count++;
  const participantsList = document.getElementById('participants-list');

  // if the participant is the current session user, don't add himself to the list
  if (participant.id === VoxeetSDK.session.participant.id) return;
  // let participantNode = document.createElement('li');
  // participantNode.setAttribute('id', 'participant-' + participant.id);
  // participantNode.innerText = `${participant.info.name}`;
  //alert(VoxeetSDK.session.participant);

  //document.getElementById('members_count').innerText=participant.id;
  let participantNode = document.createElement('div');
  participantNode.setAttribute('class', 'tabcnt-item');
  participantNode.setAttribute('id', 'participant-' + participant.id);

  //document.getElementById('members_count').innerText = document.getElementById('members_count').innerText + 1;
  //document.getElementById('members_count').innerText = members_count;

  participantNode.innerText = `${participant.info.name}`;
  const send_html = "<div class='tabcnt-item'><div class='row align-items-center'><div class='col-md-8'><div class='media'><img src='images/pp.png' alt=''><div class='media-body'><h3>'"+`${participant.info.name}`+"'</h3><p>email@dname.com</p></div></div></div><div class='col-md-4'><ul><li><a href='#'><i class='fas fa-video'></i></a></li><li><a href='#'><i class='fas fa-microphone'></i></a></li></ul></div></div></div>";
  
  participantNode.innerHTML = send_html;

  participantsList.appendChild(participantNode);
  document.getElementById('members_count').innerText= $('.tab-cnt').length;
};

const removeParticipantNode = (participant) => {
  let participantNode = document.getElementById('participant-' + participant.id);

  if (participantNode) {
      participantNode.parentNode.removeChild(participantNode);
      document.getElementById('members_count').innerText= $('.tab-cnt').length;
  }
};

const addScreenShareNode = (stream) => {
  const screenShareContainer = document.getElementById('screenshare-container');
  let screenShareNode = document.getElementById('screenshare');

  if (screenShareNode) return alert('There is already a participant sharing his screen !');

  screenShareNode = document.createElement('video');
  screenShareNode.setAttribute('id', 'screenshare');
  screenShareNode.autoplay = 'autoplay';
  navigator.attachMediaStream(screenShareNode, stream);

  screenShareContainer.appendChild(screenShareNode);
}

const removeScreenShareNode = () => {
  let screenShareNode = document.getElementById('screenshare');

  if (screenShareNode) {
      screenShareNode.parentNode.removeChild(screenShareNode);
  }
}

I am exhausted and tired of googling. It will be a great help if some can guide or provide direction towards more elaborative documentation. I have read each and every bit of dolby docs. Thanks for reading

1 ответ

Решение

Когда ты звонишь create()создается новый идентификатор конференции, специфичный для вашей учетной записи. Вы можете вызвать get_id(), чтобы найти его. Вы также можете указать псевдоним, чтобы облегчить чтение, когда может быть несколько активных конференций в любой момент времени.

Если вы хотите провести несколько конференций, позвоните create()многократно. То есть ожидается, что типичное приложение инициализирует только одну конференцию, но есть несколько запущенных экземпляров, каждый из которых имеет свою собственную конференцию и / или приглашает других на существующую конференцию. Для веб-приложений это может быть отдельный пользовательский сеанс, а не отдельное развернутое мобильное приложение. Возможно, вы захотите вести учет того, какие идентификаторы создаются для каждого пользователя в ваших собственных службах.

Вы можете искать все конференции, которые активны в учетной записи в любой момент времени, при тестировании или мониторинге развернутых приложений. Вы можете использовать Monitor API getConferences, чтобы получить этот список.

Если у вас есть дополнительные вопросы, вероятно, лучше всего использовать службу поддержки Dolby.io для получения более личных ответов и рекомендаций.

Другие вопросы по тегам