noesya/osuny

<%
  block_class = block_html_class(block)
  if !block.template.elements.one?
    block_class += ' with-carousel'
  end
%>

<div class="<%= block_class %>">
  <div class="container">
    <div class="block-content">
      <div class="testimonials">
        <% if !block.template.elements.one? %>
          <div class="splide"
              data-splide='{
                  "arrows":false,
                  "autoplay":true,
                  "pauseOnHover":false,
                  "pauseOnFocus":true,
                  "type":"loop",
                  "autoHeight":true,
                  "interval":8000
                }'
              >
            <div class="splide__slider">
              <div class="splide__track">
                <div class="splide__list">
        <% end %>

        <% block.template.elements.each do |element| %>
          <% element_blob = element.photo_component.blob %>
          <figure <% if !block.template.elements.one? %> class="splide__slide" <% end %>>
            <blockquote>
              <p><%= block_component_show block, :text, template: element %></p>
            </blockquote>
            <% if element_blob.present? || element.author || element.job %>
              <figcaption>
                <% if element_blob.present? %>
                  <div class="avatar">
                    <%= kamifusen_tag element_blob, width: 600, class: 'img-fluid mb-1', alt: element.author %>
                  </div>
                <% end %>
                <% if element.author || element.job %>
                  <p>
                    <% if element.author %>
                      <span class="signature"><%= block_component_show block, :author, template: element %></span>
                    <% end %>
                    <% if element.job %>
                      <span class="meta"><%= block_component_show block, :job, template: element %></span>
                    <% end %>
                  </p>
                <% end %>
              </figcaption>
            <% end %>
          </figure>
        <% end %>
        <% if !block.template.elements.one? %>
                </div>
              </div>
            </div>

            <button class="splide__toggle">
              <span class="splide__toggle__play"></span>
              <span class="splide__toggle__pause"></span>
            </button>
          </div>
      <% end %>
      </div>
    </div>
  </div>
</div>