{% extends 'base.html.twig' %}

{% block title %}ManiGalerie | Photos
{% endblock %}

{% block content %}

	{% if pictures|length <= 0 %}
		<div class="container mt-4">
			<div class="row bordrline">
				<div class="col-md-8 p-5">
					<h2 class="title-noalbum">Aucune photo pour l'instant..</h2>
					<p>L'album n'a pour l'instant aucune photo à son actif</p>
					<p>Nous avons besoin de vous :</p>
					<p>Si vous possédez des photos, n’hésitez pas à les envoyer à 
																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																							l’adresse suivante : photo@asmanissieux.fr</p>
					<a class="btn-block returnback" onclick="history.back()">Revenir en arrière</a>
				</div>
				<div class="col-md-4">
					<img src="{{ asset('assets/img/cloud-data1.svg') }}" alt="image erreur pas d'album" class="imgright">

				</div>

			</div>
		</div>
	{% else %}
		<div class="container head-description mt-4 mb-4">
			<img class="leftimg" src="{{ asset('assets/img/travel.svg') }}" alt="Icone photo">
			<div class="desc-album">
				<p>
					<span class="font-weight-bold">Album :</span>
					{{ album.name }}</p>
				<p>
					<span class="font-weight-bold">Catégorie :
					</span>
					{{ album.category.name }}</p>

			</div>
			<div class="nav-album">
				<a class="button-nav hover" href="#">Télécharger l'album</a>
				<a class="button-nav hover" onclick="history.back()">Revenir en arrière</a>
			</div>
		</div>
		<div class="container">
			<div class="row">

				{% for picture in pictures %}


					<div class="col-sm-6 col-md-4 col-lg-3">
						{% if is_granted('ROLE_ADMIN') %}
							<div class="dlt">
								<a class="text-white" href="{{ asset('pictures/album/pictures/') }}{{ picture.image }}" download>
									<i class="bi bi-box-arrow-down"></i>
								</a>
							</div>
						{% endif %}
						<a href="{{ asset('pictures/album/pictures/') }}{{ picture.image }}" data-lightbox="mygallery">
							<img src="{{ asset('pictures/album/pictures/') }}{{ picture.image }}" alt="photo {{ picture.category.name }}" class="img-fluid"></a>
					</div>

				{% endfor %}
			</div>
		</div>
	{% endif %}
{% endblock %}