Flickity Carousel - autoPlay stops after user interaction

I have a Flickity Carousel which contains a testimonial. The carousel is set to autoplay.

The problem is if the user clicks on the dots or on the next / previous button the autoPlay stops.

This is what I have:

JS

var flkty = new Flickity( '.main-gallery', {
  cellAlign: 'left',
  contain: true,
  wrapAround: true,
  prevNextButtons: true,
  autoPlay: 5000
});

HTML

  <div class="main-gallery">
  <div class="gallery-cell">
    <div class="testimonial">
      <p class="testimonial-quote" style="font-style: italic;">"Comment."</p>
      <span class="testimonial-author">Author</span>
    </div>
  </div>
  <div class="gallery-cell">
     <div class="testimonial">
      <p class="testimonial-quote">"Comment."</p>
      <span class="testimonial-author">Author</span>
    </div>
  </div>
  <div class="gallery-cell">
        <div class="testimonial">
      <p class="testimonial-quote">"Comment."</p>
      <span class="testimonial-author">Author</span>
    </div>
  </div>
</div>

Please assist me to let the autoPlay continue and don't stop after a user is interacting with the dots or next/prev button.

Solution 1:

I solved this question the following way:

• Catch 'pointerUp' event that is called after you interact with the slider.
• Resume auto play when event is fired.

The following code demonstrates this behavior:

currentFlickity.on('pointerUp', function (event, pointer) {
        currentFlickity.player.play();
    });