56 lines
3.3 KiB
PHP
56 lines
3.3 KiB
PHP
<?php
|
|
|
|
namespace AKSRT\WidgetSystem\Renderers;
|
|
|
|
use AKSRT\WidgetSystem\RendererHelpers;
|
|
|
|
defined('ABSPATH') || exit;
|
|
|
|
/** Render full sliders and the slider/media combination. */
|
|
final class SliderRenderer {
|
|
public static function render(string $slug, array $instance, array $context = []): string {
|
|
unset($context);
|
|
$slides = '';
|
|
foreach ((array) $instance['slides'] as $slide) {
|
|
if (!is_array($slide) || (empty($slide['background']) && empty($slide['background_video']))) {
|
|
continue;
|
|
}
|
|
$link = RendererHelpers::link((array) ($slide['link'] ?? []));
|
|
$media = !empty($slide['background_video'])
|
|
? '<video src="' . esc_url((string) $slide['background_video']) . '" muted loop playsinline preload="metadata"></video>'
|
|
: RendererHelpers::image((string) $slide['background'], (string) ($slide['title'] ?? ''), 'swiper-lazy');
|
|
$layers = '';
|
|
foreach ((array) ($slide['layers'] ?? []) as $layer) {
|
|
if (!empty($layer['image'])) {
|
|
$layers .= '<img class="aksrt-slide-layer" src="' . esc_url((string) $layer['image']) . '" alt="" data-swiper-parallax="' . (int) ($layer['parallax'] ?? 0) . '" data-swiper-parallax-scale="' . esc_attr((string) ((float) ($layer['scale'] ?? 100) / 100)) . '">';
|
|
}
|
|
}
|
|
$copy = '<div class="aksrt-slide-copy is-' . esc_attr((string) ($slide['text_align'] ?? 'left-bottom')) . '"><h3>' . esc_html((string) ($slide['title'] ?? '')) . '</h3><p>' . esc_html((string) ($slide['description'] ?? '')) . '</p></div>';
|
|
$body = $media . $layers . $copy;
|
|
if ($link['url']) {
|
|
$body = '<a href="' . $link['url'] . '"' . RendererHelpers::link_attrs($link) . '>' . $body . '</a>';
|
|
}
|
|
$slides .= '<div class="swiper-slide' . (!empty($slide['hide_mobile']) ? ' aksrt-slide--hide-mobile' : '') . '">' . $body . '</div>';
|
|
}
|
|
if ($slides === '') {
|
|
return RendererHelpers::empty_state(__('请配置幻灯片', 'aksrt'));
|
|
}
|
|
$slider = '<div class="swiper aksrt-widget-swiper aksrt-slider" data-aksrt-swiper="slider" data-direction="' . esc_attr((string) $instance['direction']) . '" data-effect="' . esc_attr((string) $instance['effect']) . '" data-loop="' . (!empty($instance['loop']) ? '1' : '0') . '" data-autoplay="' . (!empty($instance['autoplay']) ? '1' : '0') . '" data-interval="' . ((int) $instance['interval'] * 1000) . '" data-speed="' . (int) $instance['speed'] . '" data-space="' . (int) $instance['spacebetween'] . '" style="--aksrt-slider-height:' . (int) $instance['pc_height'] . 'px;--aksrt-slider-height-m:' . (int) $instance['m_height'] . 'px"><div class="swiper-wrapper">' . $slides . '</div>';
|
|
if (!empty($instance['button'])) {
|
|
$slider .= '<button type="button" class="swiper-button-prev" aria-label="' . esc_attr__('上一张', 'aksrt') . '"></button><button type="button" class="swiper-button-next" aria-label="' . esc_attr__('下一张', 'aksrt') . '"></button>';
|
|
}
|
|
if (!empty($instance['pagination'])) {
|
|
$slider .= '<div class="swiper-pagination"></div>';
|
|
}
|
|
$slider .= '</div>';
|
|
if ($slug !== 'slider_media_combo') {
|
|
return $slider;
|
|
}
|
|
$cards = '';
|
|
foreach ((array) ($instance['side_cards'] ?? []) as $card) {
|
|
$cards .= RendererHelpers::card_media((array) $card);
|
|
}
|
|
return '<div class="aksrt-slider-combo"><div class="aksrt-slider-combo__main">' . $slider . '</div><aside class="aksrt-slider-combo__side">' . $cards . '</aside></div>';
|
|
}
|
|
}
|