opentok-react-native/lib/module/OTSubscriberView.js

Vonage Video client SDK for React Native

"use strict";

import React from 'react';
import PropTypes from 'prop-types';
import { OT } from "./OT.js";
import OTRNSubscriber from './OTSubscriberNativeComponent';
import OTContext from "./contexts/OTContext.js";
import { jsx as _jsx } from "react/jsx-runtime";
export default class OTSubscriberView extends React.Component {
  static defaultProps = {
    subscribeToAudio: true,
    subscribeToVideo: true,
    scaleBehavior: 'fill',
    style: {
      flex: 1
    }
  };
  sessionId = this.context.sessionId;
  eventHandlers = {};
  constructor(props, context) {
    super(props, context);
    this.eventHandlers = props.eventHandlers;
    this.style = props.style;
  }
  getRtcStatsReport() {
    //NOSONAR - this method is exposed externally
    OT.getSubscriberRtcStatsReport(this.sessionId);
  }
  componentWillUnmount() {
    OT.removeSubscriber(this.sessionId, this.props.streamId);
  }
  render() {
    const {
      streamId
    } = this.props;
    const subscriberProperties = this.context.subscriberProperties;
    const eventHandlers = this.context.eventHandlers;
    const streamProperties = this.context.streamProperties ? this.context.streamProperties[streamId] : undefined;
    let {
      audioVolume,
      preferredFrameRate,
      preferredResolution,
      subscribeToCaptions
    } = subscriberProperties;
    if (streamProperties) {
      ({
        audioVolume,
        preferredFrameRate,
        preferredResolution,
        subscribeToCaptions
      } = streamProperties);
    }
    const subscribeToVideo = streamProperties?.subscribeToVideo ?? subscriberProperties?.subscribeToVideo ?? true;
    const subscribeToAudio = streamProperties?.subscribeToAudio ?? subscriberProperties?.subscribeToAudio ?? true;
    const scaleBehavior = streamProperties?.scaleBehavior ?? subscriberProperties?.scaleBehavior ?? 'fill';
    const style = streamProperties?.style || this.context.style;
    return /*#__PURE__*/_jsx(OTRNSubscriber, {
      sessionId: this.sessionId,
      streamId: streamId,
      subscribeToAudio: subscribeToAudio,
      subscribeToVideo: subscribeToVideo,
      scaleBehavior: scaleBehavior,
      subscribeToCaptions: subscribeToCaptions,
      preferredFrameRate: preferredFrameRate,
      preferredResolution: preferredResolution,
      audioVolume: audioVolume,
      onAudioLevel: event => {
        eventHandlers.audioLevel?.(event.nativeEvent);
      },
      onAudioNetworkStats: event => {
        eventHandlers.audioNetworkStats?.(event.nativeEvent);
      },
      onSubscriberConnected: event => {
        eventHandlers.subscriberConnected?.(event.nativeEvent);
      },
      onRtcStatsReport: event => {
        eventHandlers.rtcStatsReport?.(event.nativeEvent);
      },
      onVideoEnabled: event => {
        eventHandlers.videoEnabled?.(event.nativeEvent);
      },
      onVideoNetworkStats: event => {
        eventHandlers.videoNetworkStats?.(event.nativeEvent);
      },
      style: style
    });
  }
}
OTSubscriberView.propTypes = {
  streamId: PropTypes.string.isRequired
};
OTSubscriberView.contextType = OTContext;
//# sourceMappingURL=OTSubscriberView.js.map