Slick Carousel с автоматическим воспроизведением видео slide1

Question

У меня скользкая карусель, на первом слайде я автоматически воспроизводлю видео. Это работает, когда пятно начинается, показывает 2-й слайд, а затем возвращается к 1-му. Но я не могу заставить это работать на pageload, я думаю, это потому, что я использую afterChange. Вы можете увидеть мой пример здесь

JavaScript для стрельбы:

$('.top-carousel').slick({
    slidesToShow: 1,
    slidesToScroll: 1,
    autoplay: true,
    autoplaySpeed: 4000,
    dots: true,
    pauseOnHover: false,
    infinite: true,
    arrows: false,
});

  $('.top-carousel').on('afterChange', function(event, slick, currentSlide){
    if ($("#slick-slide00").hasClass("slick-active")) {
      $('.top-carousel').slick('slickPause');
      theVideo.play();
    }
  });

  document.getElementById('theVideo').addEventListener('ended',myHandler,false);

  function myHandler(e) {
    $('.top-carousel').slick('slickPlay');
  } 

У кого-нибудь есть идеи, пожалуйста?