//TODO: Rename PlaerList to something appropriate
var PlayerList = React.createClass({
  propTypes: {
    players: React.PropTypes.array,
    game_id: React.PropTypes.number
  },

  /* TODO: DEPRECATED playerNodes */
  playerNodes: function() {
    var playerList = this;
    var playerNodes = this.props.game.players.map(function (player) {
      return (
        <Player
          key={player.id}
          onPlayHandSubmit={playerList.props.onPlayHandSubmit}
          user_id={player.user_id}
          game={playerList.props.game}
          {...player} />
      );
    });
    return playerNodes;
  },

  render: function() {
    return (
      <div id="playerList">
        <div id="top">
          <div className="game-seat position-1">
            <Seat
              {...this.props.game.seats[0]}
              game={this.props.game}
              onPlayHandSubmit={this.props.onPlayHandSubmit}
              current_user={this.props.current_user}
              onSeatSubmit={this.props.onSeatSubmit} />
          </div>
        </div>
        <div id="mid">
          <div className="game-seat position-2">
            <Seat
              {...this.props.game.seats[1]}
              game={this.props.game}
              onPlayHandSubmit={this.props.onPlayHandSubmit}
              current_user={this.props.current_user}
              onSeatSubmit={this.props.onSeatSubmit} />
          </div>
          <HandToBeat cards={this.props.game.cards_to_beat} />
          <div className="game-seat position-3">
            <Seat
              {...this.props.game.seats[2]}
              game={this.props.game}
              onPlayHandSubmit={this.props.onPlayHandSubmit}
              current_user={this.props.current_user}
              onSeatSubmit={this.props.onSeatSubmit} />
          </div>
        </div>
        <div id="bot">
          <div className="game-seat position-4">
            <Seat
              {...this.props.game.seats[3]}
              game={this.props.game}
              onPlayHandSubmit={this.props.onPlayHandSubmit}
              current_user={this.props.current_user}
              onSeatSubmit={this.props.onSeatSubmit} />
          </div>
        </div>
      </div>
    );
  }

});