{extends file='layout.tpl'}

{block name="init"}
{$category_id={category attr="id"}}
{/block}


{* Body Class *}
{block name="body-class"}page-category{/block}

{* Page Title *}
{block name='no-return-functions' append}
{if $category_id}
    {loop name="category.seo.title" type="category" id=$category_id limit="1"}
        {$page_title = $META_TITLE}
    {/loop}
{/if}
{/block}

{* Meta *}
{block name="meta"}
{if $category_id}
    {loop name="category.seo.meta" type="category" id=$category_id limit="1"}
        {include file="includes/meta-seo.html"}
    {/loop}
{/if}
{/block}

{* Feeds *}
{block name="feeds"}
{if $category_id}
    <link rel="alternate" type="application/rss+xml" title="{intl l='All products in'} {category attr='title'}" href="{url path="/feed/catalog/%lang/%category_id" lang={lang attr="locale"} category_id={category attr="id"}}" />
{/if}
{/block}

{* Breadcrumb *}
{block name='no-return-functions' append}
{if $category_id}
    {$breadcrumbs = []}
    {loop name="category_path" type="category-path" category=$category_id}
        {$breadcrumbs[] = ['title' => {$TITLE}, 'url'=> {$URL nofilter}]}
    {/loop}
{/if}
{/block}

{* Content *}
{block name="main-content"}

{$limit={$smarty.get.limit|default:8}}
{$product_page={$smarty.get.page|default:1}}
{$product_order={$smarty.get.order|default:'alpha'}}

{hook name="category.top" category="$category_id"}

    <div class="main row">

        {hook name="category.main-top" category="$category_id"}

        <article class="col-main col-md-9 col-md-push-3 {$smarty.get.mode|default:"grid"}" role="main">

            {hook name="category.content-top" category="$category_id"}

            {if #category_display_detail# && $category_id}
            <section class="category-description">
                {loop name="category.description" type="category" id={$category_id} limit="1" }
                    <h1 id="main-label" class="page-header">{category attr="title"}</h1>
                    {loop name="category.image" type="image" source="category" source_id={$ID} width=218 height=146 resize_mode="borders"}
                    <p><img itemprop="image" src="{$IMAGE_URL nofilter}" alt="{$TITLE}"></p>
                    {/loop}
                    {if $DESCRIPTION}
                    <div class="description">
                        {$DESCRIPTION nofilter}
                    </div>
                    {/if}
                    {if $POSTSCRIPTUM}
                    <small class="postscriptum">
                        {$POSTSCRIPTUM}
                    </small>
                    {/if}
                {/loop}
            </section>
            <hr/>
            {/if}

            {if #category_display_subcategories#}
            {ifloop rel="subcategories"}
                <div class="block-links">
                    <div class="block-content">
                        <ul>
                            {loop name="subcategories" type="category" parent=$category_id}
                                <li>
                                    <a href="{$URL}">{$TITLE}</a>
                                </li>
                            {/loop}
                        </ul>
                    </div>
                </div>
            {/ifloop}
            {/if}

            {ifloop rel="product_list"}
                {$amount={count type="product" category=$category_id}}

                {include file="includes/toolbar.html" toolbar="top" limit=$limit order=$product_order amount={$amount}}

                <div id="category-products">
                    <div class="products-content">
                        <ul class="list-unstyled row">
                            {loop type="product" name="product_list" category=$category_id limit=$limit page=$product_page order=$product_order}
                                {include file="includes/single-product.html" product_id=$ID hasBtn=true hasDescription=true hasQuickView=true width="218" height="146"}
                            {/loop}
                        </ul>
                    </div>
                </div><!-- /#category-products -->

                {include file="includes/toolbar.html" toolbar="bottom" amount={$amount}}
            {/ifloop}

            {elseloop rel="product_list"}
                <div class="alert alert-warning">
                    {intl l="No products available in this category"}
                </div>
            {/elseloop}

            {hook name="category.content-bottom" category="$category_id"}
        </article>

        <aside class="col-left col-md-3 col-md-pull-9" role="complementary" itemscope itemtype="http://schema.org/WPSideBar">
            {include file="includes/menu.html"}
        </aside>

        {hook name="category.main-bottom" category="$category_id"}

    </div>
    {hook name="category.bottom" category="$category_id"}
{/block}


{block name="stylesheet"}
{hook name="category.stylesheet"}
{/block}

{block name="after-javascript-include"}
{hook name="category.after-javascript-include"}
{/block}

{block name="javascript-initialization"}
{hook name="category.javascript-initialization"}
{/block}
