var PlayerControls = React.createClass({

  selectedCardIds: function() {
    var checkedCards = $(':checkbox:checked[name^=player_card_ids]');
    var card_ids = {player_card_ids: checkedCards.map(function(card){ return this.value; }).toArray() };
    return card_ids;
  },

  handlePass: function(e) {
    e.preventDefault();
    this.props.onPlayHandSubmit({game: {hand_type: 'pass'}});
  },

  handleSubmit: function(e) {
    e.preventDefault();
    this.props.onPlayHandSubmit(this.selectedCardIds());
  },

  render: function() {
    return (
      <form
        id={"player_controls_" + this.props.player_id}
        method="post"
        action={"/games/" + this.props.game_id + "/play_hand"}
        acceptCharset="UTF-8"
        onSubmit={this.handleSubmit}>

        <input type="hidden" value="patch" name="_method"></input>
        <Inventory ref="inventory" cards={this.props.inventory} player_id={this.props.id} />
        <input id={"play_hand_button_" + this.props.player_id}
          disabled={this.props.controlling_player_id == this.props.player_id ? null : 'disabled'}
          type="submit"
          value="Play Hand"
          name="commit">
        </input>
        <input id={"pass_hand_button_" + this.props.player_id}
          disabled={this.props.controlling_player_id == this.props.player_id ? null : 'disabled'}
          type="submit"
          onClick={this.handlePass}
          value="Pass"
          name="pass">
        </input>
      </form>
    );
  }
});