From 0d624862c2d94378b9a189d301a6364f1dda2d46 Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Fri, 9 Mar 2018 14:36:14 +0000 Subject: [PATCH] Use gallery thumbnail size for variation image switcher. --- assets/js/frontend/add-to-cart-variation.js | 51 ++++++++++++++------- includes/wc-product-functions.php | 28 +++++++---- 2 files changed, 54 insertions(+), 25 deletions(-) diff --git a/assets/js/frontend/add-to-cart-variation.js b/assets/js/frontend/add-to-cart-variation.js index a5ccef1ed67..12d26afd8e7 100644 --- a/assets/js/frontend/add-to-cart-variation.js +++ b/assets/js/frontend/add-to-cart-variation.js @@ -565,8 +565,9 @@ $product_link = $product_img_wrap.find( 'a' ).eq( 0 ); if ( variation && variation.image && variation.image.src && variation.image.src.length > 1 ) { - if ( $gallery_nav.find( 'li img[src="' + variation.image.thumb_src + '"]' ).length > 0 ) { - $gallery_nav.find( 'li img[src="' + variation.image.thumb_src + '"]' ).trigger( 'click' ); + if ( $gallery_nav.find( 'li img[src="' + variation.image.gallery_thumbnail_src + '"]' ).length > 0 ) { + $form.wc_variations_image_reset(); + $gallery_nav.find( 'li img[src="' + variation.image.gallery_thumbnail_src + '"]' ).trigger( 'click' ); $form.attr( 'current-image', variation.image_id ); return; } else { @@ -582,24 +583,11 @@ $product_img.wc_set_variation_attr( 'data-large_image_width', variation.image.full_src_w ); $product_img.wc_set_variation_attr( 'data-large_image_height', variation.image.full_src_h ); $product_img_wrap.wc_set_variation_attr( 'data-thumb', variation.image.src ); - $gallery_img.wc_set_variation_attr( 'src', variation.image.thumb_src ); + $gallery_img.wc_set_variation_attr( 'src', variation.image.gallery_thumbnail_src ); $product_link.wc_set_variation_attr( 'href', variation.image.full_src ); } } else { - $product_img.wc_reset_variation_attr( 'src' ); - $product_img.wc_reset_variation_attr( 'width' ); - $product_img.wc_reset_variation_attr( 'height' ); - $product_img.wc_reset_variation_attr( 'srcset' ); - $product_img.wc_reset_variation_attr( 'sizes' ); - $product_img.wc_reset_variation_attr( 'title' ); - $product_img.wc_reset_variation_attr( 'alt' ); - $product_img.wc_reset_variation_attr( 'data-src' ); - $product_img.wc_reset_variation_attr( 'data-large_image' ); - $product_img.wc_reset_variation_attr( 'data-large_image_width' ); - $product_img.wc_reset_variation_attr( 'data-large_image_height' ); - $product_img_wrap.wc_reset_variation_attr( 'data-thumb' ); - $gallery_img.wc_reset_variation_attr( 'src' ); - $product_link.wc_reset_variation_attr( 'href' ); + $form.wc_variations_image_reset(); } window.setTimeout( function() { @@ -609,6 +597,35 @@ }, 20 ); }; + /** + * Reset main image to defaults. + */ + $.fn.wc_variations_image_reset = function() { + var $form = this, + $product = $form.closest( '.product' ), + $product_gallery = $product.find( '.images' ), + $gallery_nav = $product.find( '.flex-control-nav' ), + $gallery_img = $gallery_nav.find( 'li:eq(0) img' ), + $product_img_wrap = $product_gallery.find( '.woocommerce-product-gallery__image, .woocommerce-product-gallery__image--placeholder' ).eq( 0 ), + $product_img = $product_img_wrap.find( '.wp-post-image' ), + $product_link = $product_img_wrap.find( 'a' ).eq( 0 ); + + $product_img.wc_reset_variation_attr( 'src' ); + $product_img.wc_reset_variation_attr( 'width' ); + $product_img.wc_reset_variation_attr( 'height' ); + $product_img.wc_reset_variation_attr( 'srcset' ); + $product_img.wc_reset_variation_attr( 'sizes' ); + $product_img.wc_reset_variation_attr( 'title' ); + $product_img.wc_reset_variation_attr( 'alt' ); + $product_img.wc_reset_variation_attr( 'data-src' ); + $product_img.wc_reset_variation_attr( 'data-large_image' ); + $product_img.wc_reset_variation_attr( 'data-large_image_width' ); + $product_img.wc_reset_variation_attr( 'data-large_image_height' ); + $product_img_wrap.wc_reset_variation_attr( 'data-thumb' ); + $gallery_img.wc_reset_variation_attr( 'src' ); + $product_link.wc_reset_variation_attr( 'href' ); + }; + $(function() { if ( typeof wc_add_to_cart_variation_params !== 'undefined' ) { $( '.variations_form' ).each( function() { diff --git a/includes/wc-product-functions.php b/includes/wc-product-functions.php index 62263ab631e..eee69f05bff 100644 --- a/includes/wc-product-functions.php +++ b/includes/wc-product-functions.php @@ -693,10 +693,19 @@ function wc_get_product_attachment_props( $attachment_id = null, $product = fals $attachment = get_post( $attachment_id ); if ( $attachment ) { - $props['title'] = trim( strip_tags( $attachment->post_title ) ); - $props['caption'] = trim( strip_tags( $attachment->post_excerpt ) ); + $props['title'] = wp_strip_all_tags( $attachment->post_title ); + $props['caption'] = wp_strip_all_tags( $attachment->post_excerpt ); $props['url'] = wp_get_attachment_url( $attachment_id ); - $props['alt'] = trim( strip_tags( get_post_meta( $attachment_id, '_wp_attachment_image_alt', true ) ) ); + + // Alt text. + $alt_text = array( wp_strip_all_tags( get_post_meta( $attachment_id, '_wp_attachment_image_alt', true ) ), $props['caption'], wp_strip_all_tags( $attachment->post_title ) ); + + if ( $product ) { + $alt_text[] = wp_strip_all_tags( get_the_title( $product->ID ) ); + } + + $alt_text = array_filter( $alt_text ); + $props['alt'] = isset( $alt_text[0] ) ? $alt_text[0] : ''; // Large version. $src = wp_get_attachment_image_src( $attachment_id, 'full' ); @@ -704,6 +713,14 @@ function wc_get_product_attachment_props( $attachment_id = null, $product = fals $props['full_src_w'] = $src[1]; $props['full_src_h'] = $src[2]; + // Gallery thumbnail. + $gallery_thumbnail = wc_get_image_size( 'gallery_thumbnail' ); + $gallery_thumbnail_size = apply_filters( 'woocommerce_gallery_thumbnail_size', array( $gallery_thumbnail['width'], $gallery_thumbnail['height'] ) ); + $src = wp_get_attachment_image_src( $attachment_id, $gallery_thumbnail_size ); + $props['gallery_thumbnail_src'] = $src[0]; + $props['gallery_thumbnail_src_w'] = $src[1]; + $props['gallery_thumbnail_src_h'] = $src[2]; + // Thumbnail version. $src = wp_get_attachment_image_src( $attachment_id, 'woocommerce_thumbnail' ); $props['thumb_src'] = $src[0]; @@ -717,11 +734,6 @@ function wc_get_product_attachment_props( $attachment_id = null, $product = fals $props['src_h'] = $src[2]; $props['srcset'] = function_exists( 'wp_get_attachment_image_srcset' ) ? wp_get_attachment_image_srcset( $attachment_id, 'woocommerce_single' ) : false; $props['sizes'] = function_exists( 'wp_get_attachment_image_sizes' ) ? wp_get_attachment_image_sizes( $attachment_id, 'woocommerce_single' ) : false; - - // Alt text fallbacks. - $props['alt'] = empty( $props['alt'] ) ? $props['caption'] : $props['alt']; - $props['alt'] = empty( $props['alt'] ) ? trim( strip_tags( $attachment->post_title ) ) : $props['alt']; - $props['alt'] = empty( $props['alt'] ) && $product ? trim( strip_tags( get_the_title( $product->ID ) ) ) : $props['alt']; } return $props; }