pyfedi/app/templates/post/_post_teaser_masonry.html

{# do not use any back ticks in the HTML produced by this template - javascript needs to load it as a string. See community.html #}
{% set content_blocked = post.blocked_by_content_filter(content_filters)
                         or (current_user.hide_nsfw == 3 and post.nsfw)
                         or (current_user.hide_nsfl == 3 and post.nsfl)
                         or (current_user.ignore_bots == 3 and post.from_bot) -%}
{% set blur_content = (current_user.hide_nsfw == 2 and post.nsfw)
                   or (current_user.hide_nsfl == 2 and post.nsfl)
                   or (current_user.ignore_bots == 2 and post.from_bot) -%}
{% if content_blocked and content_blocked == '-1' %}
    {# do nothing - blocked by keyword filter #}
{% else %}
    {% set post_title = post.title.replace('`', "'") %}
    <div class="item{{ ' reported' if post.reports > 0 and current_user.is_authenticated and post.community.is_moderator() }}{{ ' blocked' if content_blocked }}{{ ' blur' if blur_content }}"
        {% if content_blocked %} title="{{ _('Filtered: ') }}{{ content_blocked }}"{% endif %}>
        {% if post.image_id and not (post.url and (post.url.endswith('.mp4') or post.url.endswith('.webm'))) %}
            <div class="masonry_thumb" title="{{ post_title }}">
                {% if post.type == POST_TYPE_LINK or post.type == POST_TYPE_VIDEO %}
                    {% if post.image.medium_url() %}
                        <a href="{{ post.url }}" rel="nofollow ugc" target="_blank" aria-label="{{ _('View image') }}"><img src="{{ post.image.medium_url() }}"
                           alt="{{ post.image.alt_text if post.image.alt_text else '' }}" title="{{ post_title }}"
                           loading="lazy" width="{{ post.image.width }}" height="{{ post.image.height }}" /></a>
                    {% elif post.image.source_url %}
                        <a href="{{ post.url }}" rel="nofollow ugc" target="_blank" aria-label="{{ _('View image') }}"><img src="{{ post.image.source_url }}"
                           alt="{{ post.title.replace('`', "'") }}" title="{{ post_title }}" loading="{{ 'lazy' if low_bandwidth else 'eager' }}" /></a>
                    {% else %}
                        <a href="{{ post.url }}" rel="nofollow ugc" target="_blank" aria-label="{{ _('View image') }}"><img src="{{ post.url }}"
                           alt="{{ post_title }}" title="{{ post_title }}"
                           loading="{{ 'lazy' if low_bandwidth else 'eager' }}" /></a>
                    {% endif %}
                {% elif post.type == POST_TYPE_IMAGE %}
                        <a href="{{ post.image.view_url(resize=True) }}" rel="nofollow ugc" target="_blank"><img src="{{ post.image.medium_url() }}"
                        alt="{{ post.image.alt_text if post.image.alt_text else '' }}" title="{{ post_title }}"
                        loading="lazy" width="{{ post.image.width }}" height="{{ post.image.height }}" /></a>
                {% else %}
                    <a href="{{ url_for('activitypub.post_ap', post_id=post.id) }}"><img src="{{ post.image.thumbnail_url() }}"
                        alt="{{ post.image.alt_text if post.image.alt_text else '' }}" loading="{{ 'lazy' if low_bandwidth else 'eager' }}" /></a>
                {% endif %}
            </div>
        {% else %}
            {% if post.url and (post.url.endswith('.jpg') or post.url.endswith('.webp') or post.url.endswith('.png') or post.url.endswith('.gif') or post.url.endswith('.avif')  or post.url.endswith('.jpeg')) %}
                <div class="masonry_thumb" title="{{ post_title }}">
                    <a href="{{ post.url }}" rel="nofollow ugc" target="_blank" aria-label="{{ _('View image') }}"><img src="{{ post.url }}"
                           alt="{{ post_title }}" title="{{ post_title }}"
                           loading="{{ 'lazy' if low_bandwidth else 'eager' }}" /></a>
                </div>
                <div class="masonry_info">
                    <div class="row">
                        <div class="col col-2">
                            {% include "post/_post_voting_buttons_masonry.html" %}
                        </div>
                        <div class="col col-8">
                            <p><a href="{{ url_for('activitypub.post_ap', post_id=post.id) }}" title="{{ post_title }}">{{ post_title }}</a></p>
                        </div>
                        <div class="col col-2 reply_col">
                            <a href="{{ url_for('activitypub.post_ap', post_id=post.id, sort='new' if sort == 'active' else None, _anchor='post_replies') }}" aria-label="{{ _('View comments') }}" aria-hidden="true"><span class="fe fe-reply"></span></a>
                            {% if post.reply_count %}<a href="{{ url_for('activitypub.post_ap', post_id=post.id, sort='new' if sort == 'active' else None, _anchor='post_replies') }}" aria-label="{{ _('View comments') }}">{{ post.reply_count }}</a>{% endif %}
                        </div>
                    </div>

                </div>
            {% elif post.url and (post.url.endswith('.mp4') or post.url.endswith('.webm')) -%}
                <div class="masonry_thumb" title="{{ post_title }}">
                    <video class="responsive-video" controls preload="auto" {{ 'autoplay muted' if autoplay }} {{ 'loop' if post.community.loop_videos() }}>
                        {% if post.url.endswith('.mp4') -%}
                            <source src="{{ post.url }}" type="video/mp4" />
                        {% elif post.url.endswith('.webm') -%}
                            <source src="{{ post.url }}" type="video/webm" />
                        {% endif -%}
                    </video>
                </div>
            {% else %}
            <div class="masonry_info_no_image">
                <p><a href="{{ url_for('activitypub.post_ap', post_id=post.id) }}"></a></p>
            </div>
            {% endif %}
        {% endif %}
        <div class="masonry_info">
            <div class="row">
                <div class="col col-3">
                    <div class="voting_buttons_masonry">
                    {% include "post/_post_voting_buttons_masonry.html" %}
                    </div>
                </div>
                <div class="col col-8">
                    <p><a href="{{ url_for('activitypub.post_ap', post_id=post.id) }}" title="{{ post_title }}">{{ post_title }}</a></p>
                </div>
                <div class="col col-1 reply_col">
                    <a href="{{ url_for('activitypub.post_ap', post_id=post.id, sort='new' if sort == 'active' else None, _anchor='post_replies') }}" aria-label="{{ _('View comments') }}" aria-hidden="true"><span class="fe fe-reply"></span></a>
                    {% if post.reply_count %}<a href="{{ url_for('activitypub.post_ap', post_id=post.id, sort='new' if sort == 'active' else None, _anchor='post_replies') }}" aria-label="{{ _('View comments') }}">{{ post.reply_count }}</a>{% endif %}
                </div>
            </div>
        </div>
    </div>
{% endif %}