<commit_before>class AudioPlayer extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      playing: false
    };

    this.setVolumeFn = this.setVolume.bind(this);
  }

  componentDidMount() {
    setInterval(this.updateProgressBar.bind(this), 1000);
    this.setVolume(localStorage.getItem('unadjustedVolume') || 1);
  }

  setVolume(value) {
    // Perceptual volume
    let adjustedVolume = (Math.pow(10, value) - 1) / (10 - 1);
    adjustedVolume = Math.max(0, Math.min(1, adjustedVolume));
    this.volume = adjustedVolume;
    this.refs.audioObject.volume = adjustedVolume;
    localStorage.setItem('unadjustedVolume', value);
  }

  timeFrom(time, offset) {
    const parsed = Date.parse(time) + offset;
    return Date.now() - parsed;
  }

  handlePlayButtonClick() {
    if (this.state.playing) {
      // Can't stop a live stream, thank HTML5 and sorry mobile users!
      this.refs.audioObject.pause();
      const premuteVolume = this.refs.audioObject.volume;
      this.setVolume(0);
      this.volume = premuteVolume;
      this.setState({ playing: false });
    } else {
      this.refs.audioObject.play();
      this.setVolume(this.volume);
      this.setState({ playing: true });
    }
  }

  updateProgressBar() {
    let position;
    if (this.props.nowPlaying && this.props.nowPlaying.start_time) {
      position = this.timeFrom(this.props.nowPlaying.start_time, this.props.timeOffset) / 1000;
    } else {
      position = 0;
    }

    this.setState({ position });
  }

  render() {
    const audio = React.DOM.div({ className: 'audio-player-element' },
      React.DOM.audio({ ref: 'audioObject', preload: 'none' },
        React.DOM.source({ src: this.props.source, type: 'audio/ogg' })
      )
    );

    const playButtonLabel = this.state.playing ? '🔇' : '▶'; // mute, play
    const playButton = React.DOM.div({
      className: `play-button-${this.state.playing}`,
      onClick: this.handlePlayButtonClick.bind(this),
      title: this.state.playing ? 'Click to mute' : 'Click to play'
    },
      React.DOM.p(null, playButtonLabel)
    );

    return (
      <div className="audio-player">
        <div className="controls">{playButton}</div>
        <StreamProgressBar value={this.state.position} max={this.props.nowPlaying.duration} />
        <div className="below-bar">
          <CopyLink href={this.props.source} text="🔗" />

          <div className="listener-count" title="Current listeners">
            👤 {this.props.streamInfo.listeners}
          </div>

          <Slider
            min={0}
            max={100}
            initial={localStorage.getItem('unadjustedVolume') * 100 + 0.00001 || 100}
            onChange={this.setVolumeFn}
          />
          <TimeInfo position={this.state.position} duration={this.props.nowPlaying.duration} />
        </div>
        {audio}
      </div>
    );
  }
}

AudioPlayer.defaultProps = {
  streamInfo: { listeners: '' }
};

AudioPlayer.propTypes = {
  nowPlaying: React.PropTypes.object,
  source: React.PropTypes.string,
  streamInfo: React.PropTypes.object,
  timeOffset: React.PropTypes.number<commit_msg>Check for null streamInfo for listener count<commit_after>class AudioPlayer extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      playing: false
    };

    this.setVolumeFn = this.setVolume.bind(this);
  }

  componentDidMount() {
    setInterval(this.updateProgressBar.bind(this), 1000);
    this.setVolume(localStorage.getItem('unadjustedVolume') || 1);
  }

  setVolume(value) {
    // Perceptual volume
    let adjustedVolume = (Math.pow(10, value) - 1) / (10 - 1);
    adjustedVolume = Math.max(0, Math.min(1, adjustedVolume));
    this.volume = adjustedVolume;
    this.refs.audioObject.volume = adjustedVolume;
    localStorage.setItem('unadjustedVolume', value);
  }

  timeFrom(time, offset) {
    const parsed = Date.parse(time) + offset;
    return Date.now() - parsed;
  }

  handlePlayButtonClick() {
    if (this.state.playing) {
      // Can't stop a live stream, thank HTML5 and sorry mobile users!
      this.refs.audioObject.pause();
      const premuteVolume = this.refs.audioObject.volume;
      this.setVolume(0);
      this.volume = premuteVolume;
      this.setState({ playing: false });
    } else {
      this.refs.audioObject.play();
      this.setVolume(this.volume);
      this.setState({ playing: true });
    }
  }

  updateProgressBar() {
    let position;
    if (this.props.nowPlaying && this.props.nowPlaying.start_time) {
      position = this.timeFrom(this.props.nowPlaying.start_time, this.props.timeOffset) / 1000;
    } else {
      position = 0;
    }

    this.setState({ position });
  }

  render() {
    const audio = React.DOM.div({ className: 'audio-player-element' },
      React.DOM.audio({ ref: 'audioObject', preload: 'none' },
        React.DOM.source({ src: this.props.source, type: 'audio/ogg' })
      )
    );

    const playButtonLabel = this.state.playing ? '🔇' : '▶'; // mute, play
    const playButton = React.DOM.div({
      className: `play-button-${this.state.playing}`,
      onClick: this.handlePlayButtonClick.bind(this),
      title: this.state.playing ? 'Click to mute' : 'Click to play'
    },
      React.DOM.p(null, playButtonLabel)
    );

    return (
      <div className="audio-player">
        <div className="controls">{playButton}</div>
        <StreamProgressBar value={this.state.position} max={this.props.nowPlaying.duration} />
        <div className="below-bar">
          <CopyLink href={this.props.source} text="🔗" />

          <div className="listener-count" title="Current listeners">
            {this.props.streamInfo ? `👤 ${this.props.streamInfo.listeners}` : ''}
          </div>

          <Slider
            min={0}
            max={100}
            initial={localStorage.getItem('unadjustedVolume') * 100 + 0.00001 || 100}
            onChange={this.setVolumeFn}
          />
          <TimeInfo position={this.state.position} duration={this.props.nowPlaying.duration} />
        </div>
        {audio}
      </div>
    );
  }
}

AudioPlayer.defaultProps = {
  streamInfo: { listeners: '' }
};

AudioPlayer.propTypes = {
  nowPlaying: React.PropTypes.object,
  source: React.PropTypes.string,
  streamInfo: React.PropTypes.object,
  timeOffset: React.PropTypes.number
{'fraction_non_alphanumeric': 0.14502130345589395, 'fraction_numerical': 0.01136184314344327, 'mean_word_length': 2.7436503248671, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 27, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5446978', 'n_tokens_mistral': 2056, 'n_tokens_neox': 1952, 'n_words': 358}