{% extends "index" %}
{% set baseurl = craft.app.sites.primarySite.baseUrl %}
{% set title = "Downloads" %}
{% block content %}
<div class="maxWidthLimit">
	{% set category = craft.app.request.param('category') %}
	{% set factsQuery = craft.entries().section('facts').kategorien(category|t(language="de")) %}

	<h1 class="mt32">
		{{ "Downloads"|t }}
	</h1>
	<form class="fact-filters wm-nav-tag__list">
		{% set allFilterEnabled = true %}
		{% for thema in craft.entries.section('themen').orderBy('title') %}
		{% if (category == thema.slug) or (category|t == thema.slug) %}
		<button id="{{thema.slug}}" type="submit" class="wm-nav-tag__link" name="category" value="{{thema.slug}}"
			disabled>{{thema.title}}</button>
		{% set allFilterEnabled = false %}
		{% else %}
		<button id="{{thema.slug}}" type="submit" class="wm-nav-tag__link" name="category" value="{{thema.slug}}">{{thema.title}}</button>
		{% endif %}
		{% endfor %}
		<button id="alle" type="submit" class="wm-nav-tag__link filter-all" {% if allFilterEnabled==true %} disabled {% endif %}
			value="">{{"Alle"|t}}</button>
	</form>

	{% paginate factsQuery.limit(12) as entries %}
	<div class="news mt16">
		{% for entry in entries %}
		{% set image = entry.images.one() %}
		<div class="wm-card wm-card--m wm-card--linked" data-wm-card>
			<h3 class="wm-card__heading ">
				{% if entry.videoLink %}
				<a href="{{entry.videoLink}}" target="_blank" class="wm-card__link wm-link--unstyled ">
					{{entry.title}}
				</a>
				{% else %}
				<a href="{{entry.url}}" class="wm-card__link wm-link--unstyled ">
					{{entry.title}}
				</a>
				{% endif %}
			</h3>
			<div class="wm-card__media ">
				<img class="wm-image   wm-card__image" loading="lazy" src="{{ baseurl }}/{{image.url}}" width="350" height="197" data-src=""
					alt="Bildbeschreibung">
			</div>
			<div class="wm-card__content wm-rich-text ">
				<p>{{ entry.teaser}}</p>
			</div>
			<div>
				{% if entry.videoLink %}
				<a href="{{entry.videoLink}}" target="_blank" class="wm-em-link">
					<span class="wm-em-link__content">{{ "Video ansehen"|t }}</span>
				</a>
				{% else %}
				<a href="{{entry.url}}" class="wm-em-link">
					<span class="wm-em-link__content">{{ "Mehr lesen"|t }}</span>
				</a>
				{% endif %}
			</div>
		</div>
		{% endfor %}
	</div>
	<nav class="wm-pagination mt32" aria-labelledby="">
		<ol class="wm-pagination__items">
			<li class="wm-pagination__item">
				{% if paginate.prevUrl %}
				<a class="wm-pagination__link  button-prev" href="{{ paginate.prevUrl }}"></a>
				{% endif %}
			</li>

			{% for page, url in paginate.getPrevUrls(5) %}
			<li class="wm-pagination__item">
				<a class="wm-pagination__link" href="{{ url }}">{{ page }}</a>
			</li>
			{% endfor %}
			<li class="wm-pagination__item">
				<span class="current  wm-pagination__link " aria-current="page">{{ paginate.currentPage }}</span>
			</li>

			{% for page, url in paginate.getNextUrls(5) %}
			<li class="wm-pagination__item">
				<a class="wm-pagination__link" href="{{ url }}">{{ page }}</a>
			</li>
			{% endfor %}

			{% if paginate.nextUrl %}
			<li class="wm-pagination__item"></li>
			<a class="wm-pagination__link button-next" href="{{ paginate.nextUrl }}"></a>
			</li>
			{% endif %}
		</ol>
	</nav>

	<!--<a href="{{ paginate.firstUrl }}">First Page</a>
		    {% if paginate.prevUrl %}<a href="{{ paginate.prevUrl }}">Previous Page</a>{% endif %}
		
		    {% for page, url in paginate.getPrevUrls(5) %}
		    <a href="{{ url }}">{{ page }}</a>
		    {% endfor %}
		    <span class="current">{{ paginate.currentPage }}</span>
		
		    {% for page, url in paginate.getNextUrls(5) %}
		    <a href="{{ url }}">{{ page }}</a>
		    {% endfor %}
		
		    {% if paginate.nextUrl %}<a href="{{ paginate.nextUrl }}">Next Page</a>{% endif %}-->

</div>
{% endblock %}