{%extends 'layout.html.twig' %}
{% block stylesheets %}
  {{parent()}}
  <link href="{{ asset('css/competition.css') }}" media="screen" rel="stylesheet" type="text/css">
  <link href="{{ asset('css/trivial.css') }}" media="screen" rel="stylesheet" type="text/css">
{% endblock %}

{% block body %}
{{ parent() }}    
     <div class="container marketing lista">      
            <div class="competition-return">    
              <div class="competition-return-image"><img src="{{asset('img/competition-return.png')}}"></div>
              {% if app.user.role == 'ROLE_ADMIN' %}
                     <a class="competition-return-text" href="{{ path('competition_list') }}">Volver a Campañas</a>
               {% elseif app.user.role == 'ROLE_TUTOR'%}
                <a class="competition-return-text"  href="{{ path('competition_client_list', {client: app.user.cliente.id}) }}">Volver a Campañas</a>
                {% else %}
                  <a class="competition-return-text" href="{{ path('competition_users_list', {id: app.user.id}) }}">Volver a Campañas</a>
                {% endif %}

            </div>
     
     <div class="fondo col-md-12 competition col-xs-12">
            <div class="record-trivial-name col-md-12 col-xs-12">
              {{trivial.name}}
            </div>
            <div class="col-sm-3  record-trivial-img"><img class="trivial_img" src="{{ asset('images/trivials/'~trivial.image) }}"></div>
            <div class="col-sm-6  badge-trivial-medallas">MEDALLAS</div>
            <!--<div class="col-md-12" >
                <form method="get" action="" class="form-inline" role="search">
                    <div class="form-group " style="text-align:left">
                        <input type="text" name="query" value="{{app.request.get('query')}}" class="form-control left" placeholder="Buscar Medalla" required />
                        <input type="submit" value="Buscar" class="btn btn-default"/>
                    </div>                                                       
                </form>
              </div>-->
            <div id="trivial-badge" class="trivial-edit-form col-md-12 col-xs-12">
                              {% for trivialBadge in pagination %}
                                {% set gained = 0 %}
                                {# Comprueba si el usuario ha conseguido las medallas #}                    
                                {% for userBadge in trivialBadge.badges.badgeUserInReference %}
                                  {% if userBadge.user.id == app.user.id and userBadge.isGained == 1 and userBadge.trivial.id == trivial.id %}
                                    {% set gained = 1 %}
                                  {% endif %}
                                {% endfor %}
                                  <div 
                                  {% if app.user.role == 'ROLE_TUTOR' or gained == 1 %}
                                  class="col-md-4 trivial-badge col-xs-6"
                                {% else %}
                                  class="col-md-4 col-xs-6 trivial-badge trivial-badge-opacity"
                                {% endif %}
                                  >
                                    <div class="col-md-12 col-xs-12 trivial-badge-name">{{trivialBadge.badges.name}}</div>
                                    <div class="col-md-4 col-xs-4 trivial-badge-image"><img src="{{ asset('images/badges/'~trivialBadge.badges.imageName~'') }}" /></div>
                                    <div class="col-md-8 col-xs-8 trivial-badge-description">{{trivialBadge.badges.description}}</div>
                                    <div class="col-md-8 col-xs-8 trivial-badge-rule">{{trivialBadge.badges.rules.concatToString}}</div>
                                  </div>
                              {% endfor %} 
          {% if app.user.role != 'ROLE_USER' %}
            <div class="col-xs-12">                              
              <div class="col-md-2 col-md-offset-5">
                <a class="btn trivial-cateogorias-add" href="{{ path('trivial_badge_edit', {id: trivial.id}) }}">Añadir medalla</a>
              </div>
            </div>
          {% endif %}    
         </div>
         {% if app.user.role == 'ROLE_ADMIN' %}
             <div class="col-xs-12" style="margin:40px 0 30px"> 
                <a class="btn gametool-btn-green btn-add" href="{{ path('competition_list') }}">Volver</a>
            </div>
           {% elseif app.user.role == 'ROLE_TUTOR'%}
           <div class="col-xs-12" style="margin:40px 0 30px"> 
                <a class="btn gametool-btn-green btn-add" href="{{ path('competition_client_list', {client: app.user.cliente.id}) }}">Volver</a>
            </div>
          {% else %}
            <div class="col-xs-12" style="margin:40px 0 30px">
              <a class="btn gametool-btn-green btn-add" href="{{ path('competition_users_list', {id: app.user.id}) }}">Volver</a>
            </div>
        {% endif %}
     </div>
     </div>
                
          {{ include ('Clientes/forms/form.html.twig',{form: updateform_ajax,message:'Are you sure?',id:"form-update",with_submit:false}) }}

 {% endblock %}