{% extends this_string_will_be_replaced %}

{% load i18n %}
{% load static %}

<!-- load custom template tags -->
{% load unicms_carousels %}
{% load unicms_contexts %}
{% load unicms_menus %}
{% load unicms_templates %}
{% load unicms_pages %}
{% load unicms_publications %}

<!-- SEO  -->
{% block page_title %}{{ publication_context.publication.title }}{% endblock page_title %}
{% block page_meta_description %}{{ publication_context.publication.subheading }}{% endblock page_meta_description %}
{% block page_meta_keywords %}{% for tag in publication_context.publication.tags.all %}{{ tag }},{% endfor %}{% endblock page_meta_keywords %}

{% block social_tags %}
<meta property="og:url" content="{{ request.build_absolute_uri }}" />
<meta property="og:type" content="article" />
<meta property="og:title" content="{{ publication_context.publication.title }}" />
<meta property="og:description" content="{{ publication_context.publication.subheading }}" />
<meta property="og:image" content="{{ request.scheme }}://{{ request.get_host }}{{ publication_context.publication.image_url }}" />
<meta property="og:image:alt" content="{{ publication_context.publication.title }}" />
<meta property="og:image:width" content="600" />
<meta property="og:image:height" content="314" />

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="{{ publication_context.publication.title }}">
<meta name="twitter:description" content="{{ publication_context.publication.subheading }}">
<meta name="twitter:image" content="{{ request.scheme }}://{{ request.get_host }}{{ publication_context.publication.image_url }}">
<meta name="twitter:image:alt" content="{{ publication_context.publication.title }}">
{% endblock social_tags %}

{% block container %}
{% breadcrumbs webpath=webpath leaf=handler %}
{% settings_value "CMS_PATH_PREFIX" as cms_path_prefix %}

{% with publication_context.publication.related_embedded_links as related_embedded_links %}

<div class="container">
    <div class="col-12 py-5 bd-content">
        {% block centered_container %}
        <div class="row">
            <div class="col-12 col-lg-8">
                <div class="mb-3">
                {% for category in publication_context.publication.categories %}
                    <span class="badge rounded-pill badge-grey-unical my-1 me-1 py-2 px-4">
                        <div>
                            <a class="no-color" href="{% call obj=publication_context method='get_url_list' category_name=cat %}?category_name={{ category }}">
                                <h5>
                                    <span>
                                        {{ category }}
                                    </span>
                                </h5>
                            </a>
                        </div>
                    </span>
                {% endfor %}
                </div>

                <div class="mb-3 text-end">
                    {% include "includes/social_share.html" with share_title=publication_context.publication.title share_url=request.build_absolute_uri %}
                </div>

                <p class="text-muted">
                    <svg class="icon icon-xs me-2">
                        <use xlink:href="{% static 'svg/sprites.svg' %}#it-clock"></use>
                    </svg> {% trans "Published" %} {{ publication_context.date_start }}
                    {% include "includes/edit_news.html" with item=publication_context %}
                </p>

                <h1 class="mb-4 lighter">
                    {{ publication_context.publication.title }}
                </h1>

                <p class="bigger-font">{{ publication_context.publication.subheading }}</p>

                {% if publication_context.publication.presentation_image %}
                <div class="img-wrapper pb-3">
                    <img src="{{ publication_context.publication.presentation_image.get_media_path }}"
                         title="{{ publication_context.publication.presentation_image.title }}"
                         alt="{{ publication_context.publication.presentation_image.description }}"
                         class="w-100"
                         loading="lazy">
                </div>
                {% elif related_embedded_links %}
                <div class="row mb-2">
                    {% include "blocks/italia_link_iframe.html" with url=related_embedded_links.0.url ratio="16x9" %}
                </div>
                {% elif publication_context.publication.preview_image %}
                <div class="img-wrapper mb-3 pe-3 pt-2 float-start w-50 mw-100">
                    <img src="{{ publication_context.publication.preview_image.get_media_path }}"
                         title="{{ publication_context.publication.preview_image.title }}"
                         alt="{{ publication_context.publication.preview_image.description }}"
                         class="w-100"
                         loading="lazy">
                </div>
                {% endif %}

                {{ publication_context.publication.html_content|safe }}

                {% if publication_context.publication.tags.all %}
                <h4>{% trans "tags" %}</h4>
                <p style="font-size: 1.2rem">
                {% for tag in publication_context.publication.tags.all %}
                    <span class="badge badge-grey-unical square-corners">
                        <a href="/{{ cms_path_prefix }}search/?tags={{ tag.name }}" class="no-color">
                            <svg class="icon icon-xs">
                                <use xlink:href="{% static 'svg/sprites.svg' %}#it-pin"></use>
                            </svg> {{ tag.name }}
                        </a>
                    </span>
                {% endfor %}
                </p>
                {% endif %}

                {% if publication_context.publication.related_media_collections %}
                <hr>

                <br>

                    {% for gallery in publication_context.publication.related_media_collections %}

                        {% include "italia_media_collection_image_slider.html" with collection=gallery.collection %}

                    {% endfor %}
                {% endif %}

            <!-- END PUBLICATION BODY -->
            </div>

            <div class="col-12 col-lg-3 offset-lg-1 mt-5 mt-lg-0">
                <h4>{% trans "Published in" %}</h4>
                <hr />
                <ul class="list-unstyled">
                {% for pub_context in publication_context.publication.related_contexts %}
                    {% get_site_path webpath=pub_context.webpath as path %}
                    <li>
                        <a class="no-color" href="{{ path }}">
                            <span>{{ pub_context.webpath.name }}</span>
                        </a>
                    </li>
                {% endfor %}
                </ul>

                {% if related_embedded_links %}

                {% for link in related_embedded_links %}
                {% if publication_context.publication.presentation_image or not forloop.first %}
                <div class="row mb-4">
                    <div class="col">
                        {% include "blocks/italia_link_iframe.html" with url=link.url ratio="16x9" %}
                    </div>
                </div>
                {% endif %}
                {% endfor %}
                {% endif %}

                {% if publication_context.publication.related_publications %}
                <div class="background-light-grey px-2 py-3 mb-2 w-100">
                    <div class="row">
                        <div class="col-2">
                            <b>
                                <svg class="icon">
                                    <use xlink:href="{% static 'svg/sprites.svg' %}#it-arrow-right-circle"></use>
                                </svg>
                            </b>
                        </div>
                        <div class="col m-auto align-middle">
                            <ul class="mb-0 ps-0 list-unstyled">
                            {% for related_pub in publication_context.publication.related_publications %}
                                <li>
                                    <a class="no-color" href="{{ related_pub.first_available_url }}">
                                        <small><b>- {{ related_pub.related }}</b></small>
                                    </a>
                                </li>
                            {% endfor %}
                            </ul>
                        </div>
                    </div>
                </div>
                {% endif %}

                {% with publication_context.publication.related_plain_links as related_links %}
                {% if related_links %}
                <div class="background-light-grey px-2 py-3 mb-2 w-100">
                    <div class="row">
                        <div class="col-2 text-center" style="font-size: x-large">
                            <b>@</b>
                        </div>
                        <div class="col m-auto align-middle">
                            <ul class="mb-0 ps-0 list-unstyled">
                            {% for link in related_links %}
                                <li>
                                    <a class="no-color" href="{{ link.url }}">
                                        <small><b>- {{ link.name }}</b></small>
                                    </a>
                                </li>
                            {% endfor %}
                            </ul>
                        </div>
                    </div>
                </div>
                {% endif %}
                {% endwith %}

                {% with publication_context.publication.get_plain_attachments as attachments %}
                {% if attachments %}
                <div class="background-light-grey px-2 py-3 mb-2 w-100">
                    <div class="row">
                        <div class="col-2">
                            <b>
                                <svg class="icon">
                                    <use xlink:href="{% static 'svg/sprites.svg' %}#it-files"></use>
                                </svg>
                            </b>
                        </div>
                        <div class="col m-auto align-middle">
                            <ul class="mb-0 ps-0 list-unstyled">
                            {% for item in attachments %}
                                <li>
                                    <a class="no-color" href="{{ item.file.url }}">
                                        <small><b>- {{ item.name }}</b></small>
                                    </a>
                                </li>
                            {% endfor %}
                            </ul>
                        </div>
                    </div>
                </div>
                {% endif %}
                {% endwith %}

                {% if publication_context.publication.available_in_languages %}
                <div class="background-light-grey px-2 py-3 mb-2 w-100">
                    <div class="row">
                        <div class="col-2">
                            <b>
                                <svg class="icon">
                                    <use xlink:href="{% static 'svg/sprites.svg' %}#it-comment"></use>
                                </svg>
                            </b>
                        </div>
                        <div class="col m-auto align-middle">
                            <ul class="mb-0 ps-0 list-unstyled">
                            {% for lang,language in publication_context.publication.available_in_languages %}
                                <li>
                                    <small><b>- {{ language }}</b></small>
                                </li>
                            {% endfor %}
                            </ul>
                        </div>
                    </div>
                </div>
                {% endif %}

            </div>

        </div>

        {% endblock %}
    </div>
</div>
{% endwith %}
{% endblock container %}
