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

{% block title %}{{ game.name }}{% endblock %}

{% block header %}
{% if game.getPicture %}
  <section class="modal-card-image">
    <figure class="image is-3by1">
      <img
        src="/images/games/{{ game.getPicture }}"
        alt="{{ game.getName }}"
      />
    </figure>
  </section>
{% endif %}
{% endblock %}

{% block content %}
 <div id="tabs-content">
    <div class="container" id="tab-1">
    	<div class="block">
    		<p>{{ game.getDescription }}</p>
      	</div>
		<div class="block">
			<div class="message is-info">
				<div class="message-header">
					<p>À propos du jeu</p>
					</div>
					<div class="message-body">
    				<ul>
    					<li><strong>Âge recommandé : </strong>{{ game.getAgeRecommendationLabel }}</li>
    					<li><strong>Genres : </strong>{{game.getGenre|map(g => g.genre)|join(', ') }}</li>
    				</ul>
					</div>
  			</div>
  			{% if is_granted('ROLE_MANAGER') %}
  			{# TODO: limiter aux MJ présents #}
  			<div class="block">
  				<p><em>Meneur(euse)s :</em><br/> {{ game.getGamemasters|map(gm => gm.preferedName)|join(', ') }}</p>
  			</div>
  			{%  endif %}
  		</div>
    </div>

 </div>


{% endblock %}