{assign var=slideItems value=@items}
{if isset($images) && (count($images) > 0) && ($slideItems > 0)}
    <!-- thumbnails -->
    {assign var=imagesCount value=count($images)}
    {assign var=innerStyle value=''}
    {assign var=itemStyle value=''}
    {if ($imagesCount < $slideItems)}
        {math equation="floor(100 / x)" x=$slideItems assign=slidesFloor}
        {math equation="floor(100 / x)" x=$imagesCount assign=imagesFllor}
        {assign var=w value=$slidesFloor*$imagesCount}
        @if (navigation.verticalItems) {
            {assign var=innerStyle value=""}
            {assign var=itemStyle value=""}
        } else {
            {assign var=innerStyle value="style=\"width: {$w}%;margin: 0px auto;\""}
            {assign var=itemStyle value="style=\"width: {$imagesFllor}%;\""}
        }
    {/if}
    
    
    {*if $imagesCount > 3}<span class="view_scroll_spacer"><a id="view_scroll_left" class="hidden" title="{l s='Other views'}" href="javascript:{ldelim}{rdelim}">{l s='Previous'}</a></span>{/if*}
    {assign var=hidden_class value="{if $imagesCount < 2}hidden{/if}"}
    <div id="views_block" class="{$hidden_class} clearfix @classNames carousel slide adjust-slides @if (navigation.verticalItems) {bd-vertical-items} @if (navigation.verticalCarousel) {bd-vertical-arrows}" data-interval="false">
        @if (navigation.verticalCarousel) {
            {if isset($images) && count($images) > $slideItems}
                <div class="bd-left-button">
                    <a class="@navigation.carousel.classNames" href="#">
                        @include("navigation.carousel.icon")
                    </a>
                </div>
            {/if}
        }
        <div id="thumbs_list" class="carousel-inner" {$innerStyle}>
            <!--ul id="thumbs_list_frame"-->
                {if isset($images)}
                    {foreach from=$images item=image name=thumbnails}

                        {if $smarty.foreach.thumbnails.first}
                            <div class="item active">
                        {elseif $smarty.foreach.thumbnails.index % $slideItems == 0}
                            <div class="item">
                        {/if}

                        {assign var=imageIds value="`$product->id`-`$image.id_image`"}
                        {assign var=thickboxImgPath value={$link->getImageLink($product->link_rewrite, $imageIds,'thickbox_default')}}
                        {assign var=largeImgPath value={$link->getImageLink($product->link_rewrite, $imageIds, 'large_default')}}
                        {assign var=mediumImgPath value={$link->getImageLink($product->link_rewrite, $imageIds, 'medium_default')}}
                        {if !empty($image.legend)}
                            {assign var=imageTitle value=$image.legend|escape:'html':'UTF-8'}
                        {else}
                            {assign var=imageTitle value=$product->name|escape:'html':'UTF-8'}
                        {/if}
                        {assign var=imageRel value="smallImage:'{$largeImgPath}'"}

                        <a id="thumbnail_{$image.id_image}" class="@Image.classNames" {$itemStyle} href="{$thickboxImgPath}" title="{$imageTitle}" rel="{$imageRel}" title="{$imageTitle}">
                            <img class="@Image.imageStyle.classNames" src="{$mediumImgPath}" id="thumb_{$image.id_image}" alt="{$imageTitle}" itemprop="image" />
                        </a>

                        {if ($smarty.foreach.thumbnails.index + 1) % $slideItems == 0 || $smarty.foreach.thumbnails.last}
                            </div>
                        {/if}

                    {/foreach}
                {/if}
            <!--/ul-->
        </div>
        {if isset($images) && count($images) > $slideItems}
            @if (navigation.verticalCarousel) {
                <div class="bd-right-button">
                    <a class="@navigation.carousel.classNames" href="#">
                        @include("navigation.carousel.icon")
                    </a>
                </div>
            } else {
                @include("navigation")
            }
        {/if}
    </div>
    {if isset($images) && count($images) > 3}<!--a id="view_scroll_right" title="{l s='Other views'}" href="javascript:{ldelim}{rdelim}">{l s='Next'}</a-->{/if}
{/if}
{if isset($images) && count($images) > 1}
    <p class="resetimg clear no-print">
        <span id="wrapResetImages" style="display: none;">
            {if version_compare($smarty.const._PS_VERSION_,'1.6','<')}
                <img src="{$img_dir}icon/cancel_11x13.gif" alt="{l s='Cancel'}" width="11" height="13"/>
                <a id="resetImages" href="{$link->getProductLink($product)}" onclick="$('span#wrapResetImages').hide('slow');return (false);">
                    {l s='Display all pictures'}
                </a>
            {else}
                <a href="{$link->getProductLink($product)|escape:'html':'UTF-8'}" name="resetImages">
                    <i class="icon-repeat"></i>
                    {l s='Display all pictures'}
                </a>
            {/if}
        </span>
    </p>
{/if}