{%- import "macros/ptcg.html" as ptcg -%}
{%- set deck = load_data(path="@/ptcg/decks/" ~ name ~ ".toml") -%}

{% if nth == 1 %}
<script src="{{ get_url(path='ptcg.js') }}" async></script>
{% if config.mode == "serve" %}
<script src="{{ get_url(path='ptcg-icons.js') }}" async></script>
{% endif %}
{% endif %}

{% set pokemon_count = 0 %}
{% for card in deck.pokemon %}
	{% set_global pokemon_count = pokemon_count + card.amount %}
{% endfor %}
{% set trainers_count = 0 %}
{% for card in deck.trainers %}
	{% set_global trainers_count = trainers_count + card.amount %}
{% endfor %}
{% set energies_count = 0 %}
{% for card in deck.energies %}
	{% set_global energies_count = energies_count + card.amount %}
{% endfor %}


<div class="ptcg-deck" id="deck-{{ nth }}">
	<h1>{{ deck.name }} ({{ pokemon_count + trainers_count + energies_count }})</h1>
	<h2>Pokémon ({{ pokemon_count }})</h2>
	{% for card in deck.pokemon %}
	{% set card_data = load_data(path="@/ptcg/cards/" ~ card.id ~ ".toml") %}
		<div
			id="pokemon-{{loop.index}}"
			class="ptcg-label{% if loop.first %} selected{% endif %}"
			aria-selected="{{ loop.first }}" 
			aria-controls="tab-pokemon-{{ loop.index }}">
			{{ card.amount}} {{ card_data.name }}
		</div>
	{% endfor %}
	<h2>{{ trans(key="ptcg-trainers", lang=lang) }} ({{ trainers_count }})</h2>
	{% for card in deck.trainers %}
	{% set card_data = load_data(path="@/ptcg/cards/" ~ card.id ~ ".toml") %}
		<div
			id="trainer-{{loop.index}}"
			class="ptcg-label"
			aria-selected="false" 
			aria-controls="tab-trainer-{{ loop.index }}">
			{{ card.amount}} {{ card_data.name }}
		</div>
	{% endfor %}
	<h2>{{ trans(key="ptcg-energies", lang=lang) }} ({{ energies_count }})</h2>
	{% for card in deck.energies %}
	{% set card_data = load_data(path="@/ptcg/cards/" ~ card.id ~ ".toml") %}
		<div
			id="energy-{{loop.index}}"
			class="ptcg-label"
			aria-selected="false" 
			aria-controls="tab-energy-{{ loop.index }}">
			{{ card.amount}} {{ card_data.name }}
		</div>
	{% endfor %}
	{% for card_it in deck.pokemon %}
	{% set card = load_data(path="@/ptcg/cards/" ~ card_it.id ~ ".toml") %}
		<div id="tab-pokemon-{{ loop.index }}" 
				 class="ptcg-tab-content{% if loop.first %} selected{% endif %}" 
				 role="tabpanel" 
				 aria-hidden="{{ not loop.first }}">
			{{ ptcg::card_pic(id=card_it.id) }}
			{{ ptcg::pokemon_card_info(card=card) }}
		</div>
	{% endfor %}
	{% for card_it in deck.trainers %}
	{% set card = load_data(path="content/ptcg/cards/" ~ card_it.id ~ ".toml") %}
		<div id="tab-trainer-{{ loop.index }}" 
				 class="ptcg-tab-content" 
				 role="tabpanel" 
				 aria-hidden="{{ not loop.first }}">
			{{ ptcg::card_pic(id=card_it.id) }}
			{{ ptcg::trainer_card_info(card=card) }}
		</div>
	{% endfor %}
	{% for card_it in deck.energies %}
	{% set card = load_data(path="content/ptcg/cards/" ~ card_it.id ~ ".toml") %}
		<div id="tab-energy-{{ loop.index }}" 
				 class="ptcg-tab-content energy" 
				 role="tabpanel" 
				 aria-hidden="{{ not loop.first }}">
			{{ ptcg::card_pic(id=card_it.id) }}
			{{ ptcg::energy_card_info(card=card) }}
		</div>
	{% endfor %}
</div>