<?php
/**
 * The blog slider template
 * If you want to override this template by your custom template in the theme folder,
 * just create the 'sliderkits' folder in the theme folder,
 * then, copy this file to sliderkits folder.
 * @version 1.0.0
 * @package SliderKits
 */

$posts_number = $sk_data->posts_number;
$displayas = $sk_data->displayas;
$featuredby = $sk_data->featuredby;
$categories = $sk_data->categories;
$tags = $sk_data->tags;
$posts = $sk_data->posts;
$orderby = $sk_data->orderby;
$order = $sk_data->order;
$button_text = $sk_data->button_text;

$autoplay         =   $sk_data->autoplay;
$autoplaySpeed    =   $sk_data->autoplaySpeed;
$arrows           =   $sk_data->arrows;
$infinite         =   $sk_data->infinite;
$swipe            =   $sk_data->swipe;
$touchMove        =   $sk_data->touchMove;
$speed            =   $sk_data->speed;
$hover_animation  =   $sk_data->button_hover_animation;

$sk_post_query_params = array(
   'posts_per_page' => (int)$posts_number - 1,
   'post_type' => 'post',
   'orderby' => $orderby,
   'order' => $order
);

if( $displayas === 'featured' ) {
  if( $featuredby === 'categories' ) {
     $sk_post_query_params['category__in'] = $categories;
  }
  if( $featuredby === 'tags' ) {
     $sk_post_query_params['tag__in'] = $tags;
  }
  if( $featuredby === 'posts' ) {
     $sk_post_query_params['post__in'] = $posts;
  }
}

$sk_blog_slider_query = new WP_Query( $sk_post_query_params );

$blog_slider_config = json_encode([
  'autoplay' => $autoplay === 'true'? true: false,
  'autoplaySpeed' => $autoplaySpeed,
  'infinite' => $infinite === 'true'? true: false,
  'arrows' => $arrows === 'true'? true: false,
  'dots'   => true,
  'swipe'  => $swipe === 'true'? true: false,
  'speed'  => $speed,
  'touchMove' => $touchMove === 'true'? true: false,
  'fade'   => false,
  'lazyLoad' => 'ondemand',
  'slidesToShow' => 1,
  'responsive' => [
    [
      "breakpoint" => 767,
      "settings" => [
        "dots" => false
      ]
    ]
  ]
]);

if ( $sk_blog_slider_query->have_posts() ) :
?>

<div class="sk-slick-blog" data-slick='<?php echo esc_attr( $blog_slider_config );?>'>
 <?php  while( $sk_blog_slider_query->have_posts() ) : $sk_blog_slider_query->the_post(); ?>
  <div class="sk-slick-item d-flex align-items-center" data-thumbnail="<?php echo get_the_post_thumbnail_url() ? esc_url( get_the_post_thumbnail_url() ) : SK_PLACEHOLDER_IMG;?>">
    <div class="sk-slick-item__container container">
      <div class="col-md-6 offset-md-1">
         <h1 class="sk-heading sk-wrap-lines"><?php the_title(); ?></h1>
         <div class="sk-content sk-wrap-lines">
            <?php the_excerpt(); ?>
         </div>

         <?php
           if( $button_text ):
         ?>
         <div class="sk-button-container">
           <a href="<?php the_permalink(); ?>" class="elementor-button sk-button elementor-animation-<?php echo esc_attr( $hover_animation ); ?>"><?php echo esc_html( $button_text );?></a>
         </div>
         <?php endif; ?>
      </div>
    </div>
    <div class="sk-slick-item__overlay"></div>
    <div class="sk-slick-item__bg" style="background-image: url(<?php echo get_the_post_thumbnail_url() ? esc_url( get_the_post_thumbnail_url() ) : SK_PLACEHOLDER_IMG;?>);"></div>
  </div>
  <?php
    endwhile;
    wp_reset_postdata();
  ?>
</div>
<?php else: ?>
<div class="sk-slick-blog">
  <?php echo esc_html__( 'No Posts Found','sliderkits' ); ?>
</div>
<?php endif; ?>