import Ember from 'ember';
import noUiSlider from 'noUiSlider';

export default Ember.Component.extend({
  slider:       null,

  start:        undefined,
  step:         undefined,
  margin:       undefined,
  limit:        undefined,
  connect:      false,
  orientation:  "horizontal",
  direction:    "ltr",
  behaviour:    "tap",
  animate:      true,
  pips:         undefined,

  min: 0,
  max: 100,
  range: Ember.computed("min", "max", function() {
    return {
      min: this.get('min'),
      max: this.get('max')
    };
  }),

  formatTo:       function(value) { return value; },
  formatFrom:     function(value) { return value; },
  format: Ember.computed("formatTo", "formatFrom", function() {
    return {
      to: this.get('formatTo'),
      from: this.get('formatFrom')
    };
  }),

  didInsertElement: function() {
    let $this = this.$().get(0);

    noUiSlider.create($this, {
      start:       this.get('start'),
      step:        this.get('step'),
      margin:      this.get('margin'),
      limit:       this.get('limit'),
      range:       this.get('range'),
      connect:     this.get('connect'),
      orientation: this.get('orientation'),
      direction:   this.get('direction'),
      behaviour:   this.get('behaviour'),
      animate:     this.get('animate'),
      format:      this.get('format'),
      pips:        this.get('pips')
    });

    let slider = $this.noUiSlider;
    this.set('slider', slider);

    slider.on("change", () => {
      Ember.run(this, function () {
        this.sendAction('change', this.get('slider').get());
      });
    });

    if ( !Ember.isEmpty(this.get('slide')) ) {
      slider.on("slide", () => {
        Ember.run(this, function () {
          this.sendAction('slide', this.get('slider').get());
        });
      });
    }
  },

  willDestroyElement: function() {
    this.get('slider').destroy();
  },

  setVal: Ember.observer('start', function() {
    let slider = this.get('slider');

    if (slider) {
      var val = this.get('start');
      slider.set( val );
    }
  })
});

@@ -175,16 +175,39 @@
 efined,%0A
+  snap:         false,%0A
   margin
@@ -989,24 +989,61 @@
 et('step'),%0A
+      snap:        this.get('snap'),%0A
       margin

add snap support