1. module react-youtube
   1. function react-youtube.default (props)

module react-youtube

function react-youtube.default (props)

• description and source-code

  function YouTube(props) {
    _classCallCheck(this, YouTube);
  
    var _this = _possibleConstructorReturn(this, (YouTube.__proto__ || Object.getPrototypeOf(YouTube)).call(this, props));
  
    _this.onPlayerReady = function (event) {
      return _this.props.onReady(event);
    };
  
    _this.onPlayerError = function (event) {
      return _this.props.onError(event);
    };
  
    _this.onPlayerStateChange = function (event) {
      _this.props.onStateChange(event);
      switch (event.data) {
  
        case YouTube.PlayerState.ENDED:
          _this.props.onEnd(event);
          break;
  
        case YouTube.PlayerState.PLAYING:
          _this.props.onPlay(event);
          break;
  
        case YouTube.PlayerState.PAUSED:
          _this.props.onPause(event);
          break;
  
        default:
          return;
      }
    };
  
    _this.onPlayerPlaybackRateChange = function (event) {
      return _this.props.onPlaybackRateChange(event);
    };
  
    _this.onPlayerPlaybackQualityChange = function (event) {
      return _this.props.onPlaybackQualityChange(event);
    };
  
    _this.createPlayer = function () {
      // do not attempt to create a player server-side, it won't work
      if (typeof document === 'undefined') return;
      // create player
      var playerOpts = _extends({}, _this.props.opts, {
        // preload the `videoId` video if one is already given
        videoId: _this.props.videoId
      });
      _this.internalPlayer = (0, _youtubePlayer2.default)(_this.container, playerOpts);
      // attach event handlers
      _this.internalPlayer.on('ready', _this.onPlayerReady);
      _this.internalPlayer.on('error', _this.onPlayerError);
      _this.internalPlayer.on('stateChange', _this.onPlayerStateChange);
      _this.internalPlayer.on('playbackRateChange', _this.onPlayerPlaybackRateChange);
      _this.internalPlayer.on('playbackQualityChange', _this.onPlayerPlaybackQualityChange);
    };
  
    _this.resetPlayer = function () {
      return _this.internalPlayer.destroy().then(_this.createPlayer);
    };
  
    _this.updatePlayer = function () {
      _this.internalPlayer.getIframe().then(function (iframe) {
        iframe.setAttribute('id', _this.props.id);
        iframe.setAttribute('class', _this.props.className);
      });
    };
  
    _this.updateVideo = function () {
      if (typeof _this.props.videoId === 'undefined' || _this.props.videoId === null) {
        _this.internalPlayer.stopVideo();
        return;
      }
  
      // set queueing options
      var autoplay = false;
      var opts = {
        videoId: _this.props.videoId
      };
      if ('playerVars' in _this.props.opts) {
        autoplay = _this.props.opts.playerVars.autoplay === 1;
        if ('start' in _this.props.opts.playerVars) {
          opts.startSeconds = _this.props.opts.playerVars.start;
        }
        if ('end' in _this.props.opts.playerVars) {
          opts.endSeconds = _this.props.opts.playerVars.end;
        }
      }
  
      // if autoplay is enabled loadVideoById
      if (autoplay) {
        _this.internalPlayer.loadVideoById(opts);
        return;
      }
      // default behaviour just cues the video
      _this.internalPlayer.cueVideoById(opts);
    };
  
    _this.refContainer = function (container) {
      _this.container = container;
    };
  
    _this.container = null;
    _this.internalPlayer = null;
    return _this;
  }

• example usage

  n/a