{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 }" />

<li class="tb-search-result-list__item tb-search-result-list__item--{result.scope} {additionalClass.wrapper}">
    <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>
</li>

<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>
