{% extends "django_cos/pages/web_page.html" %}

{% load wagtailadmin_tags wagtailcore_tags wagtailimages_tags django_cos_tags %}

{% block description %}{{self.get_description}}{% endblock %}
{% block html_seo_extra %}
{% if self.get_author_name %}<meta name="author" content="{{self.get_author_name}}" />{% endif %}
<meta name="created" content="{{self.get_pub_date|date:'c'}}" />
<meta name="revised" content="{{self.last_published_at|date:'c'}}" />
{% if settings.django_cos.SeoSettings.amp_pages %}
<link rel="amphtml" href="{{self.get_full_url}}?amp">
{% endif %}
{% endblock %}

{% if settings.django_cos.SeoSettings.og_meta %}
    {% block og_description %}{{self.get_description}}{% endblock %}
    {% block og_type %}article{% endblock %}
    {% block og_seo_extra %}
        <meta property="og:article:published_time" content="{{self.get_pub_date}}" />
        <meta property="og:article:modified_time" content="{{self.last_published_at}}" />
        {% if self.author_display %}
        <meta property="og:article:author" content="{{self.author_display}}" />
        {% elif self.author %}
        <meta property="og:article:author:first_name" content="{{self.author.first_name}}" />
        <meta property="og:article:author:last_name" content="{{self.author.last_name}}" />
        {% endif %}
    {% endblock %}
{% endif %}

{% if settings.django_cos.SeoSettings.twitter_meta %}
    {% block twitter_card %}{% if self.cover_image %}summary_large_image{% else %}{{block.super}}{% endif %}{% endblock %}
    {% block twitter_seo_extra %}
        {% if self.author.twitter %}
            <meta name="twitter:creator" content="{{self.author.twitter}}" />
        {% endif %}
    {% endblock %}
{% endif %}

{% block content %}
    <article class="django-cos-article {%if self.cover_image %}has-img{% endif %}">
        {% if self.cover_image %}
        {% image self.cover_image fill-2000x1000 as cover_image %}
        <img src="{{cover_image.url}}" class="w-100" />
        {% endif %}
        <div class="container">
            <div class="article-header">
                <h1 {% if not self.cover_image %}class="mt-5"{% endif %}>{{ self.title }}</h1>
                {% if self.caption %}
                <p class="lead">{{self.caption}}</p>
                {% endif %}
                <p>
                    {% if self.author_display %}
                    <span class="article-author">{{self.get_author_name}}</span>
                    {% elif self.author %}
                    <img class="article-author-img rounded-circle mr-2" src="{% avatar_url self.author %}">
                    <span class="article-author">{{self.get_author_name}}</span>
                    {% endif %}

                    {% if self.get_author_name and self.get_pub_date %}
                    <span class="mx-2">&bull;</span>
                    {% endif %}

                    {% if self.get_pub_date %}
                    <span class="article-date">{{ self.get_pub_date }}</span>
                    {% endif %}
                </p>
                <hr>
            </div>
            <div class="article-body">
                {% include_block self.body with settings=settings %}
            </div>
        </div>
    </article>
{% endblock %}

{% if settings.django_cos.SeoSettings.struct_meta %}
    {% block struct_seo_extra %}
    <script type="application/ld+json">
        {% include "django_cos/includes/struct_data_article.json" with page=self %}
    </script>
    {% endblock %}
{% endif %}
