Woocommerce Product Variations Pagination not working - php

Question

I have created a custom page to show Specific Product Variation in to table list.
Here is the code:
<h1> PRODUCT TABLE LIST </h1>
<table>
<thead>
<tr>
<th></th>
<th>Name</th>
<th>Message</th>
<th>Price</th>
<th>Quantity</th>
<th>Total Quantity</th>
<th></th>
</tr>
</thead>
<tbody class="products">
<?php
$args = array(
'post_type' => array('product', 'product_variation'),
'posts_per_page' => 5,
'product_cat' => '',
'post__in' => array( 521, 695, 852, 457, 961, 188, 399, 80, 109, 182, 108, 184, 171, 206, 197 ), // 15 products
'orderby' => 'id',
'paged' => get_query_var( 'paged' ) ? get_query_var( 'paged' ) : 1 );
$wp_query = new WP_Query( $args );
while ( $wp_query->have_posts() ) : $wp_query->the_post(); global $product; ?>
<?php if ( $product->is_type( 'variable' ) ) { ?>
<?php show_variable_products_list(); ?>
<?php
}
else {
?>
<tr class="product-<?php echo esc_attr( $product->id ); ?>">
<form action="<?php echo esc_url( $product->add_to_cart_url() ); ?>" class="cart" method="post" enctype='multipart/form-data'>
<a href="<?php echo get_permalink( $wp_query->post->ID ) ?>" title="<?php echo esc_attr($wp_query->post->post_title ? $wp_query->post->post_title : $wp_query->post->ID); ?>">
<td class="image">
<?php woocommerce_show_product_sale_flash( $post, $product ); ?>
<?php if (has_post_thumbnail( $wp_query->post->ID )) echo get_the_post_thumbnail($wp_query->post->ID, 'wh_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="150px" height="150px" />'; ?>
</td>
<td class="title">
<h3><?php the_title(); ?></h3>
</td>
<td class="note">
<?php wholesale_msg_note(); ?>
<?php wholesale_letter_note(); ?>
</td>
<td class="price">
<span class="woocommerce-Price-amount amount">
<span class="woocommerce-Price-currencySymbol">
<?php echo get_woocommerce_currency_symbol(); ?>
</span>
<?php echo $product->get_price() ?>
</span>
</td>
</a>
<td class="quantity-cs">
<table>
<tr>
<?php echo wholesale_sc_note(); ?>
</tr>
<tr>
<?php echo wholesale_kw_note(); ?>
</tr>
</table>
</td>
<td class="quantity-total">
<?php //woocommerce_quantity_input(); //This function generates the quantity field. ?>
<div class="quantity">
<input type="number" step="1" min="1" max="" name="quantity" value="1" title="Qty" class="input-text qty text" size="4" pattern="[0-9]*" inputmode="numeric" />
</div>
</td>
<td class="button">
<input type="hidden" name="add-to-cart" value="<?php echo esc_attr( $product->id ); ?>" />
<input type="hidden" name="product_id" value="<?php echo esc_attr( $product->id ); ?>" />
<input type="hidden" name="variation_id" class="variation_id" value="0" />
<button type="submit" class="button buy-now-btn cart-btn product_type_simple add_to_cart_button ajax_add_to_cart" />Add to Cart</button>
</td>
</form>
<?php
}
?>
</tr>
</tbody>
<?php endwhile; ?>
</table><!--/.products-->
<div>
<?php previous_posts_link( 'Older Posts' ); ?>
<?php next_posts_link( 'New Posts' , $wp_query->max_num_pages ); ?>
</div>
<?php
/*
PAGINATION
*/
if ( function_exists( 'wp_pagenavi' ) ) {
?>
<div id="pagination">
<?php wp_pagenavi( array( 'query' => $wp_query ) ); ?>
</div>
<?php } ?>
<?php wp_reset_query(); ?>
?>
Both the pagination works great for simple products but I am also using variable products to show here in this table format.
Here is the code:
function show_variable_products_list(){
global $product, $post;
$variations = find_valid_variations();
// Check if the special 'price_grid' meta is set, if it is, load the default template:
if ( get_post_meta($post->ID, 'price_grid', true) ) {
// Enqueue variation scripts
wp_enqueue_script( 'wc-add-to-cart-variation' );
// Load the template
wc_get_template( 'woocommerce/single-product/add-to-cart/variable.php', array(
'available_variations' => $product->get_available_variations(),
'attributes' => $product->get_variation_attributes(),
'selected_attributes' => $product->get_variation_default_attributes()
) );
return;
}
// Cool, lets do our own template!
?>
<?php
foreach ($variations as $key => $value) {
if( !$value['variation_is_visible'] ) continue;
?>
<tr class="product-<?php echo esc_attr( $product->id ); ?> variation-<?php echo $value['variation_id']?>">
<form class="variations_form cart" method="post" enctype='multipart/form-data' data-product_id="<?php echo absint( $product->id ); ?>" data-product_variations="<?php echo htmlspecialchars( json_encode( $available_variations ) ) ?>">
<td class="image">
<?php echo '<img src="'.$value['image_src'].'" alt="'.$product->get_title().'-'.$value['variation_id'].'" width="150px" height="150px" />'; ?>
</td>
<td class="title">
<h3><?php the_title(); ?></h3><br />
<b><?php
/*
- '.get_term_by().'
foreach($value['attributes'] as $key => $val ) {
$val = str_replace(array('-','_'), ' ', $val);
printf( '<span class="attr attr-%s">%s</span>', $key, ucwords($ival) );
}
*/
foreach($value['attributes'] as $attr_name => $attr_value ) {
$attr_name = substr($attr_name, 10);
$attr = get_term_by('slug', $attr_value, $attr_name);
$attr_value = $attr->name;
echo $attr_value, ' ';
//echo implode ('/', $attr_value );
//echo $attr->name;
//$attr_implode_name = implode(",", $value['attributes']);
//echo $attr_implode_name;
}
?></b>
</td>
<td class="note">
<?php wholesale_msg_note(); ?>
<?php wholesale_letter_note(); ?>
</td>
<td class="price">
<?php echo $value['price_html'];?>
</td>
<td class="keyblade">
<table>
<tr>
<?php echo wholesale_sc_note(); ?>
</tr>
<tr>
<?php echo wholesale_kw_note(); ?>
</tr>
</table>
</td>
<?php if( $value['is_in_stock'] ) { ?>
<td>
<?php woocommerce_quantity_input(); ?>
</td>
<td>
<?php
if(!empty($value['attributes'])){
foreach ($value['attributes'] as $attr_key => $attr_value) {
?>
<input type="hidden" name="<?php echo $attr_key?>" value="<?php echo $attr_value?>">
<?php
}
}
?>
<button type="submit" class="single_add_to_cart_button btn btn-primary ajax_add_to_cart"><span class="glyphicon glyphicon-tag"></span> Add to cart</button>
<input type="hidden" name="variation_id" value="<?php echo $value['variation_id']?>" />
<input type="hidden" name="product_id" value="<?php echo esc_attr( $post->ID ); ?>" />
<input type="hidden" name="add-to-cart" value="<?php echo esc_attr( $post->ID ); ?>" />
<?php } else { ?>
<p class="stock out-of-stock"><?php _e( 'This product is currently out of stock and unavailable.', 'woocommerce' ); ?></p>
<?php } ?>
</td>
</form>
</tr>
<?php } ?>
<?php
}
function find_valid_variations() {
global $product;
$variations = $product->get_available_variations();
$attributes = $product->get_attributes();
$new_variants = array();
// Loop through all variations
foreach( $variations as $variation ) {
// Peruse the attributes.
// 1. If both are explicitly set, this is a valid variation
// 2. If one is not set, that means any, and we must 'create' the rest.
$valid = true; // so far
foreach( $attributes as $slug => $args ) {
if( array_key_exists("attribute_$slug", $variation['attributes']) && !empty($variation['attributes']["attribute_$slug"]) ) {
// Exists
} else {
// Not exists, create
$valid = false; // it contains 'anys'
// loop through all options for the 'ANY' attribute, and add each
foreach( explode( '|', $attributes[$slug]['value']) as $attribute ) {
$attribute = trim( $attribute );
$new_variant = $variation;
$new_variant['attributes']["attribute_$slug"] = $attribute;
$new_variants[] = $new_variant;
//$woocommerce->attribute_label
}
}
}
// This contains ALL set attributes, and is itself a 'valid' variation.
if( $valid )
$new_variants[] = $variation;
}
return $new_variants;
}
add_filter( 'woocommerce_variable_add_to_cart', 'show_variable_products_list', 10, 2 );
The problem is if the page have 2 simple product & 3 variable product with say 3 variations each then the page shows 2 + 3x3 = 11 products instead of 5.
What am I doing wrong? How can I show 5 products in each page even with variable products?