Product image hover flipper

add_shortcode( 'ccom_product_image_flipper', function( $atts ) {

	add_action( 'wp_print_footer_scripts', function() {

		?>
		<script type="text/javascript">
		document.addEventListener( 'DOMContentLoaded', function() {

			// Loop Products
			let product_ids = [];
			document.querySelectorAll( 'li.product' )
				.forEach( function( product ) {

				// Extract Product ID
				product.classList.forEach( function( className ) {
					if( ! className.includes( 'post-' ) ) {
						return;
					}
					if( className.replace( /^\D+/g, '' ) > 0 ) {
						let product_id = className.replace( /^\D+/g, '' );
						product_ids.push( product_id );
					}
				} );

			} ); // End Products Loop

			// Get Second Images For Products By ID
			let request = new XMLHttpRequest();
			request.open( 'POST', '/wp-admin/admin-ajax.php', true );
			request.onload = function() {

				if( this.status < 200 || this.status >= 400 || this.response == '' ) {
					return;
				}

				// Successful Response
				let matches = JSON.parse( this.response );
				matches.forEach( function( match ) {
					if( ! match.url ) {
						return;
					}
					let product_img = document.querySelector(
						'li.post-' + match.product_id + ' img'
					);
					let product_img_src = product_img.src;
					let product_img_srcset = product_img.srcset;
					product_img.style.transition = 'opacity 0.3s ease-in-out';
					product_img.addEventListener( 'mouseover', function() {
						product_img.src = match.url;
						product_img.srcset = '';
					} );
					product_img.addEventListener( 'mouseout', function() {
						product_img.src = product_img_src;
						product_img.srcset = product_img_srcset;
					} );
				} );

			};

			var data = new FormData;
			data.append( 'action', 'ccom_flipper' );
			for( var i = 0; i < product_ids.length; i ++ ) {
				data.append( 'product_ids[]', product_ids[i] );
			}
			request.send( data );

		} ); // End DOM Loaded

		</script>
		<?php

	} );

} );

add_action( 'wp_ajax_ccom_flipper', 'ajax_ccom_flipper' );
add_action( 'wp_ajax_nopriv_ccom_flipper', 'ajax_ccom_flipper' );
function ajax_ccom_flipper() {
	$results = [];
	$products = wc_get_products(
		[
			'include' => array_map( 'absint', $_POST['product_ids'] ),
			'limit' => -1
		]
	);
	foreach( $products as $product ) {
		$gallery = $product->get_gallery_image_ids();
		if( $gallery ) {
			$results[] = [
				'product_id' => $product->get_id(),
				'url' => wp_get_attachment_image_url(
					$gallery[0], 'medium'
				)
			];
		}
	}
	echo json_encode( $results );
	wp_die();

}