Carbon Slideshow plugin

carousel.js

(function() {
  'use strict';
  const carouselContainer = document.getElementById('carousel-container');
  const slides = carouselContainer.getElementsByClassName('carousel-slide');
  const images = new Array;
  var slide = 0;
  for (let i = 0; i < slides.length; i++) {
    images.push(slides[i].style.backgroundImage);
  }

  const changeSlide = function() {
    carouselContainer.style.backgroundImage = images[slide];
    slide++;
    console.log(slide);
    if (slide === slides.length) {
      slide = 0;
    }
  }

  setInterval(changeSlide, 2000);
})();

carousel.php

<?php
use Carbon_Fields\Container;
use Carbon_Fields\Field;

// Carousel Meta

Container::make('post_meta', 'Carousel')
  ->show_on_post_type('page')
  ->set_priority('high')
  ->add_fields(array(
    Field::make('complex', 'carousel')
      ->add_fields(array(
    Field::make('text', 'Title'),
    Field::make('image', 'Image'),
      ))->set_layout('tabbed-horizontal')
  ));

functions.php

<?php // Import carbon field configuration
add_action('carbon_register_fields', 'wpd_register_meta');
function wpd_register_meta() {
  include_once(dirname(__FILE__) . '/includes/carousel.php');
}

if ( ! function_exists( 'carbon_get_post_meta' ) ) {
    function carbon_get_post_meta( $id, $name, $type = null ) {
        return false;
    }
}

if ( ! function_exists( 'carbon_get_the_post_meta' ) ) {
    function carbon_get_the_post_meta( $name, $type = null ) {
        return false;
    }
}

if ( ! function_exists( 'carbon_get_theme_option' ) ) {
    function carbon_get_theme_option( $name, $type = null ) {
        return false;
    }
}

<?php function carousel() {
  $slides = carbon_get_post_meta(get_the_ID(), 'carousel', 'complex');
  $slide_count = 0;
  if ( $slides ) { ?>
   <div id="carousel-container">
    <?php foreach ($slides as $slide) { ?>
     <?php $image = wp_get_attachment_url( $slide['image'] ); ?>
      <div class="carousel-slide slide-<?php echo $slide_count; ?>" style="z-index: -9999px; background-image: url(<?php echo $image; ?>)"></div>
    <?php $slide_count++; } ?>
    </div>
  <?php }
}

add_action('genesis_after_header', 'carousel');