{% extends 'base.html' %}

{% block title %}
{{ SITENAME }} - Gwent Overview
{% endblock %}

{% block social_media_meta %}
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="{{ SITEURL }}/{{ output_file }}">
<meta property="og:title" content="DeckLock for Gwent - Overview">
<meta property="og:description" content="Overview of {{ articles|selectattr("category", "equalto", "Gwent_Deck")|list|length  }} Gwent Decks">
<meta property="og:image" content="{{ SITEURL }}/theme/img/DeckLock_gwent.jpg">

<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="{{ SITEURL }}/{{ output_file }}">
<meta property="twitter:title" content="DeckLock for Gwent - Overview">
<meta property="twitter:description" content="Overview of {{ articles|selectattr("category", "equalto", "Gwent_Deck")|list|length  }} Gwent Decks">
<meta property="twitter:image" content="{{ SITEURL }}/theme/img/DeckLock_gwent.jpg">
{% endblock %}

{% block extra_css %}
<link href="{{ SITEURL }}/theme/css/gwent.css" rel="stylesheet" />
{% endblock extra_css %}


{% block container %}

    <ol class="breadcrumb top15">
      <li class="breadcrumb-item"><a href="{{ SITEURL }}/index.html">DeckLock</a></li>
      <li class="breadcrumb-item active">Gwent</li>
    </ol>

    <h1>Gwent Decks</h1>

    <div style="max-width:100%;overflow-x:auto">
    <table id="deck_overview" class="table table-striped">
        <thead>
        <tr>
            <th scope="col" data-sort="string-ins">Deck</th>
            <th scope="col" data-sort="float">Gwent Version</th>
        </tr>
        </thead>
        <tbody>
        {% for a in articles|rejectattr('faction', 'undefined')|sort(attribute='name')|sort(attribute='faction')|sort(attribute='num_version', reverse = True) %}
            {% if a.category == "Gwent_Deck" %}
            <tr class="deck {{a.leader.data.faction}}">
                <td><a href="{{ SITEURL }}/{{ a.url }}">{{ a.name }}</a> {% if a.name != a.leader.name -%}<span class="text-muted">({{ a.leader.name }})</span>{%- endif%}</td>
                <td>{{ a.gwent_version }}</td>
            </tr>
            {% endif %}
        {% endfor %}
        </tbody>
    </table>
    </div>
{% endblock %}

{% block extra_js %}
<script src="{{ SITEURL }}/theme/js/stupidtable.min.js"></script>
<script>
$(function(){
  $("#deck_overview").stupidtable();
 });
</script>
{% endblock %}