<!-- Article -->
<article
        class="search-block product-block content-block column fluid-100 @if($product->bypass) filter-bypass @else filter-no-bypass @endif @if($product->fine_dust_filter) filter-fine-dust-filter @else filter-regular-filter @endif">
    <figure class="image-holder column fluid-16">
        @if( isset($product->small_image_url) && file_exists($_SERVER['DOCUMENT_ROOT'] . $product->small_image_url) )
            <img src="{{ $product->small_image_url }}" alt="filter"/>
        @else
            <img src="/images/structure/noImage.jpg" alt="No image found"/>
        @endif
        @if( isset($product->small_brand_image_url) )
            <img src="{{ $product->small_brand_image_url }}" alt="merk" class="brand"/>
        @endif
    </figure>
    <div class="product-information column fluid-50">
        <h2 class="product-title">
            <a href="/{{ $product->route }}">
                @include('partials.products.title')
            </a>
        </h2>

            <span class="article-number">
                @if($product->article_number and $product->article_number != '-')
                    {{ Lang::get('pages/products.article_number') }} <strong>{{ $product->supplier_name }}</strong>:
                    {{ $product->article_number }}
                    <br/>
                @endif
                {{ Lang::get('pages/products.article_number') }} <strong>TOPS</strong>:
                {{ $product->internal_article_number }}
            </span>

        <?php if (isset($product->composition)) $product->composition = json_decode($product->composition); ?>

        @if(isset($product->composition) && is_array($product->composition) && count($product->composition))
            <span class="product-composition-title">{{ Lang::get('pages/products.you_will_receive')}}:</span>
            @include('partials.composition', ['composition' => $product->composition])
        @endif
        <a class="read-more" href="/{{ $product->route }}">{{ Lang::get('pages/products.read_more') }}</a>
    </div>
    <div class="buying-options column fluid-33">
        <div class="inner" ng-controller="productOverviewItemController">

            <script type="application/json" json-data ng-model="discountData">{{ $product->discounts }}</script>

            <span class="discount-percentage" ng-show="showDiscountPercentage() > 0" data-ng-cloak>
                -@{{ showDiscountPercentage() }}%
                    <span ng-show="showFractionDiscount() > 0" data-ng-cloak>
                                + @{{ showFractionDiscount() }}  {{ \lang::get('pages/products.free') }}
                    </span>
            </span>

            <div>
                <span class="price" ng-bind-html="showDiscountPrice() | currency:'€' | smallAfterCommaFilter">
                    {{ Format::asPrice($product->price, ['currency'=>'€']) }}
                </span>
                <span class="original-price" data-original-price="{{ $product->price }}"
                      ng-show="showDiscountPercentage() > 0">
                    {{ Format::asFlatPrice($product->price, ['currency' => '€']) }}
                </span>
                <span class="price-info">
                    @if($product->product_group == 'filterset' ||$product->product_group == 'filtergrepen' )
                        {{ Lang::get('pages/products.units.per_set') }}
                    @elseif($product->product_group == 'filter')
                        {{ Lang::get('pages/products.units.per_filter') }}
                    @else
                        {{ Lang::get('pages/products.units.per_unit') }}
                    @endif
                </span>
            </div>

            <form class="order-row"
                  action="/{{ $shop->getPageService()->page('cart')->route }}/addProductById/{{ $product->id }}"
                  method="get">

                <div class="quantity-holder">
                    <input type="tel" name="quantity" ng-value="1" ng-model="quantity"/>

                    <div class="quantity-btns">
                        <div class="quantity-btn add" ng-click="addToQuantity(1)"></div>
                        <div class="quantity-btn remove" ng-click="addToQuantity(-1)"></div>
                    </div>
                </div>
                <div class="btn-holder">
                    <input class="btn list-cart-btn" type="submit" value="{{Lang::get('pages/products.add_to_cart')}}"/>
                    <span class="arrow"></span>
                </div>

            </form>

            <span class="in-stock">{{ Lang::get('pages/products.shippable_from_stock') }}</span>
        </div>
    </div>
</article>