     </div>
 
   handleFilter: (characteristicID, e) ->
-    value = e.target.value
-    if e.target.value is ''
-      delete @state.filters[characteristicID]
-    else
-      @state.filters[characteristicID] = value
-    @setState filters: @state.filters
+    @props.onFilter characteristicID, e.target.value
 
 ChoiceDetails = React.createClass
   displayName: 'ChoiceDetails'


Summary = React.createClass
  displayName: 'SurveySummary'
  render: ->
    null

Chooser = React.createClass
  displayName: 'Chooser'

  getDefaultProps: ->
    task: null
    onChoose: Function.prototype

  getInitialState: ->
    filters: {}

  getFilteredChoices: ->
    for choiceID in @props.task.choicesOrder
      choice = @props.task.choices[choiceID]
      rejected = false
      for filterID, filterValue of @state.filters
        if filterValue not in choice.characteristics[filterID]
          rejected = true
          break
      if rejected

    onChange: Function.prototype

  getInitialState: ->
    filters: {}
    selectedChoiceID: ''

  render: ->
    <div className="survey-task">
      {if @state.selectedChoiceID is ''
        <Chooser task={@props.task} filters={@state.filters} onFilter={@handleFilter} onChoose={@handleChoice} />
      else
        <ChoiceDetails task={@props.task} choiceID={@state.selectedChoiceID} onCancel={@clearSelection} onConfirm={@handleAnnotation} />}
    </div>

  handleFilter: (characteristicID, valueID) ->
    if valueID is ''
      delete @state.filters[characteristicID]
    else
      @state.filters[characteristicID] = valueID
    @setState filters: @state.filters

  handleChoice: (choiceID) ->
    @setState selectedChoiceID: choiceID

  clearFilters: ->
    @setState filters: {}

  clearSelection: ->
    @setState selectedChoiceID: ''

  handleAnnotation: (choice, details, e) ->
    filters = JSON.parse JSON.stringify @state.filters

    @props.annotation.value ?= []
    @props.annotation.value.push {choice, details, filters}
    @props.onChange e

    @clearFilters()
    @clearSelection()
