Ember slider no working not working as expected

I build a custom carousel in ember and Jquery. Is pretty much straight forward. when click nextImage the slider move the the next image and when clicked previewsImage the slider goes back to the previews image. That part is working perfect. The problem is that when clicked on goToImage(AKA Dots controllers) the images don't move to the corresponding dots order. Look like my logic may have some problems in the.

 <nav class="dots">
       <a href="#" class="carousel-bullet "{{action 'goToImage' 1}}></a>
       <a href="#" class="carousel-bullet"{{action 'goToImage' 2}}></a>
       <a href="#" class="carousel-bullet"{{action 'goToImage' 3}}></a>
    </nav>

    App.SliderComponent = Ember.Component.extend({
        currentIndex: 0,

        actions: {
            runSlider: function(x){
                 var currentIndex = this.get('currentIndex');
                var indexDiff = this.$().find('.carousel ul li').index();
                var carousel = this.$().find('.carousel ul'),
                    slideWidth = carousel.find('li').width();
                    console.log(indexDiff);
                if(x == 1){
                    carousel.animate({left: - slideWidth }, 200, function () {
                        carousel.find('li:first-child').appendTo(carousel);
                        carousel.css('left', '');
                    });
                }else{
                    carousel.animate({left: + slideWidth}, 200, function () {
                        carousel.find('li:last-child').prependTo(carousel);
                        carousel.css('left', '');
                    });
                }
            }, 
            nextImage: function(){
                this.send('runSlider', 1);
            },
           previewsImage: function(){
                this.send('runSlider',0);
            },
            goToImage: function(newIndex){
                var currentIndex = this.get('currentIndex')
                var indexDiff = newIndex - currentIndex;
                var direction = (newIndex > currentIndex) ? 'nextImage' : 'previewsImage';
                for (var i = 0; i < indexDiff; i++){
                    this.send(direction);
                }
            }
        }
    });