context = window
rest = window.JK.Rest()
logger = context.JK.logger

@AgeRangeList = React.createClass({
  ages: [0, 1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,25,30,35,40,45,50,55,60,65,70,75,80,85,90,95,100]
  agesJsx: []
  propTypes: {
    onItemChanged: React.PropTypes.func.isRequired
  }

  componentWillMount: () ->
    @agesJsx = []
    for age in @ages
      @agesJsx.push(`<option key={age} value={age}>{age == 0 ? 'Any' : age}</option>`)

  getInitialState: () ->
    {selectedAge:@props.selectedAge}

  componentWillReceiveProps: (nextProps) ->
    @setState({selectedAge: nextProps.selectedAge})

  onChanged: (e) ->
    val = $(e.target).val()
    @setState({selectedAge: val })
    this.props.onItemChanged(this.props.objectName, val)

  render: () ->
    `<select className="AgeRangeList react-component" onChange={this.onChanged} value={this.state.selectedAge}>
      {this.agesJsx}
    </select>`
})