import Ember from 'ember';

const {
  computed,
  computed: {
    reads,
  },
  observer,
  run: {
    cancel,
    later,
  }
} = Ember;

export default Ember.Component.extend({
  classNameBindings: ['isActive'],
  isActive: false,
  defaultLabel: 'Label',
  currentLabel: reads('defaultLabel'),
  updateLabel: observer('isActive', function () {
    let isActive = this.get('isActive');
    if (isActive) {
      this.set('currentLabel', 'ON');
    } else {
      this.set('currentLabel', 'OFF');
    }
    
    this._timer = later(this, 'resetLabel', 1000);
  }),

  resetLabel() {
    this.set('currentLabel', this.get('defaultLabel'));
  },

  willDestroy() {
    if (this._timer) {
      cancel(this._timer);
    }
  },

  click() {
    this.sendAction();
  }
});