import Ember from 'ember';
import layout from '../templates/components/html-select';

export default Ember.Component.extend({
  layout: layout,
  
  didReceiveAttrs(/*attrs*/) {
    this._super(...arguments);
    var content = this.get('content');

    if (!content) {
      this.set('content', []);
      // TODO ember warn no content set
    }
    // set it to the correct value of the selection
    this.selectedValue = Ember.computed('mainComponent.model.' + this.get('mainComponent.property'), function() {
      return this.get('mainComponent.model.' + this.get('mainComponent.property'));
    });
  },

  actions: {
    change() {
      
      const selectedEl = this.$('select')[0];
      const selectedIndex = selectedEl.selectedIndex;
      const content = this.get('mainComponent.content');
      const selectedValue = content[selectedIndex];
      const selectedID = selectedValue[this.get('mainComponent.optionValuePath')];
      this.set('selectedValue', selectedValue);
      this.set('mainComponent.model.' + this.get('mainComponent.property'), selectedID);
      const changeAction = this.get('action');
      if(changeAction){
        changeAction(selectedValue);
      }
      else{
        // TODO make deprecate here so everyone switches to new action syntax
      }
    }
  }
});

@@ -682,36 +682,34 @@
 ect')%5B0%5D;%0A      
-cons
+le
 t selectedIndex 
@@ -736,16 +736,312 @@
 dIndex;%0A
+      // check whether we show prompt the the correct to show index is one less%0A      // when selecting prompt don't change anything%0A      if(this.get('mainComponent.prompt'))%7B%0A        if(selectedIndex != 0)%7B%0A          selectedIndex--;%0A        %7D%0A        else%7B%0A          return;%0A        %7D%0A      %7D%0A
       co
@@ -1228,56 +1228,8 @@
 )%5D;%0A
-      this.set('selectedValue', selectedValue);%0A
     
@@ -1413,21 +1413,18 @@
 selected
-Value
+ID
 );%0A     

remove wrong behavior of when using prompts with select elements