{% extends 'base.html' %}


{% block feeds %}
    {{ super() }}
    {% if DISQUS_SITENAME %}
        <link rel="alternate" type="application/rss+xml" title="{{ SITENAME }} – komentáře ke článku {{ article.title }}" href="http://{{ DISQUS_SITENAME }}.disqus.com/{{ article.slug|replace('-', '_') }}/latest.rss">
    {% endif %}
{% endblock %}


{% block class %}article{% endblock %}


{% block title %}{{ article.title }} - {{ SITENAME }}{% endblock %}


{% block container %}
<div class="site-navigation">
    <a href="{{ INDEX_URL or SITEURL }}" class="btn btn-primary">
        <i class="fa fa-home"></i> {{ SITENAME }}
    </a>
</div>

<div class="article-container">
    <div class="header">
        <h1>{{ article.title|prevent_line_breaks }}</h1>
        <p class="supressed">
            <time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time>
            <br>
            <a href="#about">{{ article.authors|join(',') }}</a>
        </p>
    </div>

    <div class="content">
        {% if article.is_outdated %}
            <div class="alert alert-warning">
                {{ OUTDATED_ARTICLE_WARNING|markdown }}
            </div>
        {% endif %}
        {{ article.content }}
    </div>

    {% if article.about %}
        <hr>

        <div id="about" class="about">
            <h2 class="supressed">
                {% if ABOUT_HEADING %}
                    {{ ABOUT_HEADING }}
                {% else %}
                    {{ article.authors|join(',') }}

                    {% if article.twitter %}
                        &middot; <a href="http://twitter.com/{{ article.twitter }}" target="_blank">@{{ article.twitter }}</a>
                    {% endif %}
                {% endif %}
            </h2>
            <div class="about-box">
                <div class="about-image">
                    <div class="about-image-crop img-rounded">
                        {% if article.gravatar %}
                            <img src="{{ article.gravatar }}">
                        {% elif article.about_image %}
                            <img src="{{ SITEURL }}/{{ article.about_image }}">
                        {% endif %}
                    </div>
                </div>
                <div class="about-text">
                    {{ article.about|markdown }}
                </div>
            </div>
        </div>
    {% endif %}

    <hr>

    <div id="share" class="share">
        <a href="//www.facebook.com/sharer.php?u={{ (SITEURL + '/' + article.url)|urlencode }}&amp;t={{ (SITENAME + ': ' + article.title)|urlencode }}" target="_blank" class="btn btn-primary-outline">
            <i class="fa fa-facebook-square"></i> Facebook
        </a>
        <a href="//twitter.com/share?url={{ (SITEURL + '/' + article.url)|urlencode }}&amp;text={{ (SITENAME + ': ' + article.title)|urlencode }}" target="_blank" class="btn btn-info-outline">
            <i class="fa fa-twitter-square"></i> Twitter
        </a>
    </div>

    {% if DISQUS_SITENAME %}
        <hr>

        <div class="article-comments" id="comments">
            <div id="disqus_thread"></div>
            <script>
                var disqus_sitename = {{ DISQUS_SITENAME|tojson|safe }};
                var disqus_config = function () {
                    this.page.identifier = {{ article.source_path|tojson|safe }};
                    this.page.title = {{ article.title|tojson|safe }};
                };
                (function() {
                    var d = document, s = d.createElement('script');
                    s.src = '//' + disqus_sitename + '.disqus.com/embed.js';
                    s.setAttribute('data-timestamp', +new Date());
                    (d.head || d.body).appendChild(s);
                })();
            </script>
            <noscript>
                <p class="noscript">Bez JavaScriptu se komentáře nezobrazí.</p>
            </noscript>
        </div>
    {% endif %}
</div>

{% if DISQUS_SITENAME %}
    <hr>

    <div id="feeds" class="feeds">
        <a href="http://{{ DISQUS_SITENAME }}.disqus.com/{{ article.slug|replace('-', '_') }}/latest.rss" class="btn btn-primary-outline">
            <i class="fa fa-feed"></i> Komentáře
        </a>
    </div>
{% endif %}
{% endblock %}


{% block og %}
    <meta property="og:title" content="{{ self.title() }}">
    {% if article.image %}
        <meta name="twitter:card" content="summary_large_image">
        <meta property="og:description" content="{{ self.title() }}">
        <meta property="og:image" content="{{ article.image }}">
    {% else %}
        <meta name="twitter:card" content="summary">
        {% if ABOUT_IMAGE %}
            <meta property="og:image" content="{{ SITEURL }}/{{ ABOUT_IMAGE }}">
        {% endif %}
    {% endif %}
    {% if TWITTER_USERNAME_SITE %}
        <meta name="twitter:site" content="@{{ TWITTER_USERNAME_SITE }}">
    {% endif %}
    {% if article.twitter %}
        <meta name="twitter:creator" content="@{{ article.twitter }}">
    {% endif %}
{% endblock %}