App.MySelectComponent = Ember.Component.extend
  # possible passed-in values with their defaults:
  layoutName: 'form/my-select'
  content: null
  prompt: null
  optionValuePath: 'id'
  optionLabelPath: 'title'
  action: Ember.K # action to fire on change
  selection: null
  identity: true

  # shadow the passed-in `selection` to avoid
  # leaking changes to it via a 2-way binding
  #_selection: Ember.computed.reads('selection')

  setContent: (->
    @set('content', []) unless @get('content')
  ).on('init')

  didRender: ->
    # Set select to current value if can be found
    if @get('identity')
      key = @get('optionValuePath')
      index = @get('content').mapBy(key).indexOf(@get("selection.#{key}")) # Ember 2.0.1 cannot find real objects yet
    else
      index = @get('content').indexOf(@get('selection'))
    if index > -1
      @$('select:first').prop('selectedIndex', index)

  actions:
    showDebugger: -> debugger
    change: ->
      selectedIndex = @$('select:first').get(0).selectedIndex

      # decrement index by 1 if we have a prompt
      hasPrompt = !!@get('prompt')
      contentIndex = if hasPrompt then selectedIndex - 1 else selectedIndex

      selection = @get('content').toArray()[contentIndex]

      # set the local, shadowed selection to avoid leaking
      # changes to `selection` out via 2-way binding
      @set('selection', selection)

      #changeCallback(selection) if changeCallback = @get('action')
