{$_cart_url = $wa->getUrl('shop/frontend/order')}

{function name="_product_image_mini" p=[]}
    <a href="{$p.frontend_url}" title="{$p.name}" class="wa-mb-8 text-center">
        <div class="image">
            {$wa->shop->productImgHtml($p, '200', ['itemprop' => 'image', 'alt' => $p.name, 'default' => "`$wa_theme_url`img/dummy96.png", 'srcset' => "`$wa->shop->productImgUrl($p, '200@2x')` 2x"])}
        </div>
        <meta itemprop="name" content="{$p.name|escape}">
        <meta itemprop="description" content="{$p.description|strip_tags:false|truncate:'100'}">
    </a>
{/function}

{$_product_image_slider = $theme_settings.product_image_slider|default:0}
{if !empty($_product_image_slider)}
    {$_products_ids = array_keys($products)}
    {$_images = $wa->shop->images($_products_ids)}
{/if}

<!-- products mini thumbnail list view: related products, etc. -->
<ul class="thumbs product-list mini{if !empty($ulclass)} {$ulclass}{/if}">
{foreach $products as $p}
    {$available = $wa->shop->settings('ignore_stock_count') || $p.count === null || $p.count > 0}
    <li itemscope itemtype ="http://schema.org/Product">
        {if $_product_image_slider}
            {$_max_images_count = 5}
            {$_images_count = (count($_images[$p.id]|default:[]) > $_max_images_count) ? $_max_images_count : count($_images[$p.id]|default:[])}
            {if $_images_count > 1}
                {$_item_width = 100 / $_images_count}
                <div class="product_image_slider image wa-mb-8" onclick="location.href='{$p.frontend_url}'">
                    {foreach $_images[$p.id] as $_image}
                        {if $_image@iteration > $_max_images_count}
                            {break}
                        {/if}
                        {$_left_offset = $_item_width * $_image@index}
                        <div class="image-item">
                            <span class="image-zone" style="left: {$_left_offset}%; width: {$_item_width}%;" aria-hidden="true"></span>
                            {$wa->shop->imgHtml($_image, '200', ['itemprop' => 'image', 'class' => 'image-frame', 'alt' => $p.name, 'default' => "`$wa_theme_url`img/dummy200.png", 'srcset' => "`$wa->shop->imgUrl($_image, '200@2x')` 2x"])}
                            <div class="slider-indicators">
                                {for $i = 1 to $_images_count}
                                    <span class="slider-indicator{if $_image@index != $i - 1} inactive{else} active{/if}"></span>
                                {/for}
                            </div>
                        </div>
                    {/foreach}
                    <meta itemprop="name" content="{$p.name|escape}">
                    <meta itemprop="description" content="{$p.description|strip_tags:false|truncate:'100'}">
                </div>
            {else}
                {_product_image_mini p=$p}
            {/if}
        {else}
            {_product_image_mini p=$p}
        {/if}

        <div class="pricing wa-flex wa-flex-wrap space-05 align-items-center wa-mt-4">
            <span class="price nowrap wa-mb-0">{shop_currency_html($p.price)}</span>{$p.compare_price = 12345}
            {if $available && $p.compare_price > 0}
                <span class="compare-at-price nowrap small"> {shop_currency_html($p.compare_price)}</span>
            {/if}
        </div>

        <a href="{$p.frontend_url}" title="{$p.name}" class="wa-mt-8">
            <h5 class="wa-mb-20"><span itemprop="name">{$p.name}</span></h5>
        </a>

        <div itemprop="offers" class="offers wa-mt-auto" itemscope itemtype="http://schema.org/Offer">
            <meta itemprop="price" content="{shop_currency($p.price, null, null, 0)}">
            <meta itemprop="priceCurrency" content="{$wa->shop->currency()}">

            {if $p.rating > 0}
                <p class="rating nowrap wa-mt-8 wa-mb-8">{$wa->shop->ratingHtml($p.rating, 16)}</p>
            {/if}

            {if $available}
                {if !empty($without_form)}
                    <div class="purchase addtocart" {if $p.sku_count > 1}data-url="{$p.frontend_url}{if strpos($p.frontend_url, '?')}&{else}?{/if}cart=1"{/if}>
                        <button type="button" class="blink" data-product_id="{$p.id}" data-url="{$wa->getUrl('shop/frontendCart/add')}" class="text-white">[`Add to cart`]</button>
                        <a href="{$wa->getUrl('shop/frontend/order')}" class="button blink gotocart-btn wa-hide">
                            [`Added to cart`]
                        </a>
                    </div>
                {else}
                    <form class="purchase addtocart wa-mt-8" {if $p.sku_count > 1}data-url="{$p.frontend_url}{if strpos($p.frontend_url, '?')}&{else}?{/if}cart=1"{/if} method="post" action="{$wa->getUrl('shop/frontendCart/add')}">
                        <input type="hidden" name="product_id" value="{$p.id}">
                        <button type="submit" class="blink">[`Add to cart`]</button>
                        <a href="{$wa->getUrl('shop/frontend/order')}" class="button gotocart-btn wa-hide">
                            [`Added to cart`]
                        </a>
                    </form>
                {/if}
                {if $wa->shop->countPickupLocations() > 0}
                    {$wa->shop->getPickupButton($p)}
                {/if}
                <link itemprop="availability" href="http://schema.org/InStock">
            {else}
                <div class="out-of-stock w-100">
                    <a href="{$p.frontend_url}" title="{$p.name}" class="w-100 gray button">
                        <span>
                            {if $wa->shop->settings('ignore_stock_count')}
                                {_wd('shop', 'Pre-order only')}
                            {else}
                                {_wd('shop', 'Out of stock')}
                            {/if}
                        </span>
                    </a>
                </div>
                <link itemprop="availability" href="http://schema.org/OutOfStock">
            {/if}
        </div>
    </li>
{/foreach}
</ul>

{if isset($pages_count) && $pages_count > 1}
<div class="block {if $theme_settings.pagination == 'lazyloading'}lazyloading-paging{else}paging-nav{/if}" data-loading-str="[`Loading...`]">
    {wa_pagination total=$pages_count attrs=['class' => "menu-h"]}
</div>
{/if}