{"size": 1269, "ext": "js", "max_stars_repo_path": "src/client/debug/playerinfo.js", "max_stars_repo_name": "jeanfredrik/boardgame.io", "max_stars_repo_stars_event_min_datetime": "2019-05-07T12:02:09.000Z", "max_stars_repo_stars_event_max_datetime": "2019-11-17T02:18:55.000Z", "max_issues_repo_path": "src/client/debug/playerinfo.js", "max_issues_repo_name": "jeanfredrik/boardgame.io", "max_issues_repo_issues_event_min_datetime": "2018-10-16T15:57:44.000Z", "max_issues_repo_issues_event_max_datetime": "2019-02-22T01:12:45.000Z", "max_forks_repo_path": "src/client/debug/playerinfo.js", "max_forks_repo_name": "jeanfredrik/boardgame.io", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 4, "max_issues_count": 29, "max_forks_count": null, "avg_line_length": 22.2631578947, "max_line_length": 66, "alphanum_fraction": 0.5886524823}
/*
 * Copyright 2018 The boardgame.io Authors
 *
 * Use of this source code is governed by a MIT-style
 * license that can be found in the LICENSE file or at
 * https://opensource.org/licenses/MIT.
 */

import React from 'react';
import PropTypes from 'prop-types';

/**
 * Component that renders information about the
 * players in the game (whose turn it is etc.).
 */
export class PlayerInfo extends React.Component {
  static propTypes = {
    ctx: PropTypes.any.isRequired,
    playerID: PropTypes.any,
    onClick: PropTypes.func,
  };

  onClick = playerID => {
    const arg = playerID == this.props.playerID ? null : playerID;
    this.props.onClick(arg);
  };

  render() {
    let players = [];
    for (let i = 0; i < this.props.ctx.numPlayers; i++) {
      const playerID = i + '';

      let className = 'player';

      if (playerID === this.props.ctx.currentPlayer) {
        className += ' current';
      }

      if (playerID === this.props.playerID) {
        className += ' active';
      }

      players.push(
        <div
          className={className}
          key={i}
          onClick={() => this.onClick(playerID)}
        >
          {playerID}
        </div>
      );
    }

    return <div className="player-box">{players}</div>;
  }
}
