{% if competition.trinders|length == 0 %}
                          <div class="trivial trivial-empty-message col-xs-12">
                            <h2>Aún no se ha creado ningún juego</h2>
                          </div>
                        {% else %}
                              {% for trinder in competition.trinders %}
                        <div id="trivial" class="trivial">
                              {% set cont = 0 %}
                              {% set playsUser = 0 %}
                              {% set contvidas = 0 %}
                              {% set completed = 0 %}
                              {% set noinit = 0 %}
                              {% set inprogress = 0 %}
                                <div id="trivial-name" class="trivial-name-xs col-xs-12">
                                {{trinder.name}}
                              </div>
                              <div class="trivial-description-xs col-xs-12">{{trinder.description}}</div>
                              <div class="trivial-sm-image trivial-xs-1">
                                <img src="{{ asset('images/trivials/'~trinder.image) }}" width="100%" height="auto">
                                <div class="trivial-description">{{trinder.description}}</div>
                              </div>   
                              <div class="trivial-md-6 trivial-data trivial-xs-1">
                                <div class="col-md-11 trivial-name">{{trinder.name}}</div>

{# Logica trivial completado, en progreso, no iniciado #}
{# 
{% for user in trinder.competition.users %}
  {% set finished_attempt = 0 %}
  {% set started_attempt = 0 %}
    {% for attempt in trinder.attempt %}
        {% set wrong_answer = 0 %}
        {% if attempt.trinder.id == trinder.id and attempt.user.id == user.id %}
          {% for tracking in attempt.tracking %}
            {% if tracking.status == 0 %}
              {% set wrong_answer = wrong_answer + 1 %}
            {% endif %}
          {% endfor %}
          {% if attempt.tracking|length > 0 and ((wrong_answer < trinder.life and trinder.life != 0) or (trinder.life == 0)) %}
            {% set finished_attempt = finished_attempt + 1 %}
              {% if user.id == app.user.id %}
                {% set playsUser = playsUser + 1 %}
              {% endif %}
          {% elseif attempt.tracking|length > 0  %}
            {% set started_attempt =  1 %}
          {% endif %}
      {% endif %}
    {% endfor %}

      {% if started_attempt != 0 %}
        {% set completed = completed + 1 %}
      {% else %}
          {% set noinit = noinit + 1 %} 
      {% endif %}

  {% endfor %} #}
{# END logica trivial #}
                        <div class="col-lg-5 trivial-info col-sm-6 col-xs-12">
                                  <table>
                                    <tr class="trivial-info-white">
                                      <td class="trivial-info-title">Vidas:</td>
                                      <td class="trivial-info-number">{% if trinder.life == 0 %}&infin;{% else %}{{trinder.life}}{% endif %}</td>
                                    </tr>
                                    <tr>
                                      <td class="trivial-info-title">Tiempo:</td>
                                      <td class="trivial-info-number">{% if trinder.time == 0 %}&infin;{% else %}{{trinder.time}}{% endif %}</td>
                                    </tr>
                                    <tr class="trivial-info-white">
                                      <td class="trivial-info-title">Categorías:</td>
                                      <td class="trivial-info-number">{{trinder.category|length}}</td>
                                    </tr>
                                  </table>
                                </div>

                                <div class="trivial-players col-lg-offset-1 col-sm-6 col-xs-6">
                                  <table class="trivial-players-table">
                                    <tr>
                                      <td class="trivial-players-title">Jugadores</td>
                                      <td>
                                    </tr>
                                    <tr>
                                      <td class="trivial-players-status trivial-players-total">Total</td>
                                      <td class="trivial-players-number">{{trinder.competition.users|length}}</td>
                                    </tr>
                                    <tr>
                                      <td class="trivial-players-status  trivial-players-completed">Completados</td>
                                      <td class="trivial-players-number">{{completed}}</td>
                                    </tr>
                                    <tr>
                                      <td class="trivial-players-status  trivial-players-noinit">No iniciado</td>
                                      <td class="trivial-players-number">{{noinit}}</td>
                                    </tr>
                                    <tr>
                                      <td class="trivial-players-status trivial-players-inprogress">En progreso</td>
                                      <td class="trivial-players-number">{{inprogress}}</td>
                                    </tr>
                                  </table>
                                </div>                                
                              </div>
                              <div class="trivial-players-mobile trivial-xs-1">
                                  <table class="trivial-players-table">
                                    <tr>
                                      <td class="trivial-players-title">Jugadores</td>
                                      <td>
                                    </tr>
                                    <tr>
                                      <td class="trivial-players-status trivial-players-total">Total</td>
                                      <td class="trivial-players-number">{{trinder.competition.users|length}}</td>
                                    </tr>
                                    <tr>
                                      <td class="trivial-players-status  trivial-players-completed">Completados</td>
                                      <td class="trivial-players-number">{{completed}}</td>
                                    </tr>
                                    <tr>
                                      <td class="trivial-players-status  trivial-players-noinit">No iniciado</td>
                                      <td class="trivial-players-number">{{noinit}}</td>
                                    </tr>
                                    <tr>
                                      <td class="trivial-players-status trivial-players-inprogress">En progreso</td>
                                      <td class="trivial-players-number">{{inprogress}}</td>
                                    </tr>
                                  </table>
                                </div> 
                              <div class="trivial-md-1 trivial-xs-1 trivial-chart-div" style="display:none"> 
                                <div id="trivial-chart-{{trinder.id}}" class=" trivial-chart" data-completed="{{completed}}" data-noinit="{{noinit}}" data-inprogress="{{inprogress}}"></div>
                              </div>                        
                              <div id="actions-{{trinder.id}}"
                              {% if app.user.role == "ROLE_TUTOR" %}
                                  class="trivial-md-1 trivial-actions trivial-actions-tutor trivial-xs-1"
                              {% else %}
                                 class="trivial-md-1 trivial-actions col-sm-12"
                              {% endif %}
                              >
                                <table class="trivial-actions-table" data-trivial="{{trinder.id}}">
                                  {% if app.user.role != "ROLE_TUTOR" %}
                                  <tr 
                                     {% if cont == 1 %}
                                      class="trivial-actions-disabled"
                                      {% else  %}
                                      id="play-game" class="trivial-actions-enabled" data-toggle="modal" data-target="#modalGame" data-href="#" data-id-trivial="{{trinder.id}}"
                                     {% endif %}
                                  >
                                  <a href="#">
                                    <td class="trivial-actions-img">
                                      <img src="{{asset('img/trivial-jugar.png')}}">
                                    </td>
                                    <td class="trivial-actions-table-action">Jugar</td>
                                  </a>
                                  </tr>
                                  {% endif %}
                                  <tr 
                                    {% if trinder.competition.beginAt|date("Y-m-d") > "now"|date("Y-m-d") or app.user.role == 'ROLE_ADMIN' %}
                                        class="trivial-actions-enabled"  data-href="trinder_edit" 
                                    {% else %}
                                       class="trivial-actions-disabled" title="No se puede editar el tivial porque la campaña ya ha iniciado" data-toggle="tooltip"
                                    {% endif %}
                                  title="Editar {{trinder.name}}">
                                    <td class="trivial-actions-img"><img src="{{asset('img/trivial-editar.png')}}"></td>
                                    <td class="trivial-actions-table-action">Editar</td>
                                  </tr>
                                  <tr title="Categorías/Preguntas {{trinder.name}}"
                                    {% if app.user.role == 'ROLE_ADMIN' or app.user.role == 'ROLE_TUTOR' %}
                                      class="trivial-actions-enabled" data-href="category_list" 
                                    {% else %}
                                       class="trivial-actions-disabled"
                                    {% endif %}

                                  >
                                    <td class="trivial-actions-img"><img src="{{asset('img/trivial-categorias.png')}}"></td>
                                    <td class="trivial-actions-table-action">Categorías</td>
                                  </tr>
                                  <tr class="trivial-actions-enabled" data-href="record_list" title="Ránking {{trinder.name}}">
                                    <td class="trivial-actions-img"><img src="{{asset('img/trivial-registro.png')}}"></td>
                                    <td class="trivial-actions-table-action">Registro</td>
                                  </tr>
                                  <tr class="trivial-actions-enabled" data-href="trivial_badge_list" title="Medallas {{trinder.name}}">
                                    <td class="trivial-actions-img"><img src="{{asset('img/trivial-medallas.png')}}"></td>
                                    <td class="trivial-actions-table-action">Medallas</td>
                                  </tr>
                                  <tr
                                    {% if trinder.competition.beginAt|date("Y-m-d") > "now"|date("Y-m-d") or app.user.role == 'ROLE_ADMIN' %}
                                      title="Eliminar {{trinder.name}}" class="trivial-actions-enabled btn-delete-trivial" data-href="#" data-id="{{trinder.id}}" data-name="{{trinder.name}}"
                                    {% else %}
                                       class="trivial-actions-disabled" title="No se puede eliminar el tivial porque la campaña ya ha iniciado" data-toggle="tooltip"
                                    {% endif %}
                                  >

                                    <td class="trivial-actions-img"><img src="{{asset('img/trivial-eliminar.png')}}"></td>
                                    <td class="trivial-actions-table-action">Borrar</td>
                                  </tr>
                                </table>
                              </div>
{# tabla versión movil  #}
                                     {% if app.user.role != "ROLE_TUTOR" %}
                              <div class="col-xs-12 btn-admin-xs">
                                <div
                                {% if cont == 1  %}
                                  class="btn trivial-user-btn-jugar-disabled"
                                {% else %}
                                  class="btn trivial-user-btn-jugar" id="play-game-user" class="trivial-actions-enabled" data-toggle="modal" data-target="#modalGame" data-href="#" data-id-trivial="{{trinder.id}}"
                                {% endif %}
                                >JUGAR<img class="trivial-user-btn-jugar-img" src="{{asset('img/trivial-user-play.png')}}"></div>
                              </div>
                            {% endif %}

                              <div id="actions-{{trinder.id}}"
                              {% if app.user.role == "ROLE_TUTOR" %}
                                  class="trivial-md-1 trivial-actions-tutor col-xs-12"
                              {% else %}
                                 class="trivial-md-1 col-sm-12 col-xs-12" 
                              {% endif %}
                              >
                                <table class="trivial-actions-mobile" data-trivial="{{trinder.id}}">
                                  <tr>
                                    <td
                                    {% if trinder.competition.beginAt|date("Y-m-d") > "now"|date("Y-m-d") or app.user.role == 'ROLE_ADMIN' %}
                                        class="trivial-actions-enabled"  data-href="trinder_edit" 
                                    {% else %}
                                       class="trivial-actions-disabled" title="No se puede editar el tivial porque la campaña ya ha iniciado" data-toggle="tooltip"
                                    {% endif %}
                                  ><img src="{{asset('img/trivial-editar.png')}}"></td>
                                  <td class="trivial-actions-enabled" data-href="category_list"><img src="{{asset('img/trivial-categorias.png')}}"></td>
                                  <td class="trivial-actions-enabled" data-href="record_list"><img src="{{asset('img/trivial-registro.png')}}"></td>
                                  <td class="trivial-actions-enabled" data-href="trivial_badge_list"><img src="{{asset('img/trivial-medallas.png')}}"></td>
                                  <td {% if trinder.competition.beginAt|date("Y-m-d") > "now"|date("Y-m-d") or app.user.role == 'ROLE_ADMIN' %}
                                      class="trivial-actions-enabled btn-delete-trivial" data-href="#" data-id="{{trinder.id}}" data-name="{{trinder.name}}"
                                    {% else %}
                                       class="trivial-actions-disabled" title="No se puede eliminar el tivial porque la campaña ya ha iniciado" data-toggle="tooltip"
                                    {% endif %}
                                  ><img src="{{asset('img/trivial-eliminar.png')}}"></td>                                
                                  </tr>
                                  <tr>
                                    <td
                                    {% if trinder.competition.beginAt|date("Y-m-d") > "now"|date("Y-m-d") or app.user.role == 'ROLE_ADMIN' %}
                                        class="trivial-actions-enabled"  data-href="trinder_edit" 
                                    {% else %}
                                       class="trivial-actions-disabled" title="No se puede editar el tivial porque la campaña ya ha iniciado" data-toggle="tooltip"
                                    {% endif %}
                                  >Editar</td>
                                  <td class="trivial-actions-enabled" data-href="category_list">Categorías</td>
                                  <td class="trivial-actions-enabled" data-href="record_list">Registro</td>
                                  <td class="trivial-actions-enabled" data-href="trivial_badge_list">Medallas</td>
                                  <td 
                                  {% if trinder.competition.beginAt|date("Y-m-d") > "now"|date("Y-m-d") or app.user.role == 'ROLE_ADMIN' %}
                                      class="trivial-actions-enabled btn-delete-trivial" data-href="#" data-id="{{trinder.id}}" data-name="{{trinder.name}}"
                                    {% else %}
                                       class="trivial-actions-disabled" title="No se puede eliminar el tivial porque la campaña ya ha iniciado" data-toggle="tooltip"
                                    {% endif %}
                                  >Eliminar</td>                                
                                  </tr>

                                </table>
                              </div>
                              </div>  
                     {{ include ('Clientes/forms/form.html.twig',{form: deleteform_trivial_ajax,type:'el trinder', name:trinder.name, id:"form-delete",with_submit:false}) }}

                      {% endfor %}
             {% endif %}    
            {% if app.user.role == 'ROLE_ADMIN' or  competition.finalizeAt|date("Y-m-d") >= "now"|date("Y-m-d") %}
                <a class="btn trivial-button-add btn-add " data-toggle="modal" data-target="#trinderModal-{{competition.id}}" href="#">Crear juego<span class="trivial-button-add-plus"><img src="{{asset('img/trivial-add-button.png')}}"></span></a>
            {% endif %}  
             {# {% if competition.finalizeAt|date("Y-m-d") < "now"|date("Y-m-d") or app.user.role == "ROLE_ADMIN" %} #}
                <div>
                <div class="download-competition col-xs-1 pull-right no-padd"><a class="btn" title="Exportar datos de {{competition.name}}" href="{{path('competition_export_options',{id: competition.id})}}"><img src="{{asset('img/downloadDocument.png')}}"></a></div>
                </div>
            {# {% endif %}                    #}
                {#display navigation#}
                <div class="navigation">
                    {{ knp_pagination_render(pagination)}}
                </div>
                <!-- Modal -->
                <div class="modal fade" id="modalGame" role="dialog">
                  <div class="modal-dialog">                  
                    <!-- Modal content-->
                    <div class="modal-content">
                      <div style="padding:5px" class="modal-header" style="background-color:#F0F0F0">
                          <div class="col-md-1 col-md-offset-11 col-xs-1 col-xs-offset-10">
                            <button id="btn-close" type="button" class="btn btn-default" data-dismiss="modal">X</button>                    
                          </div>                          
                        </div>
                      <div id="game" class="trivial-game">
                      </div>
                    </div>
                  </div>
                </div>
                   {{ include ('Trivial/forms/addTrinderform.html.twig',{form: addform_trivial_ajax,message:'Estás seguro?',id:"trinderModal-"~competition.id,with_submit:false}) }}
                   {{ include ('Badges/forms/reward.html.twig') }}