{% load i18n cms_tags extra_tags thumbnail %}
{% comment %}Obviously, the context template variable "program" is required and must be a Program page extension{% endcomment %}
{% with program_page=program.extended_object %}
<a href="{{ program.extended_object.get_absolute_url }}" class="program-glimpse program-glimpse--link{% if program.extended_object.publisher_is_draft %} program-glimpse--draft{% endif %}" >
    <div class="program-glimpse__media">
    {% get_page_plugins "program_cover" program_page as plugins or %}
        <div class="program-glimpse__empty">{% trans 'Cover' %}</div>
    {% endget_page_plugins %}
    {% blockplugin plugins.0 %}
    <img src="{% thumbnail instance.picture 300x170 crop upscale subject_location=instance.picture.subject_location %}"
        srcset="
        {% thumbnail instance.picture 300x170 crop upscale subject_location=instance.picture.subject_location %} 300w
        {% if instance.picture.width >= 600 %},{% thumbnail instance.picture 600x340 crop upscale subject_location=instance.picture.subject_location %} 600w{% endif %}
        {% if instance.picture.width >= 900 %},{% thumbnail instance.picture 900x510 crop upscale subject_location=instance.picture.subject_location %} 900w{% endif %}
        "
        sizes="300px"
        alt=""
    />
    {% endblockplugin %}
    </div>
    <div class="program-glimpse__content">
        <div class="program-glimpse__wrapper">
            <p class="program-glimpse__title">{{ program_page.get_title }}</p>
            <p>
                {% show_placeholder "program_excerpt" program_page %}
            </p>
        </div>
    </div>
</a>
{% endwith %}
