{namespace vh=Newland\NeosViewHelpers\ViewHelpers}
{namespace components=Newland\NeosCommon\ViewHelpers}
{namespace common=Newland\Toubiz\Common\Neos\ViewHelpers}
{namespace poi=Newland\Toubiz\Poi\Neos\ViewHelpers}

<common:slot.render slot="SearchResult" context="{ articles: articles }" />

<a
    href="{url}"
    class="tb-search-result-list__link {additionalClass.link}"
    itemscope="itemscope"
    itemtype="{schemaOrg.itemType}"
    itemid="urn:uuid:{result.identifier}"
>

    <article>
        <header>
            <p class="tb-teaser__topline">
                <f:if condition="{article.flatAttributes.difficultyRating}
                    || {article.flatAttributes.difficultyRating.hasContents}">
                    <strong>
                        <vh:translate
                            id="property.attribute.difficultyRating.values.{article.flatAttributes.difficultyRating.intValue}"
                            package="Newland.Toubiz.Poi.Neos"
                            source="Models/Article" />

                    </strong>
                    •
                </f:if>

                <f:if condition="{article.categoriesSorted.0.title}">
                    <span class="uppercase">{article.categoriesSorted.0.title}</span>
                </f:if>

                <f:if condition="({article.mainType} !== 2)
                    && ({article.mainAddress.city} || {article.addresses.0.street -> vh:string.notEmpty()})"
                >
                    •
                    <span itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
                        <f:if condition="{article.mainAddress.city}">
                            <span itemprop="addressLocality">{article.mainAddress.city}</span>
                        </f:if>
                        <f:if condition="{article.addresses.0.street -> vh:string.notEmpty()}">
                            <span class="hidden print:block">
                                {article.addresses.0.street}
                            </span>
                        </f:if>
                    </span>
                </f:if>
            </p>

            <h3 class="tb-search-result-list__title {additionalClass.title} tb-teaser__title">
                {title -> f:format.htmlentitiesDecode()}

                <f:if condition="{article.starClassifications}">
                <span class="tb-badge">
                    {article.starClassifications.0.label}
                </span>
                </f:if>
            </h3>

            <f:if condition="{article.averageRating} > 0">
                <div
                    class="tb-rating mb-2"
                    itemprop="aggregateRating"
                    itemscope
                    itemtype="http://schema.org/AggregateRating">

                    <vh:render section="starRatingContent" arguments="{article.flatAttributes.difficultyRating}" />

                    ( {article.numberOfRatings}
                    <vh:translate
                    id="property.attribute.totalVotes"
                    package="Newland.Toubiz.Poi.Neos"
                    source="Views/Teaser" />
                    )
                </div>

            </f:if>
        </header>

        <f:if condition="{article.description} || {article.abstract}">
            <div class="tb-search-result-list__content {additionalClass.content}">
                <p>
                    <f:if condition="{article.abstract}">
                        <f:then>
                            <vh:format.crop
                                maxCharacters="250"
                                append="..."
                                input="{article.abstract -> f:format.htmlentitiesDecode()}"
                                respectWordBoundaries="true"
                            />
                        </f:then>
                        <f:else>
                            <vh:format.crop
                                maxCharacters="250"
                                append="..."
                                input="{article.description -> f:format.htmlentitiesDecode()}"
                                respectWordBoundaries="true"
                            />
                        </f:else>
                    </f:if>
                </p>
                <f:if condition="{image}">
                    <div class="tb-search-result-list__image-wrapper {additionalClass.imageWrapper}">
                        <f:if condition="{useStaticImageUri}">
                            <f:then>
                                <img data-src="{imageUri}" class="lazyload {additionalClass.image}" />
                            </f:then>
                            <f:else>
                                <img data-src="{image.sourceUri}" alt="{image.title}" class="lazyload {additionalClass.image}" />
                            </f:else>
                        </f:if>
                    </div>
                </f:if>
            </div>
        </f:if>
    </article>
</a>

<components:pagination
    currentPage="{pagination.page}"
    totalPageCount="{pagination.count.pages}"
/>

<f:section name="starRatingContent">
    <ul class="tb-rating" itemprop="ratingValue">
        <f:for each="{poi:ratingAverage(ratingValue: article.averageRating)}" as="item">
            <li class="tb-rating__item {f:if(condition: item, then: 'tb-rating__item--{item}')}"></li>
        </f:for>
    </ul>
    <f:if condition="{numberOfRatings} > 0">
        <p class="tb-rating__votes">
            (
            <span itemprop="reviewCount">{numberOfRatings}</span>
            <vh:translate
                id="property.attribute.totalVotes"
                package="Newland.Toubiz.Poi.Neos"
                source="Views/Teaser" />
            )
        </p>
    </f:if>
</f:section>