add screenshare's peer information to video stats in connection status modal

Added support for getStats in screenshare's service. This works similar
to the getStats for video provider, and the information retrieved from
screenshare is added to the video information for cameras.

bigbluebutton-html5/imports/api/screenshare/client/bridge/kurento.js

@@ -53,6 +53,26 @@ export default class KurentoScreenshareBridge {
     this._gdmStream = stream;
   }
 
+  /**
+   * Get the RTCPeerConnection object related to the screensharing stream.
+   * @returns {Object} The RTCPeerConnection object related to the presenter/
+   *                   viewer peer. If there's no stream being shared, returns
+   *                   null.
+   */
+  getPeerConnection() {
+    try {
+      let peerConnection = null;
+
+      if (this.broker && this.broker.webRtcPeer) {
+        peerConnection = this.broker.webRtcPeer.peerConnection;
+      }
+
+      return peerConnection;
+    } catch (error) {
+      return null;
+    }
+  }
+
   outboundStreamReconnect() {
     const currentRestartIntervalMs = this.restartIntervalMs;
     const stream = this.gdmStream;

bigbluebutton-html5/imports/ui/components/connection-status/service.js

@@ -10,6 +10,7 @@ import { notify } from '/imports/ui/services/notification';
 import { makeCall } from '/imports/ui/services/api';
 import AudioService from '/imports/ui/components/audio/service';
 import VideoService from '/imports/ui/components/video-provider/service';
+import ScreenshareService from '/imports/ui/components/screenshare/service';
 
 const STATS = Meteor.settings.public.stats;
 const NOTIFICATION = STATS.notification;
@@ -352,7 +353,7 @@ const addExtraInboundNetworkParameters = (data) => {
 };
 
 /**
- * Retrieves the inbound and outbound data using WebRTC getStats API.
+ * Retrieves the inbound and outbound data using WebRTC getStats API, for audio.
  * @returns An Object with format (property:type) :
  *   {
  *     transportStats: Object,
@@ -374,12 +375,23 @@ const getAudioData = async () => {
   return data;
 };
 
+/**
+ * Retrieves the inbound and outbound data using WebRTC getStats API, for video.
+ * The video stats contains the stats about all video peers (cameras) and
+ * for screenshare peer appended into one single object, containing the id
+ * of the peers with it's stats information.
+ * @returns An Object containing video data for all video peers and screenshare
+ *          peer
+ */
 const getVideoData = async () => {
-  const data = await VideoService.getStats();
+  const camerasData = await VideoService.getStats() || {};
 
-  if (!data) return {};
+  const screenshareData = await ScreenshareService.getStats() || {};
 
-  return data;
+  return {
+    ...camerasData,
+    ...screenshareData,
+  };
 };
 
 /**

bigbluebutton-html5/imports/ui/components/screenshare/service.js

@@ -12,6 +12,14 @@ import {Meteor} from "meteor/meteor";
 
 const SCREENSHARE_MEDIA_ELEMENT_NAME = 'screenshareVideo';
 
+/**
+ * Screenshare status to be filtered in getStats()
+ */
+const FILTER_SCREENSHARE_STATS = [
+  'outbound-rtp',
+  'inbound-rtp',
+];
+
 let _isSharingScreen = false;
 const _sharingScreenDep = {
   value: false,
@@ -144,6 +152,41 @@ const screenShareEndAlert = () => AudioService
 
 const dataSavingSetting = () => Settings.dataSaving.viewScreenshare;
 
+/**
+   * Get stats about all active screenshare peer.
+   * We filter the status based on FILTER_SCREENSHARE_STATS constant.
+   *
+   * For more information see:
+   * https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/getStats
+   * and
+   * https://developer.mozilla.org/en-US/docs/Web/API/RTCStatsReport
+   * @returns An Object containing the information about each active peer
+   *          (currently one, for screenshare). The returned format
+   *          follows the format returned by video's service getStats, which
+   *          considers more than one peer connection to be returned.
+   *          The format is given by:
+   *          {
+   *            peerIdString: RTCStatsReport
+   *          }
+   */
+const getStats = async () => {
+  const peer = KurentoBridge.getPeerConnection();
+
+  if (!peer) return null;
+
+  const peerStats = await peer.getStats();
+
+  const screenshareStats = {};
+
+  peerStats.forEach((stat) => {
+    if (FILTER_SCREENSHARE_STATS.includes(stat.type)) {
+      screenshareStats[stat.type] = stat;
+    }
+  });
+
+  return { screenshareStats };
+};
+
 export {
   SCREENSHARE_MEDIA_ELEMENT_NAME,
   isVideoBroadcasting,
@@ -157,4 +200,5 @@ export {
   getMediaElement,
   attachLocalPreviewStream,
   isGloballyBroadcasting,
+  getStats,
 };

bigbluebutton-html5/imports/ui/components/video-provider/service.js

@@ -854,7 +854,13 @@ class VideoService {
    *
    * For more information see:
    * https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/getStats
-   * @returns An Object containing the information about each active peer
+   * and
+   * https://developer.mozilla.org/en-US/docs/Web/API/RTCStatsReport
+   * @returns An Object containing the information about each active peer.
+   *          The returned object follows the format:
+   *          {
+   *            peerId: RTCStatsReport
+   *          }
    */
   async getStats() {
     const peers = this.getActivePeers();

bigbluebutton-html5/imports/ui/services/audio-manager/index.js

@@ -838,6 +838,8 @@ class AudioManager {
    *
    * For more information see:
    * https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/getStats
+   * and
+   * https://developer.mozilla.org/en-US/docs/Web/API/RTCStatsReport
    */
   async getStats() {
     const bridge = this.getCurrentBridge();