| 1 |
<?php |
| 2 |
/** |
| 3 |
* Single Product Image |
| 4 |
* |
| 5 |
* This template can be overridden by copying it to yourtheme/woocommerce/single-product/product-image.php. |
| 6 |
* |
| 7 |
* HOWEVER, on occasion WooCommerce will need to update template files and you |
| 8 |
* (the theme developer) will need to copy the new files to your theme to |
| 9 |
* maintain compatibility. We try to do this as little as possible, but it does |
| 10 |
* happen. When this occurs the version of the template file will be bumped and |
| 11 |
* the readme will list any important changes. |
| 12 |
* |
| 13 |
* @see https://woocommerce.com/document/template-structure/ |
| 14 |
* @package WooCommerce\Templates |
| 15 |
* @version 9.7.0 |
| 16 |
*/ |
| 17 |
|
| 18 |
use Automattic\WooCommerce\Enums\ProductType; |
| 19 |
use RadiusTheme\SB\Helpers\Fns; |
| 20 |
use RadiusTheme\SB\Modules\VariationGallery\GalleryFns; |
| 21 |
|
| 22 |
defined( 'ABSPATH' ) || exit; |
| 23 |
|
| 24 |
// Note: `wc_get_gallery_image_html` was added in WC 3.3.2 and did not exist prior. This check protects against theme overrides being used on older versions of WC. |
| 25 |
if ( ! function_exists( 'wc_get_gallery_image_html' ) ) { |
| 26 |
return; |
| 27 |
} |
| 28 |
|
| 29 |
global $product; |
| 30 |
$post_thumbnail_id = $product->get_image_id(); |
| 31 |
$attachment_ids = $product->get_gallery_image_ids(); |
| 32 |
$rand = wp_rand(); |
| 33 |
$randThumbnail = wp_rand(); |
| 34 |
|
| 35 |
$galleryStyle = 'bottom'; |
| 36 |
if ( rtsb()->has_pro() ) { |
| 37 |
$galleryStyle = GalleryFns::get_options( 'gallery_style' ) ?: $galleryStyle; |
| 38 |
} |
| 39 |
$image_zoom = GalleryFns::get_options( 'image_zoom' ) ?: ''; |
| 40 |
$slider_options = [ |
| 41 |
'spaceBetween' => 0, |
| 42 |
'speed' => 500, |
| 43 |
'loop' => false, |
| 44 |
'autoHeight' => false, |
| 45 |
'navigation' => [ |
| 46 |
'nextEl' => '.swiper-gallery-next.rtsb-random-id-' . esc_attr( $rand ), |
| 47 |
'prevEl' => '.swiper-gallery-prev.rtsb-random-id-' . esc_attr( $rand ), |
| 48 |
], |
| 49 |
'thumbsSelectorNoSlider' => '.rtsb-thumb', // If Swiper Is not active. |
| 50 |
]; |
| 51 |
$slider_options = apply_filters( 'rtsb/vg/slider/options', $slider_options ); |
| 52 |
$images = []; |
| 53 |
if ( $post_thumbnail_id ) { |
| 54 |
$images[] = $post_thumbnail_id; |
| 55 |
} |
| 56 |
if ( is_array( $attachment_ids ) && count( $attachment_ids ) ) { |
| 57 |
$images = array_merge( $images, $attachment_ids ); |
| 58 |
} |
| 59 |
$images = array_unique( $images ); |
| 60 |
$wrapper_classes = apply_filters( |
| 61 |
'woocommerce_single_product_image_gallery_classes', |
| 62 |
[ |
| 63 |
'woocommerce-product-gallery', |
| 64 |
'woocommerce-product-gallery--' . ( $post_thumbnail_id ? 'with-images' : 'without-images' ), |
| 65 |
'images', |
| 66 |
] |
| 67 |
); |
| 68 |
$custom_class = []; |
| 69 |
if ( rtsb()->has_pro() ) { |
| 70 |
$custom_class[] = 'rtsb-pro-active'; |
| 71 |
} |
| 72 |
if ( ! ( did_action( 'elementor/loaded' ) && \Elementor\Plugin::$instance->editor->is_edit_mode() ) ) { |
| 73 |
$custom_class[] = 'rtsb-content-loading'; |
| 74 |
} |
| 75 |
|
| 76 |
$position = apply_filters( 'rtsb/vg/thumbnails/position', $galleryStyle ); |
| 77 |
$col = GalleryFns::get_options( 'thumbnails_columns' ) ?: 4; |
| 78 |
$col = apply_filters( 'rtsb/vg/gallery/columns', $col ); |
| 79 |
$custom_class[] = 'rtsb-thumbnails-position-' . $position; |
| 80 |
$icon_right = '<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 320 512" aria-hidden="true"><path d="M285.5 273l-194 194c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9L184.6 256 35 106.6c-9.4-9.4-9.4-24.6 0-33.9L57.6 50c9.4-9.4 24.6-9.4 33.9 0l194 194c9.4 9.4 9.4 24.6 0 34z"/></svg>'; |
| 81 |
$icon_left = '<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 320 512" aria-hidden="true"><path d="M34.5 239l194-194c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L135.4 256l150.6 149.4c9.4 9.4 9.4 24.6 0 33.9l-22.6 22.6c-9.4 9.4-24.6 9.4-33.9 0l-194-194c-9.4-9.4-9.4-24.6 0-34z"/></svg>'; |
| 82 |
?> |
| 83 |
<div class="<?php echo esc_attr( implode( ' ', array_map( 'sanitize_html_class', $wrapper_classes ) ) ); ?>"> |
| 84 |
<div class="rtsb-vg-main-slider-wrapper <?php echo esc_attr( implode( ' ', array_map( 'sanitize_html_class', $custom_class ) ) ); ?>" data-image-zoom="<?php echo esc_attr( boolval( $image_zoom ) ); ?>" > |
| 85 |
<div class="rtsb-carousel-slider product-vg-gallery" data-options=<?php echo esc_js( wp_json_encode( $slider_options ) ); ?>> |
| 86 |
<!-- Main Slider --> |
| 87 |
<?php |
| 88 |
do_action( 'rtsb_product_badge' ); |
| 89 |
$showLightBox = apply_filters( 'rtsb/vg/lightbox', 'on' === GalleryFns::get_options( 'lightBox' ) ); |
| 90 |
if ( $post_thumbnail_id && $showLightBox ) : |
| 91 |
$zoomPosition = apply_filters( 'rtsb/vg/lightbox/position', GalleryFns::get_options( 'lightBox_button_position' ) ); |
| 92 |
$lightBoxPosition = $zoomPosition ?: 'top-right'; |
| 93 |
?> |
| 94 |
<a href="#" class="rtsb-vg-trigger rtsb-vg-trigger-position-<?php echo esc_attr( $lightBoxPosition ); ?> rtsb-vg-image-trigger"> |
| 95 |
<?php ob_start(); ?> |
| 96 |
<svg width="14" height="14" viewBox="0 0 20 20" fill="currentColor" xmlns="http://www.w3.org/2000/svg"> |
| 97 |
<path d="M12.9 14.32a8 8 0 1 1 1.41-1.41l4.39 4.39a1 1 0 0 1-1.41 1.41l-4.39-4.39ZM14 8a6 6 0 1 0-12 0 6 6 0 0 0 12 0Z"/> |
| 98 |
</svg> |
| 99 |
<?php |
| 100 |
$icon_html = ob_get_clean(); |
| 101 |
Fns::print_html( apply_filters( 'rtsb/vg/lightbox/trigger/icon', $icon_html ), true ); |
| 102 |
?> |
| 103 |
<span class="screen-reader-text"><?php echo esc_html( 'Zoom' ); ?></span> |
| 104 |
</a> |
| 105 |
<?php endif; ?> |
| 106 |
<?php if ( is_array( $images ) && count( $images ) ) { ?> |
| 107 |
<div class="swiper-wrapper"> |
| 108 |
<?php foreach ( $images as $key => $attachment_id ) { ?> |
| 109 |
<div class="swiper-slide rtsb-vs-main-image-<?php echo esc_attr( $attachment_id ); ?>"> |
| 110 |
<?php Fns::print_html( GalleryFns::get_main_attachment_html( $attachment_id, $product ), true ); ?> |
| 111 |
</div> |
| 112 |
<?php } ?> |
| 113 |
</div> |
| 114 |
<div class="swiper-nav <?php echo esc_attr( count( $images ) > 1 ? '' : 'rtsb-vg-swiper-nav-hide' ); ?>" > |
| 115 |
<!-- Navigation Arrows --> |
| 116 |
<div class="swiper-arrow swiper-gallery-next rtsb-random-id-<?php echo esc_attr( $rand ); ?>"> <?php Fns::print_html( $icon_right, true ); ?> </div> |
| 117 |
<div class="swiper-arrow swiper-gallery-prev rtsb-random-id-<?php echo esc_attr( $rand ); ?>"> <?php Fns::print_html( $icon_left, true ); ?> </div> |
| 118 |
</div> |
| 119 |
<?php } ?> |
| 120 |
</div> |
| 121 |
<?php |
| 122 |
$options = apply_filters( |
| 123 |
'rtsb/vg/thumbnails/slider/options', |
| 124 |
[], |
| 125 |
[ |
| 126 |
'randDom' => $randThumbnail, |
| 127 |
'thumbnailsPosition' => $position, |
| 128 |
] |
| 129 |
); |
| 130 |
?> |
| 131 |
<div class=" rtsb-vs-thumb-slider rtsb-vs-thumb-column-<?php echo esc_attr( $col ); ?>" data-options=<?php echo esc_js( wp_json_encode( $options ) ); ?> > |
| 132 |
<div class="swiper-wrapper"> |
| 133 |
<?php if ( is_array( $attachment_ids ) && count( $attachment_ids ) ) { ?> |
| 134 |
<?php foreach ( $images as $key => $attachment_id ) { ?> |
| 135 |
<div class="swiper-slide rtsb-thumb rtsb-vs-thumb-item-<?php echo esc_attr( $attachment_id ); ?>" data-index="<?php echo esc_attr( $key ); ?>" > |
| 136 |
<?php Fns::print_html( GalleryFns::get_thumbnail_attachment_html( $attachment_id, $product ), true ); ?> |
| 137 |
</div> |
| 138 |
<?php } ?> |
| 139 |
<?php } ?> |
| 140 |
</div> |
| 141 |
<?php |
| 142 |
do_action( |
| 143 |
'rtsb/after/product/thumbnail/image', |
| 144 |
[ |
| 145 |
'randDom' => $randThumbnail, |
| 146 |
'iconLeft' => $icon_left, |
| 147 |
'iconRight' => $icon_right, |
| 148 |
'images' => $images, |
| 149 |
'col' => $col, |
| 150 |
] |
| 151 |
); |
| 152 |
?> |
| 153 |
</div> |
| 154 |
|
| 155 |
|
| 156 |
</div> |
| 157 |
</div> |
