etiquette/frontends/etiquette_flask/templates/photo_card.html

{# Specific extensions, then specific mimetypes, then general mimtypes #}
{% set thumbnails =
    {
        "svg": "svg",

        "application/zip": "archive",
        "application/x-tar": "archive",

        "archive": "archive",
        "audio": "audio",
        "image": "image",
        "video": "video",
        "text": "txt",

    }
%}
{% macro create_photo_card(photo, view="grid") %}

{% if view == "list" %}
<div class="photo_card photo_card_list" data-id="{{photo.id}}">
    <input type="checkbox" class="photo_card_selector_checkbox" onclick="on_photo_select(event)"/>
    <span class="photo_card_filename"><a target="_blank" href="/photo/{{photo.id}}">{{photo.basename}}</a></span>
    <a class="photo_card_metadata" target="_blank" href="{{photo|file_link}}">{{photo.bytestring}}</a>
</div>
{% else -%}

{% if photo.thumbnail %}
    {% set thumbnail_src = "/thumbnail/" + photo.id + ".jpg" %}
{% else %}
    {% set thumbnail_src =
        thumbnails.get(photo.extension, "") or
        thumbnails.get(photo.mimetype, "") or
        thumbnails.get(photo.simple_mimetype, "") or
        "other"
    %}
    {% set thumbnail_src = "/static/basic_thumbnails/" + thumbnail_src + ".png" %}
{% endif -%}

{% set tag_names_title = [] %}
{% for tag in photo.get_tags() %}
    {% do tag_names_title.append(tag.name) %}
{% endfor -%}

{% set tag_names_title = ", ".join(tag_names_title) %}
{% if tag_names_title %}
    {% set tag_names_inner = "T" %}
{% else %}
    {% set tag_names_inner = "" %}
{% endif -%}

{% set metadata_inner = "" %}
{% if photo.width %}
    {% set metadata_inner = "{m}{w}&times;{h}, ".format(m=metadata_inner, w=photo.width, h=photo.height) %}
{% endif %}
{% if photo.duration %}
    {% set metadata_inner = "{m}{d}, ".format(m=metadata_inner, d=photo.duration_string) %}
{% endif -%}

<div class="photo_card photo_card_grid" data-id="{{photo.id}}">
    <a class="photo_card_thumbnail" target="_blank" href="/photo/{{photo.id}}">
        <img src="{{thumbnail_src}}">
    </a>

    <div class="photo_card_filename">
        <a target="_blank" href="/photo/{{photo.id}}">{{photo.basename}}</a>
    </div>

    <span class="photo_card_tags" title="{{tag_names_title}}">{{tag_names_inner}}</span>

    <span class="photo_card_metadata">
    {{- metadata_inner|safe -}}
    <a target="_blank" href="{{photo|file_link}}">{{photo.bytestring}}</a>
    </span>

    <input type="checkbox" class="photo_card_selector_checkbox" onclick="on_photo_select(event)"/>
</div>
{% endif %}
{% endmacro %}