277 lines
10 KiB
PHP
277 lines
10 KiB
PHP
<?php
|
||
/**
|
||
* Shared graphic / cover card (zibll zib_graphic_card parity).
|
||
*
|
||
* Used by term cards, cover cards, term aggregation thumbs, etc.
|
||
*
|
||
* @package AKSRT
|
||
*/
|
||
|
||
defined('ABSPATH') || exit;
|
||
|
||
if (!function_exists('aksrt_graphic_card')) :
|
||
/**
|
||
* Render a graphic cover card.
|
||
*
|
||
* @param array<string,mixed> $args {
|
||
* @type string $type style-1|style-2|style-3|style-4|''.
|
||
* @type string $class Extra classes on .graphic.
|
||
* @type string $img Image URL.
|
||
* @type string $video Optional video URL (desktop).
|
||
* @type string $alt Image alt.
|
||
* @type array{url?:string,target?:string}|string $link Link.
|
||
* @type string $text1 Primary text.
|
||
* @type string $text2 Secondary text.
|
||
* @type string $text3 Tertiary / badge text (HTML allowed for icon+count).
|
||
* @type string $more Extra absolute HTML (badge etc).
|
||
* @type bool $lazy Use the Zibll lazySizes contract.
|
||
* @type int|float $height_scale Padding-bottom % (0 = default CSS).
|
||
* @type int|float $mask_opacity 0–100 overlay opacity.
|
||
* @type string $hide pc|m|'' hide on device.
|
||
* }
|
||
* @param bool $echo Echo instead of return.
|
||
*/
|
||
function aksrt_graphic_card(array $args = [], bool $echo = false): string {
|
||
$defaults = [
|
||
'type' => '',
|
||
'hide' => '',
|
||
'class' => 'mb10',
|
||
'img' => '',
|
||
'video' => '',
|
||
'alt' => __('图片', 'aksrt'),
|
||
'link' => [
|
||
'url' => '',
|
||
'target' => '',
|
||
],
|
||
'text1' => '',
|
||
'text2' => '',
|
||
'text3' => '',
|
||
'more' => '',
|
||
'lazy' => true,
|
||
'height_scale' => 0,
|
||
'mask_opacity' => 0,
|
||
];
|
||
$args = wp_parse_args($args, $defaults);
|
||
|
||
$img_url = trim((string) $args['img']);
|
||
$video_url = trim((string) $args['video']);
|
||
if ($img_url === '' && $video_url === '') {
|
||
return '';
|
||
}
|
||
|
||
// Device visibility.
|
||
$hide = sanitize_key((string) $args['hide']);
|
||
if ($hide === 'pc' || $hide === 'm') {
|
||
$is_mobile = function_exists('wp_is_mobile') ? wp_is_mobile() : false;
|
||
if ((!$is_mobile && $hide === 'pc') || ($is_mobile && $hide === 'm')) {
|
||
return '';
|
||
}
|
||
}
|
||
|
||
$type = sanitize_key((string) $args['type']);
|
||
if ($type !== '' && !in_array($type, ['style-1', 'style-2', 'style-3', 'style-4'], true)) {
|
||
// Accept bare "1"–"4".
|
||
if (preg_match('/^[1-4]$/', $type)) {
|
||
$type = 'style-' . $type;
|
||
} else {
|
||
$type = '';
|
||
}
|
||
}
|
||
|
||
$link = $args['link'];
|
||
if (is_string($link)) {
|
||
$link = ['url' => $link, 'target' => ''];
|
||
}
|
||
if (!is_array($link)) {
|
||
$link = ['url' => '', 'target' => ''];
|
||
}
|
||
$link_url = esc_url(trim((string) ($link['url'] ?? '')));
|
||
$link_target = sanitize_text_field((string) ($link['target'] ?? ''));
|
||
|
||
$lazy = !empty($args['lazy']);
|
||
$media = '';
|
||
if ($video_url !== '' && !(function_exists('wp_is_mobile') && wp_is_mobile())) {
|
||
if ($lazy && aksrt_is_lazy('lazy_other')) {
|
||
$poster = $img_url !== '' ? ' data-poster="' . esc_url($img_url) . '"' : '';
|
||
$media = '<video autoplay loop muted playsinline class="fit-cover lazyload" data-src="' . esc_url($video_url) . '" src=""' . $poster . '></video>';
|
||
} else {
|
||
$poster = $img_url !== '' ? ' poster="' . esc_url($img_url) . '"' : '';
|
||
$media = '<video autoplay loop muted playsinline class="fit-cover" src="' . esc_url($video_url) . '"' . $poster . '></video>';
|
||
}
|
||
} elseif ($img_url !== '') {
|
||
$alt = (string) ($args['alt'] !== '' ? $args['alt'] : __('图片', 'aksrt'));
|
||
if ($lazy) {
|
||
$media = '<img' . aksrt_get_lazy_attr('lazy_other', $img_url, 'fit-cover') . ' alt="' . esc_attr($alt) . '">';
|
||
} else {
|
||
$media = '<img class="fit-cover" src="' . esc_url($img_url) . '" alt="' . esc_attr($alt) . '">';
|
||
}
|
||
}
|
||
if ($media === '') {
|
||
return '';
|
||
}
|
||
|
||
$mask_opacity = max(0, min(100, (int) $args['mask_opacity']));
|
||
$mask = $mask_opacity > 0
|
||
? '<div class="absolute graphic-mask" style="opacity:' . esc_attr((string) ($mask_opacity / 100)) . '"></div>'
|
||
: '';
|
||
|
||
// text1/2/3 may contain small trusted HTML (icons); sanitize lightly.
|
||
$text1 = (string) $args['text1'];
|
||
$text2 = (string) $args['text2'];
|
||
$text3 = (string) $args['text3'];
|
||
$allow = [
|
||
'i' => ['class' => true, 'aria-hidden' => true],
|
||
'span' => ['class' => true, 'title' => true],
|
||
'item' => ['class' => true, 'data-toggle' => true, 'title' => true],
|
||
'b' => [],
|
||
'strong'=> [],
|
||
'em' => [],
|
||
'badge' => ['class' => true],
|
||
];
|
||
$text1_safe = $text1 !== '' ? wp_kses($text1, $allow) : '';
|
||
$text2_safe = $text2 !== '' ? wp_kses($text2, $allow) : '';
|
||
$text3_safe = $text3 !== '' ? wp_kses($text3, $allow) : '';
|
||
$more = (string) $args['more'];
|
||
$more_safe = $more !== '' ? wp_kses($more, array_merge($allow, [
|
||
'div' => ['class' => true, 'style' => true],
|
||
'badge' => ['class' => true],
|
||
])) : '';
|
||
|
||
$text = '';
|
||
if ($type === 'style-2') {
|
||
$text = '<div class="abs-center conter-conter graphic-text">';
|
||
$text .= $text1_safe !== '' ? '<div class="title-h-center"><b>' . $text1_safe . '</b></div>' : '';
|
||
$text .= $text2_safe !== '' ? '<div class="em09 opacity8">' . $text2_safe . '</div>' : '';
|
||
$text .= '</div>';
|
||
if ($text3_safe !== '') {
|
||
$text .= '<div class="abs-center right-top"><badge class="b-black opacity8">' . $text3_safe . '</badge></div>';
|
||
}
|
||
} elseif ($type === 'style-3') {
|
||
$text = $text1_safe !== '' ? '<div class="abs-center left-bottom graphic-text text-ellipsis">' . $text1_safe . '</div>' : '';
|
||
$text .= '<div class="abs-center left-bottom graphic-text">';
|
||
$text .= $text2_safe !== '' ? '<div class="em09 opacity8">' . $text2_safe . '</div>' : '';
|
||
$text .= $text3_safe !== '' ? '<div class="px12 opacity8 mt6">' . $text3_safe . '</div>' : '';
|
||
$text .= '</div>';
|
||
} elseif ($type === 'style-4') {
|
||
if ($text3_safe !== '') {
|
||
$text = '<div class="abs-center right-top"><badge class="b-black opacity8 mr6 mt6">' . $text3_safe . '</badge></div>';
|
||
}
|
||
} else {
|
||
// style-1 / default.
|
||
$inner = $text1_safe !== '' ? '<div class="title-h-left"><b>' . $text1_safe . '</b></div>' : '';
|
||
$inner .= $text3_safe !== '' ? '<div class="em09 opacity8">' . $text3_safe . '</div>' : '';
|
||
$inner .= $text2_safe !== '' ? '<div class="em09">' . $text2_safe . '</div>' : '';
|
||
$text = $inner !== '' ? '<div class="abs-center left-bottom graphic-text">' . $inner . '</div>' : '';
|
||
}
|
||
$text .= $more_safe;
|
||
|
||
$class = trim('graphic hover-zoom-img ' . (string) $args['class'] . ' ' . $type);
|
||
$height_scale = max(0, (int) $args['height_scale']);
|
||
$scale_attr = $height_scale > 0
|
||
? ' style="padding-bottom:' . esc_attr((string) $height_scale) . '%!important;"'
|
||
: '';
|
||
|
||
$html = '';
|
||
if ($link_url !== '') {
|
||
$tgt = $link_target !== '' ? ' target="' . esc_attr($link_target) . '" rel="noopener noreferrer"' : '';
|
||
$html .= '<a href="' . esc_url($link_url) . '"' . $tgt . '>';
|
||
}
|
||
if ($type === 'style-4') {
|
||
$html .= '<div class="main-shadow radius8 main-bg mb10">';
|
||
}
|
||
$html .= '<div class="' . esc_attr($class) . '"' . $scale_attr . '>';
|
||
$html .= $media;
|
||
$html .= $mask;
|
||
$html .= $text;
|
||
if ($type === 'style-4') {
|
||
$html .= '</div>'; // close .graphic early for style-4 body.
|
||
$html .= '<div class="padding-10">';
|
||
$html .= $text1_safe !== '' ? '<div class="text-ellipsis">' . $text1_safe . '</div>' : '';
|
||
$html .= $text2_safe !== '' ? '<div class="muted-2-color em09 text-ellipsis mt6">' . $text2_safe . '</div>' : '';
|
||
$html .= '</div></div>'; // padding + main-shadow
|
||
} else {
|
||
$html .= '</div>';
|
||
}
|
||
if ($link_url !== '') {
|
||
$html .= '</a>';
|
||
}
|
||
|
||
if ($echo) {
|
||
echo $html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
|
||
return '';
|
||
}
|
||
return $html;
|
||
}
|
||
endif;
|
||
|
||
if (!function_exists('aksrt_author_minicard')) :
|
||
/**
|
||
* Author mini card for user lists (zibll zib_author_card).
|
||
*
|
||
* @param int $user_id
|
||
* @param string $class
|
||
* @param bool $blur_bg
|
||
*/
|
||
function aksrt_author_minicard(int $user_id, string $class = '', bool $blur_bg = false): string {
|
||
if ($user_id <= 0) {
|
||
return '';
|
||
}
|
||
$user = get_userdata($user_id);
|
||
if (!$user) {
|
||
return '';
|
||
}
|
||
|
||
$avatar_url = function_exists('aksrt_get_avatar_url')
|
||
? aksrt_get_avatar_url($user_id, ['size' => 96])
|
||
: get_avatar_url($user_id, ['size' => 96]);
|
||
$home = function_exists('aksrt_get_user_home_url')
|
||
? aksrt_get_user_home_url($user_id)
|
||
: get_author_posts_url($user_id);
|
||
|
||
$avatar_box = '<div class="avatar-img"><a href="' . esc_url($home) . '"><img' . aksrt_get_lazy_attr('lazy_avatar', $avatar_url, 'avatar', aksrt_get_lazy_thumb('sm')) . ' alt="" width="42" height="42"></a></div>';
|
||
|
||
$name = function_exists('aksrt_get_user_name')
|
||
? aksrt_get_user_name([
|
||
'id' => $user_id,
|
||
'class' => 'flex ac flex1',
|
||
'follow' => false,
|
||
'medal' => true,
|
||
'auth' => true,
|
||
'level' => true,
|
||
])
|
||
: '<a href="' . esc_url($home) . '">' . esc_html($user->display_name) . '</a>';
|
||
|
||
// Follow control (separate from name, zibll places both in dt).
|
||
$follow = '';
|
||
$current = get_current_user_id();
|
||
if ($current !== $user_id) {
|
||
if (is_user_logged_in()) {
|
||
$follow = '<button type="button" class="focus-color px12 ml10 follow flex0 but" data-aksrt-follow="' . (int) $user_id . '"><i class="fa fas fa-heart em09" aria-hidden="true"></i> ' . esc_html__('关注', 'aksrt') . '</button>';
|
||
} else {
|
||
$login = function_exists('aksrt_get_login_url') ? aksrt_get_login_url() : wp_login_url();
|
||
$follow = '<a class="focus-color px12 ml10 follow flex0 but" href="' . esc_url($login) . '"><i class="fa fas fa-heart em09" aria-hidden="true"></i> ' . esc_html__('关注', 'aksrt') . '</a>';
|
||
}
|
||
}
|
||
|
||
$desc = trim((string) get_user_meta($user_id, 'description', true));
|
||
if ($desc === '') {
|
||
$desc = __('这家伙很懒，什么都没有写…', 'aksrt');
|
||
}
|
||
|
||
$blur = '';
|
||
if ($blur_bg) {
|
||
$blur = '<div class="abs-blur-bg blur"><img' . aksrt_get_lazy_attr('lazy_avatar', $avatar_url, '', aksrt_get_lazy_thumb('sm')) . ' alt=""></div>';
|
||
}
|
||
|
||
return '<div class="author-minicard radius8 relative-h ' . esc_attr($class) . '">'
|
||
. $blur
|
||
. '<ul class="list-inline relative">'
|
||
. '<li>' . $avatar_box . '</li>'
|
||
. '<li><dl>'
|
||
. '<dt class="flex ac">' . $name . $follow . '</dt>'
|
||
. '<dd class="mt6 em09 muted-color text-ellipsis">' . esc_html($desc) . '</dd>'
|
||
. '</dl></li>'
|
||
. '</ul></div>';
|
||
}
|
||
endif;
|