<?php

$headline = mb_get_block_field("video_slider_headline");
$per_slide = mb_get_block_field("video_slider_per_slide");
$infinite = mb_get_block_field("video_slider_infinite");
$auto = mb_get_block_field("video_slider_auto");
$arrows = mb_get_block_field("video_slider_arrows");
$videos = mb_get_block_field("video_slider_videos");

$id = uniqid("posts-slider-wrapper");

if ($videos) { ?>
<section <?= inoby_block_attrs($attributes, ["class" => "component-video-slider"]) ?>>
  <div class="container">
    <div class="row">
      <div class="col-12">
        <?php if ($headline) {
          echo '<h2 class="heading">' . $headline . "</h2>";
        } ?>
      </div>
    </div>
    <div class="row">
      <div class="col-12">
        <div
          <?= inoby_block_attrs($attributes, ["class" => "inoby-video-slider", "id" => $id, "data-infinite" => $infinite, "data-slides" => $per_slide, "data-automatic" => $auto]) ?>>
          <div class="videos-slider">
            <div class="videos-slider-wrap">
              <?php foreach ($videos as $video) {
                echo '<div class="video-card">';
                if ($video["thumbnail"]) {
                  echo mb_inoby_picture($video["thumbnail"], "h-6", ["sm" => "h-4", "md" => "h-6", "lg" => "h-6"]);
                }
                if ($video["src"]) {
                  echo '<a class="link link-play glightbox-item" href="' .
                    $video["src"] .
                    '"><svg width="68" height="68" viewBox="0 0 68 68" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <rect width="68" height="68" rx="34" fill="#05A597"/>
                      <path d="M33.0048 38.0096C32.6824 38.2822 32.1881 38.0572 32.182 37.6351L32.0647 29.5514C32.0585 29.1213 32.5622 28.8846 32.8893 29.1639L37.7043 33.2747C37.9388 33.4749 37.938 33.8376 37.7025 34.0367L33.0048 38.0096Z" fill="white"/>
                      </svg>';
                  echo $video["play-text"] ?? "";
                  echo "</a>";
                }
                echo "</div>";
              } ?>
            </div>
            <div class="slider-actions">
              <?php if (isset($arrows) && $arrows) {
                get_template_part("template-parts/keen-arrows", "keen-arrows", ["slider-id" => $id]);
              } ?>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
<?php } ?>
