<?php
/**
 * The Template for displaying product archives, including the main shop page which is a post type archive
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/archive-product.php.
 *
 * HOWEVER, on occasion WooCommerce will need to update template files and you
 * (the theme developer) will need to copy the new files to your theme to
 * maintain compatibility. We try to do this as little as possible, but it does
 * happen. When this occurs the version of the template file will be bumped and
 * the readme will list any important changes.
 *
 * @see https://docs.woocommerce.com/document/template-structure/
 * @package WooCommerce\Templates
 * @version 3.4.0
 */

defined('ABSPATH') || exit;

get_header('shop');

/**
 * Hook: woocommerce_before_main_content.
 *
 * @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)
 * @hooked WC_Structured_Data::generate_website_data() - 30
 */
do_action('woocommerce_before_main_content');

?>
<div id="blue-background">
    <div class="background-clip"></div>
</div>
    <section class="wc-page-wrap">

        <div class="grid-container fluid">
            <?php
            /**
             *              * @hooked woocommerce_breadcrumb - 10
             */
            do_action('woocommerce_before_archive_description');
            ?>
            <div class="woocommerce-products-header">
                <?php if (apply_filters('woocommerce_show_page_title', true)) : ?>
                    <h1 class="woocommerce-products-header__title page-title"><?php woocommerce_page_title(); ?></h1>
                <?php endif; ?>
            </div>
        </div>


        <?php
        /**
         * Hook: woocommerce_archive_description.
         *
         * @hooked woocommerce_taxonomy_archive_description - 10
         * @hooked woocommerce_product_archive_description - 10
         */
        do_action('woocommerce_archive_description');
        ?>

        <div class="grid-container fluid">
            <?php if (woocommerce_product_loop()) {

                /**
                 * Hook: woocommerce_before_shop_loop.
                 *
                 * @hooked woocommerce_output_all_notices - 10
                 * @hooked woocommerce_result_count - 20
                 * @hooked woocommerce_catalog_ordering - 30
                 */
                do_action('woocommerce_before_shop_loop');
                ?>
                <div class="flex-container">
                    <div class="grid-x align-justify products-filter category-filter">

                        <div id="product-cats-filter" class="cell small-12 large-shrink grid-x grid-padding-x align-middle products-filter-cats">
                            <h4 class="cell small-12 large-shrink text1215 products-filter-heading">Category</h4>

                            <?php
                            //WP_Term[]
                            $cats = array_filter(get_terms([
                                'taxonomy' => 'product_cat'
                            ]), static function($cat){
                                return $cat->name && strtolower($cat->name) !== 'uncategorized';
                            });

                            foreach ($cats as $cat):
                                if($cat->slug === 'uncategorised') { continue; }
                            ?>

                                <div class="cell filterinput">
                                    <input type="checkbox" id="product_cat-<?= $cat->slug ?>">
                                    <label for="product_cat-<?= $cat->slug ?>" class="text1420"><?= $cat->name ?></label>
                                </div>

                            <?php endforeach; ?>

                        </div>
                    </div>
                    <div class="grid-x align-justify products-filter tyre-fit-filter">
                        <div class="cell small-12 large-shrink grid-x grid-padding-x align-middle products-filter-sizes">
                            <h4 class="text1215 mr-6 products-filter-heading hide">Filter Products By Compatibility</h4>
                            <span id="filter-sizes-buttons-wrap" class="setfit">
                                <button class="button"></button>
                            </span>
                        </div>
                    </div>
                </div>
                <?php

                woocommerce_product_loop_start();

                if (wc_get_loop_prop('total')) {
                    while (have_posts()) {
                        the_post();

                        /**
                         * Hook: woocommerce_shop_loop.
                         */
                        do_action('woocommerce_shop_loop');

                        wc_get_template_part('content', 'product');
                    }
                }

                woocommerce_product_loop_end();

                /**
                 * Hook: woocommerce_after_shop_loop.
                 *
                 * @hooked woocommerce_pagination - 10
                 */
                do_action('woocommerce_after_shop_loop');
            } else {
                /**
                 * Hook: woocommerce_no_products_found.
                 *
                 * @hooked wc_no_products_found - 10
                 */
                do_action('woocommerce_no_products_found');
            } ?>
        </div>

        <div class="grid-container">
            <div class="text-center notice-box" style="display: none;">
                <h4>No Compatible Tyre Size Found - Please review <a id="open-tyrefit" style="cursor: pointer">Your Tyre Fit</a></h4>
            </div>
        </div>
    </section>

<?php
/**
 * Hook: woocommerce_after_main_content.
 *
 * @hooked woocommerce_output_content_wrapper_end - 10 (outputs closing divs for the content)
 */
do_action('woocommerce_after_main_content');

get_footer('shop');