Files
mataba/shop/xshop-theme/template-parts/components/product-gallery.php
T

49 lines
2.1 KiB
PHP

<?php
/**
* Product Gallery — lightweight, accessible, keyboard friendly.
*
* Args: ['product' => WC_Product]
*
* @package XShop
*/
declare(strict_types=1);
defined('ABSPATH') || exit;
$product = $args['product'] ?? null;
if (is_int($product)) { $product = wc_get_product($product); }
if (!$product instanceof WC_Product) { global $product; }
if (!$product instanceof WC_Product) { return; }
$pid = $product->get_id();
$mainId = $product->get_image_id();
$galleryIds = $product->get_gallery_image_ids();
$allIds = $mainId ? array_merge([$mainId], $galleryIds) : $galleryIds;
if (empty($allIds)) {
echo '<div class="xshop-product__gallery-main" style="display:flex;align-items:center;justify-content:center;color:var(--xshop-muted)">' . esc_html__('No image', 'xshop') . '</div>';
return;
}
$firstUrl = wp_get_attachment_image_url($allIds[0], 'large');
?>
<div class="xshop-product__gallery" data-xshop-gallery>
<div class="xshop-product__gallery-main" id="xshop-gallery-main">
<?php echo wp_get_attachment_image($allIds[0], 'large', false, ['loading' => 'eager', 'decoding' => 'async', 'alt' => esc_attr($product->get_name()), 'data-xshop-main-image' => '']); ?>
</div>
<?php if (count($allIds) > 1): ?>
<div class="xshop-product__thumbs" role="tablist" aria-label="<?php esc_attr_e('Product gallery', 'xshop'); ?>">
<?php foreach ($allIds as $idx => $attId):
$thumbUrl = wp_get_attachment_image_url($attId, 'thumbnail');
$largeUrl = wp_get_attachment_image_url($attId, 'large');
$isActive = $idx === 0;
?>
<button type="button" class="xshop-product__thumb <?php echo $isActive ? 'is-active' : ''; ?>" data-large="<?php echo esc_url($largeUrl); ?>" aria-label="<?php echo esc_attr(sprintf(esc_html__('View image %d', 'xshop'), $idx + 1)); ?>" aria-selected="<?php echo $isActive ? 'true' : 'false'; ?>" role="tab">
<?php echo wp_get_attachment_image($attId, 'thumbnail', false, ['loading' => 'lazy', 'decoding' => 'async', 'alt' => esc_attr(sprintf(esc_html__('Thumbnail %d', 'xshop'), $idx + 1))]); ?>
</button>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>